kexsh/agent-chat-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add loading state to thread list

Browse Source
This commit is contained in:
bracesproul
2025-03-05 09:55:09 -08:00
parent 3ee8afce9b
commit a82316f613
6 changed files with 623 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
package.json
View File

@@ -14,6 +14,7 @@
"dependencies": {
"@assistant-ui/react": "^0.8.0",
"@assistant-ui/react-markdown": "^0.8.0",
"@assistant-ui/react-syntax-highlighter": "^0.7.2",
"@langchain/core": "^0.3.41",
"@langchain/google-genai": "^0.1.10",
"@langchain/langgraph": "^0.2.49",
@@ -33,6 +34,7 @@
"esbuild": "^0.25.0",
"esbuild-plugin-tailwindcss": "^2.0.1",
"framer-motion": "^12.4.9",
"katex": "^0.16.21",
"lucide-react": "^0.476.0",
"next-themes": "^0.4.4",
"prettier": "^3.5.2",
@@ -40,7 +42,10 @@
"react-dom": "^19.0.0",
"react-markdown": "^10.0.1",
"react-router-dom": "^6.17.0",
"react-syntax-highlighter": "^15.5.0",
"rehype-katex": "^7.0.1",
"remark-gfm": "^4.0.1",
"remark-math": "^6.0.0",
"sonner": "^2.0.1",
"tailwind-merge": "^3.0.2",
"tailwindcss-animate": "^1.0.7",
@@ -59,6 +64,7 @@
"@types/node": "^22.13.5",
"@types/react": "^19.0.8",
"@types/react-dom": "^19.0.3",
"@types/react-syntax-highlighter": "^15.5.13",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"eslint": "^9.19.0",

548
pnpm-lock.yaml generated
View File

@@ -18,6 +18,9 @@ importers:
"@assistant-ui/react-markdown":
specifier: ^0.8.0
version: 0.8.0(@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
"@assistant-ui/react-syntax-highlighter":
specifier: ^0.7.2
version: 0.7.10(@assistant-ui/react-markdown@0.8.0(@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react-syntax-highlighter@15.5.13)(@types/react@19.0.10)(react-syntax-highlighter@15.6.1(react@19.0.0))(react@19.0.0)
"@langchain/core":
specifier: ^0.3.41
version: 0.3.41(openai@4.85.4(zod@3.24.2))
@@ -75,6 +78,9 @@ importers:
framer-motion:
specifier: ^12.4.9
version: 12.4.9(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
katex:
specifier: ^0.16.21
version: 0.16.21
lucide-react:
specifier: ^0.476.0
version: 0.476.0(react@19.0.0)
@@ -96,9 +102,18 @@ importers:
react-router-dom:
specifier: ^6.17.0
version: 6.30.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
react-syntax-highlighter:
specifier: ^15.5.0
version: 15.6.1(react@19.0.0)
rehype-katex:
specifier: ^7.0.1
version: 7.0.1
remark-gfm:
specifier: ^4.0.1
version: 4.0.1
remark-math:
specifier: ^6.0.0
version: 6.0.0
sonner:
specifier: ^2.0.1
version: 2.0.1(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
@@ -133,6 +148,9 @@ importers:
"@types/react-dom":
specifier: ^19.0.3
version: 19.0.4(@types/react@19.0.10)
"@types/react-syntax-highlighter":
specifier: ^15.5.13
version: 15.5.13
"@vitejs/plugin-react":
specifier: ^4.3.4
version: 4.3.4(vite@6.2.0(@types/node@22.13.5)(jiti@2.4.2)(lightningcss@1.29.1)(tsx@4.19.3)(yaml@2.7.0))
@@ -202,6 +220,24 @@ packages:
"@types/react":
optional: true
"@assistant-ui/react-syntax-highlighter@0.7.10":
resolution:
{
integrity: sha512-3kMxAl46ks3zW5ruW1a0dpcH57Ef19CIiXE4mYQp1+JXLQnaaaSHfd5x+TuzVlbH/wQyAtZIeHtceM3J4TUAeQ==,
}
peerDependencies:
"@assistant-ui/react": ^0.7.71
"@assistant-ui/react-markdown": ^0.7.18
"@types/react": "*"
"@types/react-syntax-highlighter": "*"
react: ^18 || ^19 || ^19.0.0-rc
react-syntax-highlighter: ^15.5.0
peerDependenciesMeta:
"@types/react":
optional: true
"@types/react-syntax-highlighter":
optional: true
"@assistant-ui/react@0.8.0":
resolution:
{
@@ -1816,6 +1852,12 @@ packages:
integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==,
}
"@types/hast@2.3.10":
resolution:
{
integrity: sha512-McWspRw8xx8J9HurkVBfYj0xKoE25tOFlHGdx4MJ5xORQrMGZNqJhVQWaIbm6Oyla5kYOXtDiopzKRJzEOkwJw==,
}
"@types/hast@3.0.4":
resolution:
{
@@ -1828,6 +1870,12 @@ packages:
integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==,
}
"@types/katex@0.16.7":
resolution:
{
integrity: sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==,
}
"@types/mdast@4.0.4":
resolution:
{
@@ -1872,6 +1920,12 @@ packages:
peerDependencies:
"@types/react": ^19.0.0
"@types/react-syntax-highlighter@15.5.13":
resolution:
{
integrity: sha512-uLGJ87j6Sz8UaBAooU0T6lWJ0dBmjZgN1PZTrj05TNql2/XpC6+4HhMT5syIdFUUt+FASfCeLLv4kBygNU+8qA==,
}
"@types/react@19.0.10":
resolution:
{
@@ -2224,18 +2278,36 @@ packages:
integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==,
}
character-entities-legacy@1.1.4:
resolution:
{
integrity: sha512-3Xnr+7ZFS1uxeiUDvV02wQ+QDbc55o97tIV5zHScSPJpcLm/r0DFPcoY3tYRp+VZukxuMeKgXYmsXQHO05zQeA==,
}
character-entities-legacy@3.0.0:
resolution:
{
integrity: sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==,
}
character-entities@1.2.4:
resolution:
{
integrity: sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==,
}
character-entities@2.0.2:
resolution:
{
integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==,
}
character-reference-invalid@1.1.4:
resolution:
{
integrity: sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg==,
}
character-reference-invalid@2.0.1:
resolution:
{
@@ -2332,6 +2404,12 @@ packages:
}
engines: { node: ">= 0.8" }
comma-separated-tokens@1.0.8:
resolution:
{
integrity: sha512-GHuDRO12Sypu2cV70d1dkA2EUmXHgntrzbpvOB+Qy+49ypNfGgFQIC2fhhXbnyrJRynDCAARsT7Ou0M6hirpfw==,
}
comma-separated-tokens@2.0.3:
resolution:
{
@@ -2352,6 +2430,13 @@ packages:
}
engines: { node: ">=18" }
commander@8.3.0:
resolution:
{
integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==,
}
engines: { node: ">= 12" }
concat-map@0.0.1:
resolution:
{
@@ -2552,6 +2637,13 @@ packages:
}
engines: { node: ">=10.13.0" }
entities@4.5.0:
resolution:
{
integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==,
}
engines: { node: ">=0.12" }
es-define-property@1.0.1:
resolution:
{
@@ -2787,6 +2879,12 @@ packages:
integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==,
}
fault@1.0.4:
resolution:
{
integrity: sha512-CJ0HCB5tL5fYTEA7ToAq5+kTwd++Borf1/bifxd9iT70QcXr4MRrO3Llf8Ifs70q+SJcGHFtnIE/Nw6giCtECA==,
}
fd-slicer@1.1.0:
resolution:
{
@@ -2866,6 +2964,13 @@ packages:
}
engines: { node: ">= 6" }
format@0.2.2:
resolution:
{
integrity: sha512-wzsgA6WOq+09wrU1tsJ09udeR/YZRaeArL9e1wPbFg3GG2yDnC2ldKpxs4xunpFF9DgqCqOIra3bc1HWrJ37Ww==,
}
engines: { node: ">=0.4.x" }
formdata-node@4.4.1:
resolution:
{
@@ -3053,18 +3158,90 @@ packages:
}
engines: { node: ">= 0.4" }
hast-util-from-dom@5.0.1:
resolution:
{
integrity: sha512-N+LqofjR2zuzTjCPzyDUdSshy4Ma6li7p/c3pA78uTwzFgENbgbUrm2ugwsOdcjI1muO+o6Dgzp9p8WHtn/39Q==,
}
hast-util-from-html-isomorphic@2.0.0:
resolution:
{
integrity: sha512-zJfpXq44yff2hmE0XmwEOzdWin5xwH+QIhMLOScpX91e/NSGPsAzNCvLQDIEPyO2TXi+lBmU6hjLIhV8MwP2kw==,
}
hast-util-from-html@2.0.3:
resolution:
{
integrity: sha512-CUSRHXyKjzHov8yKsQjGOElXy/3EKpyX56ELnkHH34vDVw1N1XSQ1ZcAvTyAPtGqLTuKP/uxM+aLkSPqF/EtMw==,
}
hast-util-from-parse5@8.0.3:
resolution:
{
integrity: sha512-3kxEVkEKt0zvcZ3hCRYI8rqrgwtlIOFMWkbclACvjlDw8Li9S2hk/d51OI0nr/gIpdMHNepwgOKqZ/sy0Clpyg==,
}
hast-util-is-element@3.0.0:
resolution:
{
integrity: sha512-Val9mnv2IWpLbNPqc/pUem+a7Ipj2aHacCwgNfTiK0vJKl0LF+4Ba4+v1oPHFpf3bLYmreq0/l3Gud9S5OH42g==,
}
hast-util-parse-selector@2.2.5:
resolution:
{
integrity: sha512-7j6mrk/qqkSehsM92wQjdIgWM2/BW61u/53G6xmC8i1OmEdKLHbk419QKQUjz6LglWsfqoiHmyMRkP1BGjecNQ==,
}
hast-util-parse-selector@4.0.0:
resolution:
{
integrity: sha512-wkQCkSYoOGCRKERFWcxMVMOcYE2K1AaNLU8DXS9arxnLOUEWbOXKXiJUNzEpqZ3JOKpnha3jkFrumEjVliDe7A==,
}
hast-util-to-jsx-runtime@2.3.5:
resolution:
{
integrity: sha512-gHD+HoFxOMmmXLuq9f2dZDMQHVcplCVpMfBNRpJsF03yyLZvJGzsFORe8orVuYDX9k2w0VH0uF8oryFd1whqKQ==,
}
hast-util-to-text@4.0.2:
resolution:
{
integrity: sha512-KK6y/BN8lbaq654j7JgBydev7wuNMcID54lkRav1P0CaE1e47P72AWWPiGKXTJU271ooYzcvTAn/Zt0REnvc7A==,
}
hast-util-whitespace@3.0.0:
resolution:
{
integrity: sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw==,
}
hastscript@6.0.0:
resolution:
{
integrity: sha512-nDM6bvd7lIqDUiYEiu5Sl/+6ReP0BMk/2f4U/Rooccxkj0P5nm+acM5PrGJ/t5I8qPGiqZSE6hVAwZEdZIvP4w==,
}
hastscript@9.0.1:
resolution:
{
integrity: sha512-g7df9rMFX/SPi34tyGCyUBREQoKkapwdY/T04Qn9TDWfHhAYt4/I0gMVirzK5wEzeUqIjEB+LXC/ypb7Aqno5w==,
}
highlight.js@10.7.3:
resolution:
{
integrity: sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==,
}
highlightjs-vue@1.0.0:
resolution:
{
integrity: sha512-PDEfEF102G23vHmPhLyPboFCD+BkMGu+GuJe2d9/eH4FsCwvgBpnc9n0pGE+ffKdph38s6foEZiEjdgHdzp+IA==,
}
hono@4.7.2:
resolution:
{
@@ -3133,12 +3310,24 @@ packages:
integrity: sha512-0aO8FkhNZlj/ZIbNi7Lxxr12obT7cL1moPfE4tg1LkX7LlLfC6DeX4l2ZEud1ukP9jNQyNnfzQVqwbwmAATY4Q==,
}
is-alphabetical@1.0.4:
resolution:
{
integrity: sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==,
}
is-alphabetical@2.0.1:
resolution:
{
integrity: sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==,
}
is-alphanumerical@1.0.4:
resolution:
{
integrity: sha512-UzoZUr+XfVz3t3v4KyGEniVL9BDRoQtY7tOyrRybkVNjDFWyo1yhXNGrrBTQxp3ib9BLAWs7k2YKBQsFRkZG9A==,
}
is-alphanumerical@2.0.1:
resolution:
{
@@ -3151,6 +3340,12 @@ packages:
integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==,
}
is-decimal@1.0.4:
resolution:
{
integrity: sha512-RGdriMmQQvZ2aqaQq3awNA6dCGtKpiDFcOzrTWrDAT2MiWrKQVPmxLGHl7Y2nNu6led0kEyoX0enY0qXYsv9zw==,
}
is-decimal@2.0.1:
resolution:
{
@@ -3186,6 +3381,12 @@ packages:
}
engines: { node: ">=0.10.0" }
is-hexadecimal@1.0.4:
resolution:
{
integrity: sha512-gyPJuv83bHMpocVYoqof5VDiZveEoGoFL8m3BXNb2VW8Xs+rz9kqO8LOQ5DH6EsuvilT1ApazU0pyl+ytbPtlw==,
}
is-hexadecimal@2.0.1:
resolution:
{
@@ -3327,6 +3528,13 @@ packages:
engines: { node: ">=6" }
hasBin: true
katex@0.16.21:
resolution:
{
integrity: sha512-XvqR7FgOHtWupfMiigNzmh+MgUVmDGU2kXZm899ZkPfcuoPuFxyHmXsgATDpFZDAXCI8tvinaVcDo8PIIJSo4A==,
}
hasBin: true
keyv@4.5.4:
resolution:
{
@@ -3504,6 +3712,12 @@ packages:
integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==,
}
lowlight@1.20.0:
resolution:
{
integrity: sha512-8Ktj+prEb1RoCPkEOrPMYUN/nCggB7qAWe3a7OpMjWQkh3l2RD5wKRQ+o8Q8YuI9RG/xs95waaI/E6ym/7NsTw==,
}
lru-cache@10.4.3:
resolution:
{
@@ -3585,6 +3799,12 @@ packages:
integrity: sha512-0ulfdQOM3ysHhCJ1p06l0b0VKlhU0wuQs3thxZQagjcjPrlFRqY215uZGHHJan9GEAXd9MbfPjFJz+qMkVR6zQ==,
}
mdast-util-math@3.0.0:
resolution:
{
integrity: sha512-Tl9GBNeG/AhJnQM221bJR2HPvLOSnLE/T9cJI9tlc6zwQk2nPk/4f0cHkOdEixQPC/j8UtKDdITswvLAy1OZ1w==,
}
mdast-util-mdx-expression@2.0.1:
resolution:
{
@@ -3682,6 +3902,12 @@ packages:
integrity: sha512-vsKArQsicm7t0z2GugkCKtZehqUm31oeGBV/KVSorWSy8ZlNAv7ytjFhvaryUiCUJYqs+NoE6AFhpQvBTM6Q4w==,
}
micromark-extension-math@3.1.0:
resolution:
{
integrity: sha512-lvEqd+fHjATVs+2v/8kg9i5Q0AP2k85H0WUOwpIVvUML8BapsMvh1XAogmQjOCsLpoKRCVQqEkQBB3NhVBcsOg==,
}
micromark-factory-destination@2.0.1:
resolution:
{
@@ -4041,6 +4267,12 @@ packages:
}
engines: { node: ">=6" }
parse-entities@2.0.0:
resolution:
{
integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==,
}
parse-entities@4.0.2:
resolution:
{
@@ -4054,6 +4286,12 @@ packages:
}
engines: { node: ">=18" }
parse5@7.2.1:
resolution:
{
integrity: sha512-BuBYQYlv1ckiPdQi/ohiivi9Sagc9JG+Ozs0r7b/0iK3sKmrb0b9FdWdBbOdx6hBCM/F9Ir82ofnBhtZOjCRPQ==,
}
path-exists@4.0.0:
resolution:
{
@@ -4195,6 +4433,26 @@ packages:
peerDependencies:
react: ">=16.0.0"
prismjs@1.27.0:
resolution:
{
integrity: sha512-t13BGPUlFDR7wRB5kQDG4jjl7XeuH6jbJGt11JHPL96qwsEHNX2+68tFXqc1/k+/jALsbSWJKUOT/hcYAZ5LkA==,
}
engines: { node: ">=6" }
prismjs@1.29.0:
resolution:
{
integrity: sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q==,
}
engines: { node: ">=6" }
property-information@5.6.0:
resolution:
{
integrity: sha512-YUHSPk+A30YPv+0Qf8i9Mbfe/C0hdPXk1s1jPVToV8pk8BQtpw10ct89Eo7OWkutrwqvT0eicAxlOg3dOAu8JA==,
}
property-information@7.0.0:
resolution:
{
@@ -4311,6 +4569,14 @@ packages:
"@types/react":
optional: true
react-syntax-highlighter@15.6.1:
resolution:
{
integrity: sha512-OqJ2/vL7lEeV5zTJyG7kmARppUjiB9h9udl4qHQjjgEos66z00Ia0OckwYfRxCSFrW8RJIBnsBwQsHZbVPspqg==,
}
peerDependencies:
react: ">= 0.14.0"
react-textarea-autosize@8.5.7:
resolution:
{
@@ -4341,18 +4607,36 @@ packages:
}
engines: { node: ">= 14.18.0" }
refractor@3.6.0:
resolution:
{
integrity: sha512-MY9W41IOWxxk31o+YvFCNyNzdkc9M20NoZK5vq6jkv4I/uh2zkWcfudj0Q1fovjUQJrNewS9NMzeTtqPf+n5EA==,
}
regenerator-runtime@0.14.1:
resolution:
{
integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==,
}
rehype-katex@7.0.1:
resolution:
{
integrity: sha512-OiM2wrZ/wuhKkigASodFoo8wimG3H12LWQaH8qSPVJn9apWKFSH3YOCtbKpBorTVw/eI7cuT21XBbvwEswbIOA==,
}
remark-gfm@4.0.1:
resolution:
{
integrity: sha512-1quofZ2RQ9EWdeN34S79+KExV1764+wCUGop5CPL1WGdD0ocPpu91lzPGbwWMECpEpd42kJGQwzRfyov9j4yNg==,
}
remark-math@6.0.0:
resolution:
{
integrity: sha512-MMqgnP74Igy+S3WwnhQ7kqGlEerTETXMvJhrUzDikVZ2/uogJCb+WHUg97hK9/jcfc0dkD73s3LN8zU49cTEtA==,
}
remark-parse@11.0.0:
resolution:
{
@@ -4521,6 +4805,12 @@ packages:
}
engines: { node: ">=0.10.0" }
space-separated-tokens@1.1.5:
resolution:
{
integrity: sha512-q/JSVd1Lptzhf5bkYm4ob4iWPjx0KiRe3sRFBNrVqbJkFaBm5vbbowy1mymoPNLRa52+oadOhJ+K49wsSeSjTA==,
}
space-separated-tokens@2.0.2:
resolution:
{
@@ -4781,6 +5071,12 @@ packages:
integrity: sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==,
}
unist-util-find-after@5.0.0:
resolution:
{
integrity: sha512-amQa0Ep2m6hE2g72AugUItjbuM8X8cGQnFoHk0pGfrFeT9GZhzN5SW8nRsiGKK7Aif4CrACPENkA6P/Lw6fHGQ==,
}
unist-util-is@6.0.0:
resolution:
{
@@ -4793,6 +5089,12 @@ packages:
integrity: sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==,
}
unist-util-remove-position@5.0.0:
resolution:
{
integrity: sha512-Hp5Kh3wLxv0PHj9m2yZhhLt58KzPtEYKQQ4yxfYFEO7EvHwzyDYnduhHnY1mDxoqr7VUwVuHXk9RXKIiYS1N8Q==,
}
unist-util-stringify-position@4.0.0:
resolution:
{
@@ -4939,6 +5241,12 @@ packages:
}
hasBin: true
vfile-location@5.0.3:
resolution:
{
integrity: sha512-5yXvWDEgqeiYiBe1lbxYF7UMAIm/IcopxMHrMQDq3nvKcjPKIhZklUKL+AE7J7uApI4kwe2snsK+eI6UTj9EHg==,
}
vfile-message@4.0.2:
resolution:
{
@@ -4994,6 +5302,12 @@ packages:
yaml:
optional: true
web-namespaces@2.0.1:
resolution:
{
integrity: sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==,
}
web-streams-polyfill@4.0.0-beta.3:
resolution:
{
@@ -5068,6 +5382,13 @@ packages:
integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==,
}
xtend@4.0.2:
resolution:
{
integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==,
}
engines: { node: ">=0.4" }
yallist@3.1.1:
resolution:
{
@@ -5178,6 +5499,16 @@ snapshots:
- react-dom
- supports-color
"@assistant-ui/react-syntax-highlighter@0.7.10(@assistant-ui/react-markdown@0.8.0(@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react-syntax-highlighter@15.5.13)(@types/react@19.0.10)(react-syntax-highlighter@15.6.1(react@19.0.0))(react@19.0.0)":
dependencies:
"@assistant-ui/react": 0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
"@assistant-ui/react-markdown": 0.8.0(@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
react: 19.0.0
react-syntax-highlighter: 15.6.1(react@19.0.0)
optionalDependencies:
"@types/react": 19.0.10
"@types/react-syntax-highlighter": 15.5.13
"@assistant-ui/react@0.8.0(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)":
dependencies:
"@ai-sdk/provider": 1.0.9
@@ -6145,12 +6476,18 @@ snapshots:
"@types/estree@1.0.6": {}
"@types/hast@2.3.10":
dependencies:
"@types/unist": 2.0.11
"@types/hast@3.0.4":
dependencies:
"@types/unist": 3.0.3
"@types/json-schema@7.0.15": {}
"@types/katex@0.16.7": {}
"@types/mdast@4.0.4":
dependencies:
"@types/unist": 3.0.3
@@ -6176,6 +6513,10 @@ snapshots:
dependencies:
"@types/react": 19.0.10
"@types/react-syntax-highlighter@15.5.13":
dependencies:
"@types/react": 19.0.10
"@types/react@19.0.10":
dependencies:
csstype: 3.1.3
@@ -6402,10 +6743,16 @@ snapshots:
character-entities-html4@2.1.0: {}
character-entities-legacy@1.1.4: {}
character-entities-legacy@3.0.0: {}
character-entities@1.2.4: {}
character-entities@2.0.2: {}
character-reference-invalid@1.1.4: {}
character-reference-invalid@2.0.1: {}
chokidar@4.0.3:
@@ -6455,12 +6802,16 @@ snapshots:
dependencies:
delayed-stream: 1.0.0
comma-separated-tokens@1.0.8: {}
comma-separated-tokens@2.0.3: {}
commander@10.0.1: {}
commander@13.1.0: {}
commander@8.3.0: {}
concat-map@0.0.1: {}
console-table-printer@2.12.1:
@@ -6545,6 +6896,8 @@ snapshots:
graceful-fs: 4.2.11
tapable: 2.2.1
entities@4.5.0: {}
es-define-property@1.0.1: {}
es-errors@1.3.0: {}
@@ -6757,6 +7110,10 @@ snapshots:
dependencies:
reusify: 1.1.0
fault@1.0.4:
dependencies:
format: 0.2.2
fd-slicer@1.1.0:
dependencies:
pend: 1.2.0
@@ -6803,6 +7160,8 @@ snapshots:
es-set-tostringtag: 2.1.0
mime-types: 2.1.35
format@0.2.2: {}
formdata-node@4.4.1:
dependencies:
node-domexception: 1.0.0
@@ -6904,6 +7263,49 @@ snapshots:
dependencies:
function-bind: 1.1.2
hast-util-from-dom@5.0.1:
dependencies:
"@types/hast": 3.0.4
hastscript: 9.0.1
web-namespaces: 2.0.1
hast-util-from-html-isomorphic@2.0.0:
dependencies:
"@types/hast": 3.0.4
hast-util-from-dom: 5.0.1
hast-util-from-html: 2.0.3
unist-util-remove-position: 5.0.0
hast-util-from-html@2.0.3:
dependencies:
"@types/hast": 3.0.4
devlop: 1.1.0
hast-util-from-parse5: 8.0.3
parse5: 7.2.1
vfile: 6.0.3
vfile-message: 4.0.2
hast-util-from-parse5@8.0.3:
dependencies:
"@types/hast": 3.0.4
"@types/unist": 3.0.3
devlop: 1.1.0
hastscript: 9.0.1
property-information: 7.0.0
vfile: 6.0.3
vfile-location: 5.0.3
web-namespaces: 2.0.1
hast-util-is-element@3.0.0:
dependencies:
"@types/hast": 3.0.4
hast-util-parse-selector@2.2.5: {}
hast-util-parse-selector@4.0.0:
dependencies:
"@types/hast": 3.0.4
hast-util-to-jsx-runtime@2.3.5:
dependencies:
"@types/estree": 1.0.6
@@ -6924,10 +7326,37 @@ snapshots:
transitivePeerDependencies:
- supports-color
hast-util-to-text@4.0.2:
dependencies:
"@types/hast": 3.0.4
"@types/unist": 3.0.3
hast-util-is-element: 3.0.0
unist-util-find-after: 5.0.0
hast-util-whitespace@3.0.0:
dependencies:
"@types/hast": 3.0.4
hastscript@6.0.0:
dependencies:
"@types/hast": 2.3.10
comma-separated-tokens: 1.0.8
hast-util-parse-selector: 2.2.5
property-information: 5.6.0
space-separated-tokens: 1.1.5
hastscript@9.0.1:
dependencies:
"@types/hast": 3.0.4
comma-separated-tokens: 2.0.3
hast-util-parse-selector: 4.0.0
property-information: 7.0.0
space-separated-tokens: 2.0.2
highlight.js@10.7.3: {}
highlightjs-vue@1.0.0: {}
hono@4.7.2: {}
html-url-attributes@3.0.1: {}
@@ -6955,8 +7384,15 @@ snapshots:
inline-style-parser@0.2.4: {}
is-alphabetical@1.0.4: {}
is-alphabetical@2.0.1: {}
is-alphanumerical@1.0.4:
dependencies:
is-alphabetical: 1.0.4
is-decimal: 1.0.4
is-alphanumerical@2.0.1:
dependencies:
is-alphabetical: 2.0.1
@@ -6964,6 +7400,8 @@ snapshots:
is-arrayish@0.3.2: {}
is-decimal@1.0.4: {}
is-decimal@2.0.1: {}
is-docker@3.0.0: {}
@@ -6976,6 +7414,8 @@ snapshots:
dependencies:
is-extglob: 2.1.1
is-hexadecimal@1.0.4: {}
is-hexadecimal@2.0.1: {}
is-inside-container@1.0.0:
@@ -7030,6 +7470,10 @@ snapshots:
json5@2.2.3: {}
katex@0.16.21:
dependencies:
commander: 8.3.0
keyv@4.5.4:
dependencies:
json-buffer: 3.0.1
@@ -7130,6 +7574,11 @@ snapshots:
longest-streak@3.1.0: {}
lowlight@1.20.0:
dependencies:
fault: 1.0.4
highlight.js: 10.7.3
lru-cache@10.4.3: {}
lru-cache@5.1.1:
@@ -7225,6 +7674,18 @@ snapshots:
transitivePeerDependencies:
- supports-color
mdast-util-math@3.0.0:
dependencies:
"@types/hast": 3.0.4
"@types/mdast": 4.0.4
devlop: 1.1.0
longest-streak: 3.1.0
mdast-util-from-markdown: 2.0.2
mdast-util-to-markdown: 2.1.2
unist-util-remove-position: 5.0.0
transitivePeerDependencies:
- supports-color
mdast-util-mdx-expression@2.0.1:
dependencies:
"@types/estree-jsx": 1.0.5
@@ -7376,6 +7837,16 @@ snapshots:
micromark-util-combine-extensions: 2.0.1
micromark-util-types: 2.0.1
micromark-extension-math@3.1.0:
dependencies:
"@types/katex": 0.16.7
devlop: 1.1.0
katex: 0.16.21
micromark-factory-space: 2.0.1
micromark-util-character: 2.1.1
micromark-util-symbol: 2.0.1
micromark-util-types: 2.0.1
micromark-factory-destination@2.0.1:
dependencies:
micromark-util-character: 2.1.1
@@ -7620,6 +8091,15 @@ snapshots:
dependencies:
callsites: 3.1.0
parse-entities@2.0.0:
dependencies:
character-entities: 1.2.4
character-entities-legacy: 1.1.4
character-reference-invalid: 1.1.4
is-alphanumerical: 1.0.4
is-decimal: 1.0.4
is-hexadecimal: 1.0.4
parse-entities@4.0.2:
dependencies:
"@types/unist": 2.0.11
@@ -7632,6 +8112,10 @@ snapshots:
parse-ms@4.0.0: {}
parse5@7.2.1:
dependencies:
entities: 4.5.0
path-exists@4.0.0: {}
path-key@3.1.1: {}
@@ -7709,6 +8193,14 @@ snapshots:
clsx: 2.1.1
react: 19.0.0
prismjs@1.27.0: {}
prismjs@1.29.0: {}
property-information@5.6.0:
dependencies:
xtend: 4.0.2
property-information@7.0.0: {}
pump@3.0.2:
@@ -7802,6 +8294,16 @@ snapshots:
optionalDependencies:
"@types/react": 19.0.10
react-syntax-highlighter@15.6.1(react@19.0.0):
dependencies:
"@babel/runtime": 7.26.9
highlight.js: 10.7.3
highlightjs-vue: 1.0.0
lowlight: 1.20.0
prismjs: 1.29.0
react: 19.0.0
refractor: 3.6.0
react-textarea-autosize@8.5.7(@types/react@19.0.10)(react@19.0.0):
dependencies:
"@babel/runtime": 7.26.9
@@ -7821,8 +8323,24 @@ snapshots:
readdirp@4.1.2: {}
refractor@3.6.0:
dependencies:
hastscript: 6.0.0
parse-entities: 2.0.0
prismjs: 1.27.0
regenerator-runtime@0.14.1: {}
rehype-katex@7.0.1:
dependencies:
"@types/hast": 3.0.4
"@types/katex": 0.16.7
hast-util-from-html-isomorphic: 2.0.0
hast-util-to-text: 4.0.2
katex: 0.16.21
unist-util-visit-parents: 6.0.1
vfile: 6.0.3
remark-gfm@4.0.1:
dependencies:
"@types/mdast": 4.0.4
@@ -7834,6 +8352,15 @@ snapshots:
transitivePeerDependencies:
- supports-color
remark-math@6.0.0:
dependencies:
"@types/mdast": 4.0.4
mdast-util-math: 3.0.0
micromark-extension-math: 3.1.0
unified: 11.0.5
transitivePeerDependencies:
- supports-color
remark-parse@11.0.0:
dependencies:
"@types/mdast": 4.0.4
@@ -7935,6 +8462,8 @@ snapshots:
source-map-js@1.2.1: {}
space-separated-tokens@1.1.5: {}
space-separated-tokens@2.0.2: {}
stack-trace@0.0.10: {}
@@ -8077,6 +8606,11 @@ snapshots:
trough: 2.2.0
vfile: 6.0.3
unist-util-find-after@5.0.0:
dependencies:
"@types/unist": 3.0.3
unist-util-is: 6.0.0
unist-util-is@6.0.0:
dependencies:
"@types/unist": 3.0.3
@@ -8085,6 +8619,11 @@ snapshots:
dependencies:
"@types/unist": 3.0.3
unist-util-remove-position@5.0.0:
dependencies:
"@types/unist": 3.0.3
unist-util-visit: 5.0.0
unist-util-stringify-position@4.0.0:
dependencies:
"@types/unist": 3.0.3
@@ -8164,6 +8703,11 @@ snapshots:
uuid@9.0.1: {}
vfile-location@5.0.3:
dependencies:
"@types/unist": 3.0.3
vfile: 6.0.3
vfile-message@4.0.2:
dependencies:
"@types/unist": 3.0.3
@@ -8187,6 +8731,8 @@ snapshots:
tsx: 4.19.3
yaml: 2.7.0
web-namespaces@2.0.1: {}
web-streams-polyfill@4.0.0-beta.3: {}
webidl-conversions@3.0.1: {}
@@ -8242,6 +8788,8 @@ snapshots:
wrappy@1.0.2: {}
xtend@4.0.2: {}
yallist@3.1.1: {}
yallist@5.0.0: {}

21
src/components/thread/history/index.tsx
View File

@@ -10,6 +10,7 @@ import {
SheetHeader,
SheetTitle,
} from "@/components/ui/sheet";
import { Skeleton } from "@/components/ui/skeleton";
function ThreadList({
threads,
@@ -55,8 +56,19 @@ function ThreadList({
);
}
function ThreadHistoryLoading() {
return (
<div className="h-full flex flex-col gap-2 items-start justify-start overflow-y-scroll [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-gray-300 [&::-webkit-scrollbar-track]:bg-transparent">
{Array.from({ length: 30 }).map((_, i) => (
<Skeleton key={`skeleton-${i}`} className="w-[264px] h-10" />
))}
</div>
);
}
export default function ThreadHistory() {
const [threads, setThreads] = useState<Thread[]>([]);
const [loading, setLoading] = useState<boolean>(false);
const [chatHistoryOpen, setChatHistoryOpen] = useQueryParam(
"chatHistoryOpen",
BooleanParam,
@@ -65,14 +77,19 @@ export default function ThreadHistory() {
const { getThreads } = useThreads();
useEffect(() => {
getThreads().then(setThreads).catch(console.error);
if (typeof window === "undefined") return;
setLoading(true);
getThreads()
.then(setThreads)
.catch(console.error)
.finally(() => setLoading(false));
}, []);
return (
<>
<div className="hidden lg:flex flex-col border-r-[1px] border-slate-300 items-start justify-start gap-6 h-screen w-[300px] shrink-0 px-2 py-4 shadow-inner-right">
<h1 className="text-2xl font-medium pl-4">Thread History</h1>
<ThreadList threads={threads} />
{loading ? <ThreadHistoryLoading /> : <ThreadList threads={threads} />}
</div>
<Sheet open={!!chatHistoryOpen} onOpenChange={setChatHistoryOpen}>
<SheetContent side="left" className="lg:hidden flex">

15
src/components/thread/markdown-text.tsx
View File

@@ -9,15 +9,24 @@ import {
} from "@assistant-ui/react-markdown";
import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm";
import rehypeKatex from "rehype-katex";
import remarkMath from "remark-math";
import { FC, memo, useState } from "react";
import { CheckIcon, CopyIcon } from "lucide-react";
import { SyntaxHighlighter } from "@/components/thread/syntax-highlighter";
import { TooltipIconButton } from "@/components/thread/tooltip-icon-button";
import { cn } from "@/lib/utils";
import "katex/dist/katex.min.css";
const MarkdownTextImpl = ({ children }: { children: string }) => {
return (
<ReactMarkdown remarkPlugins={[remarkGfm]} components={defaultComponents}>
<ReactMarkdown
remarkPlugins={[remarkGfm, remarkMath]}
rehypePlugins={[rehypeKatex]}
components={defaultComponents}
>
{children}
</ReactMarkdown>
);
@@ -26,6 +35,7 @@ const MarkdownTextImpl = ({ children }: { children: string }) => {
export const MarkdownText = memo(MarkdownTextImpl);
const CodeHeader: FC<CodeHeaderProps> = ({ language, code }) => {
console.log("CodeHeader", { language, code });
const { isCopied, copyToClipboard } = useCopyToClipboard();
const onCopy = () => {
if (!code || isCopied) return;
@@ -195,7 +205,7 @@ const defaultComponents = memoizeMarkdownComponents({
pre: ({ className, ...props }) => (
<pre
className={cn(
"overflow-x-auto rounded-b-lg bg-black p-4 text-white",
"overflow-x-auto rounded-b-lg bg-black p-4 text-white max-w-4xl",
className,
)}
{...props}
@@ -211,4 +221,5 @@ const defaultComponents = memoizeMarkdownComponents({
);
},
CodeHeader,
SyntaxHighlighter,
});

24
src/components/thread/syntax-highlighter.tsx Normal file
View File

@@ -0,0 +1,24 @@
import { PrismAsyncLight } from "react-syntax-highlighter";
import { makePrismAsyncLightSyntaxHighlighter } from "@assistant-ui/react-syntax-highlighter";
import tsx from "react-syntax-highlighter/dist/esm/languages/prism/tsx";
import python from "react-syntax-highlighter/dist/esm/languages/prism/python";
import { coldarkDark } from "react-syntax-highlighter/dist/cjs/styles/prism";
// register languages you want to support
PrismAsyncLight.registerLanguage("js", tsx);
PrismAsyncLight.registerLanguage("jsx", tsx);
PrismAsyncLight.registerLanguage("ts", tsx);
PrismAsyncLight.registerLanguage("tsx", tsx);
PrismAsyncLight.registerLanguage("python", python);
export const SyntaxHighlighter = makePrismAsyncLightSyntaxHighlighter({
style: coldarkDark,
customStyle: {
margin: 0,
width: "100%",
background: "transparent",
padding: "1.5rem 1rem",
},
});

13
src/components/ui/skeleton.tsx Normal file
View File

@@ -0,0 +1,13 @@
import { cn } from "@/lib/utils";
function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="skeleton"
className={cn("bg-primary/10 animate-pulse rounded-md", className)}
{...props}
/>
);
}
export { Skeleton };