diff --git a/bun.lock b/bun.lock
index 620dcd2..225c662 100644
--- a/bun.lock
+++ b/bun.lock
@@ -72,6 +72,7 @@
"react-icons": "^5.4.0",
"react-streaming": "^0.4.2",
"react-textarea-autosize": "^8.5.5",
+ "react-use-pwa-install": "^1.0.3",
"shiki": "^1.24.0",
"tslog": "^4.9.3",
"typescript": "^5.7.2",
@@ -1563,6 +1564,8 @@
"punycode": ["punycode@2.3.1", "", {}, "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg=="],
+ "pwa-install-handler": ["pwa-install-handler@2.6.2", "", {}, "sha512-9hMpqWNxGZx4ZoBe9k9gHkdZC/d/mvMJLA08FCVVMxOhwHBNuQVzb0DwH8ffEaqFvqu7GaotcvYgGNT1yVWduQ=="],
+
"qrcode.react": ["qrcode.react@4.2.0", "", { "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-QpgqWi8rD9DsS9EP3z7BT+5lY5SFhsqGjpgW5DY/i3mK4M9DTBNz3ErMi8BWYEfI3L0d8GIbGmcdFAS1uIRGjA=="],
"quansync": ["quansync@0.2.10", "", {}, "sha512-t41VRkMYbkHyCYmOvx/6URnN80H7k4X0lLdBMGsz+maAwrJQYB1djpV6vHrQIBE0WBSGqhtEHrK9U3DWWH8v7A=="],
@@ -1599,6 +1602,8 @@
"react-textarea-autosize": ["react-textarea-autosize@8.5.9", "", { "dependencies": { "@babel/runtime": "^7.20.13", "use-composed-ref": "^1.3.0", "use-latest": "^1.2.1" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-U1DGlIQN5AwgjTyOEnI1oCcMuEr1pv1qOtklB2l4nyMGbHzWrI0eFsYK0zos2YWqAolJyG0IWJaqWmWj5ETh0A=="],
+ "react-use-pwa-install": ["react-use-pwa-install@1.0.3", "", { "dependencies": { "pwa-install-handler": "^2.6.2" }, "peerDependencies": { "react": "18 || 19" } }, "sha512-poF5teATOCblAchP61+Hx/FIQJtSkjGFcZsJjiyXmG9SfmJWkj8M890lXKlu6QPg/bmG6GE3d+KP3aEO9ehgDw=="],
+
"readdirp": ["readdirp@4.1.2", "", {}, "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg=="],
"redent": ["redent@3.0.0", "", { "dependencies": { "indent-string": "^4.0.0", "strip-indent": "^3.0.0" } }, "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg=="],
diff --git a/packages/client/package.json b/packages/client/package.json
index 69898e7..83c33ce 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -56,6 +56,7 @@
"react-icons": "^5.4.0",
"react-streaming": "^0.4.2",
"react-textarea-autosize": "^8.5.5",
+ "react-use-pwa-install": "^1.0.3",
"shiki": "^1.24.0",
"tslog": "^4.9.3",
"typescript": "^5.7.2",
diff --git a/packages/client/src/components/InstallButton.tsx b/packages/client/src/components/InstallButton.tsx
new file mode 100644
index 0000000..9a1ae26
--- /dev/null
+++ b/packages/client/src/components/InstallButton.tsx
@@ -0,0 +1,34 @@
+import { IconButton } from '@chakra-ui/react';
+import { HardDriveDownload } from 'lucide-react';
+import React from 'react';
+import { usePWAInstall } from 'react-use-pwa-install';
+
+import { toolbarButtonZIndex } from './toolbar/Toolbar.tsx';
+
+function InstallButton() {
+ const install = usePWAInstall();
+
+ // ;
+ return (
+ }
+ size="md"
+ bg="transparent"
+ stroke="text.accent"
+ color="text.accent"
+ onClick={() => install}
+ _hover={{
+ bg: 'transparent',
+ svg: {
+ stroke: 'accent.secondary',
+ transition: 'stroke 0.3s ease-in-out',
+ },
+ }}
+ zIndex={toolbarButtonZIndex}
+ />
+ );
+}
+
+export default InstallButton;
diff --git a/packages/client/src/components/toolbar/Toolbar.tsx b/packages/client/src/components/toolbar/Toolbar.tsx
index 1f7de88..f9b8367 100644
--- a/packages/client/src/components/toolbar/Toolbar.tsx
+++ b/packages/client/src/components/toolbar/Toolbar.tsx
@@ -2,6 +2,7 @@ import { Flex } from '@chakra-ui/react';
import React from 'react';
import BuiltWithButton from '../BuiltWithButton';
+import InstallButton from '../InstallButton.tsx';
import GithubButton from './GithubButton';
import SupportThisSiteButton from './SupportThisSiteButton';
@@ -17,6 +18,7 @@ function ToolBar({ isMobile }) {
alignItems={isMobile ? 'flex-start' : 'flex-end'}
pb={4}
>
+
diff --git a/packages/client/src/pages/index/+Page.tsx b/packages/client/src/pages/index/+Page.tsx
index 0b9db0a..b2256f2 100644
--- a/packages/client/src/pages/index/+Page.tsx
+++ b/packages/client/src/pages/index/+Page.tsx
@@ -1,7 +1,6 @@
import { Stack } from '@chakra-ui/react';
import React, { useEffect } from 'react';
-import Chat from '../../components/chat/Chat';
import { LandingComponent } from '../../components/landing-component/LandingComponent.tsx';
import clientChatStore from '../../stores/ClientChatStore';