mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-10-07 02:58:11 +00:00
Dhravya Shah
GitHub
commit
d5544d0070
50 changed files with 3576 additions and 1195 deletions
1
apps/cf-ai-backend/.gitignore
vendored
1
apps/cf-ai-backend/.gitignore
vendored
|
|
@ -1,4 +1,5 @@
|
|||
# Logs
|
||||
wrangler.toml
|
||||
|
||||
logs
|
||||
_.log
|
||||
|
|
|
|||
790
apps/cf-ai-backend/pnpm-lock.yaml
generated
790
apps/cf-ai-backend/pnpm-lock.yaml
generated
|
|
@ -1,790 +0,0 @@
|
|||
lockfileVersion: '6.0'
|
||||
|
||||
settings:
|
||||
autoInstallPeers: true
|
||||
excludeLinksFromLockfile: false
|
||||
|
||||
devDependencies:
|
||||
'@cloudflare/workers-types':
|
||||
specifier: ^4.20240222.0
|
||||
version: 4.20240222.0
|
||||
typescript:
|
||||
specifier: ^5.0.4
|
||||
version: 5.3.3
|
||||
wrangler:
|
||||
specifier: ^3.0.0
|
||||
version: 3.29.0(@cloudflare/workers-types@4.20240222.0)
|
||||
|
||||
packages:
|
||||
|
||||
/@cloudflare/kv-asset-handler@0.3.1:
|
||||
resolution: {integrity: sha512-lKN2XCfKCmpKb86a1tl4GIwsJYDy9TGuwjhDELLmpKygQhw8X2xR4dusgpC5Tg7q1pB96Eb0rBo81kxSILQMwA==}
|
||||
dependencies:
|
||||
mime: 3.0.0
|
||||
dev: true
|
||||
|
||||
/@cloudflare/workerd-darwin-64@1.20240208.0:
|
||||
resolution: {integrity: sha512-64qjsCUz6VtjXnUex5D6dWoJDuUBRw1ps2TEVH9wGJ4ubiLVUxKhj3bzkVy0RoJ8FhaCKzJWWRyTo4yc192UTA==}
|
||||
engines: {node: '>=16'}
|
||||
cpu: [x64]
|
||||
os: [darwin]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@cloudflare/workerd-darwin-arm64@1.20240208.0:
|
||||
resolution: {integrity: sha512-eVQrAV200LhwLY6JZLx3l2lDrjsTC86lqnvH+RSeM43bAcdneC6lVfykHnTaOTgYFvYQbqRkn9ICWxXj1V9L5g==}
|
||||
engines: {node: '>=16'}
|
||||
cpu: [arm64]
|
||||
os: [darwin]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@cloudflare/workerd-linux-64@1.20240208.0:
|
||||
resolution: {integrity: sha512-ivZ2UuCvi44j8JZ++XlQzSYajt5ptvAdwlh3WPpCcygtHXEh6SVo8QXEUOXhPbv861C0HZMYxLCaLqlpQDWB8g==}
|
||||
engines: {node: '>=16'}
|
||||
cpu: [x64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@cloudflare/workerd-linux-arm64@1.20240208.0:
|
||||
resolution: {integrity: sha512-aLfvl9kXQKbM7aLvfL0HbOt5VEgv15mEZGyFKyDldJ8+nOXH6nYPma1ccwF8BHmu8otHc420eyPr2xPKhLSJnw==}
|
||||
engines: {node: '>=16'}
|
||||
cpu: [arm64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@cloudflare/workerd-windows-64@1.20240208.0:
|
||||
resolution: {integrity: sha512-Y6KMukWnorsSmPx6d82IuJ4SU8sX1+2y+w1uFJ76sucSgXqUAN1fmjG+EyzRVbcbsxRGBCD9c1Pn8T1amMLEYA==}
|
||||
engines: {node: '>=16'}
|
||||
cpu: [x64]
|
||||
os: [win32]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@cloudflare/workers-types@4.20240222.0:
|
||||
resolution: {integrity: sha512-luO0BdK3rLlCv3B240+cTrfqm+XSbHtpk+88aJtGwzyVK9QF/Xz8lBgE/oZZLN8nCTmOvxAZnszyxUuZ8GP8Cg==}
|
||||
dev: true
|
||||
|
||||
/@cspotcode/source-map-support@0.8.1:
|
||||
resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==}
|
||||
engines: {node: '>=12'}
|
||||
dependencies:
|
||||
'@jridgewell/trace-mapping': 0.3.9
|
||||
dev: true
|
||||
|
||||
/@esbuild-plugins/node-globals-polyfill@0.2.3(esbuild@0.17.19):
|
||||
resolution: {integrity: sha512-r3MIryXDeXDOZh7ih1l/yE9ZLORCd5e8vWg02azWRGj5SPTuoh69A2AIyn0Z31V/kHBfZ4HgWJ+OK3GTTwLmnw==}
|
||||
peerDependencies:
|
||||
esbuild: '*'
|
||||
dependencies:
|
||||
esbuild: 0.17.19
|
||||
dev: true
|
||||
|
||||
/@esbuild-plugins/node-modules-polyfill@0.2.2(esbuild@0.17.19):
|
||||
resolution: {integrity: sha512-LXV7QsWJxRuMYvKbiznh+U1ilIop3g2TeKRzUxOG5X3YITc8JyyTa90BmLwqqv0YnX4v32CSlG+vsziZp9dMvA==}
|
||||
peerDependencies:
|
||||
esbuild: '*'
|
||||
dependencies:
|
||||
esbuild: 0.17.19
|
||||
escape-string-regexp: 4.0.0
|
||||
rollup-plugin-node-polyfills: 0.2.1
|
||||
dev: true
|
||||
|
||||
/@esbuild/android-arm64@0.17.19:
|
||||
resolution: {integrity: sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm64]
|
||||
os: [android]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/android-arm@0.17.19:
|
||||
resolution: {integrity: sha512-rIKddzqhmav7MSmoFCmDIb6e2W57geRsM94gV2l38fzhXMwq7hZoClug9USI2pFRGL06f4IOPHHpFNOkWieR8A==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm]
|
||||
os: [android]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/android-x64@0.17.19:
|
||||
resolution: {integrity: sha512-uUTTc4xGNDT7YSArp/zbtmbhO0uEEK9/ETW29Wk1thYUJBz3IVnvgEiEwEa9IeLyvnpKrWK64Utw2bgUmDveww==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [android]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/darwin-arm64@0.17.19:
|
||||
resolution: {integrity: sha512-80wEoCfF/hFKM6WE1FyBHc9SfUblloAWx6FJkFWTWiCoht9Mc0ARGEM47e67W9rI09YoUxJL68WHfDRYEAvOhg==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm64]
|
||||
os: [darwin]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/darwin-x64@0.17.19:
|
||||
resolution: {integrity: sha512-IJM4JJsLhRYr9xdtLytPLSH9k/oxR3boaUIYiHkAawtwNOXKE8KoU8tMvryogdcT8AU+Bflmh81Xn6Q0vTZbQw==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [darwin]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/freebsd-arm64@0.17.19:
|
||||
resolution: {integrity: sha512-pBwbc7DufluUeGdjSU5Si+P3SoMF5DQ/F/UmTSb8HXO80ZEAJmrykPyzo1IfNbAoaqw48YRpv8shwd1NoI0jcQ==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm64]
|
||||
os: [freebsd]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/freebsd-x64@0.17.19:
|
||||
resolution: {integrity: sha512-4lu+n8Wk0XlajEhbEffdy2xy53dpR06SlzvhGByyg36qJw6Kpfk7cp45DR/62aPH9mtJRmIyrXAS5UWBrJT6TQ==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [freebsd]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-arm64@0.17.19:
|
||||
resolution: {integrity: sha512-ct1Tg3WGwd3P+oZYqic+YZF4snNl2bsnMKRkb3ozHmnM0dGWuxcPTTntAF6bOP0Sp4x0PjSF+4uHQ1xvxfRKqg==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-arm@0.17.19:
|
||||
resolution: {integrity: sha512-cdmT3KxjlOQ/gZ2cjfrQOtmhG4HJs6hhvm3mWSRDPtZ/lP5oe8FWceS10JaSJC13GBd4eH/haHnqf7hhGNLerA==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-ia32@0.17.19:
|
||||
resolution: {integrity: sha512-w4IRhSy1VbsNxHRQpeGCHEmibqdTUx61Vc38APcsRbuVgK0OPEnQ0YD39Brymn96mOx48Y2laBQGqgZ0j9w6SQ==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [ia32]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-loong64@0.17.19:
|
||||
resolution: {integrity: sha512-2iAngUbBPMq439a+z//gE+9WBldoMp1s5GWsUSgqHLzLJ9WoZLZhpwWuym0u0u/4XmZ3gpHmzV84PonE+9IIdQ==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [loong64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-mips64el@0.17.19:
|
||||
resolution: {integrity: sha512-LKJltc4LVdMKHsrFe4MGNPp0hqDFA1Wpt3jE1gEyM3nKUvOiO//9PheZZHfYRfYl6AwdTH4aTcXSqBerX0ml4A==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [mips64el]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-ppc64@0.17.19:
|
||||
resolution: {integrity: sha512-/c/DGybs95WXNS8y3Ti/ytqETiW7EU44MEKuCAcpPto3YjQbyK3IQVKfF6nbghD7EcLUGl0NbiL5Rt5DMhn5tg==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [ppc64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-riscv64@0.17.19:
|
||||
resolution: {integrity: sha512-FC3nUAWhvFoutlhAkgHf8f5HwFWUL6bYdvLc/TTuxKlvLi3+pPzdZiFKSWz/PF30TB1K19SuCxDTI5KcqASJqA==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [riscv64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-s390x@0.17.19:
|
||||
resolution: {integrity: sha512-IbFsFbxMWLuKEbH+7sTkKzL6NJmG2vRyy6K7JJo55w+8xDk7RElYn6xvXtDW8HCfoKBFK69f3pgBJSUSQPr+4Q==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [s390x]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/linux-x64@0.17.19:
|
||||
resolution: {integrity: sha512-68ngA9lg2H6zkZcyp22tsVt38mlhWde8l3eJLWkyLrp4HwMUr3c1s/M2t7+kHIhvMjglIBrFpncX1SzMckomGw==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [linux]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/netbsd-x64@0.17.19:
|
||||
resolution: {integrity: sha512-CwFq42rXCR8TYIjIfpXCbRX0rp1jo6cPIUPSaWwzbVI4aOfX96OXY8M6KNmtPcg7QjYeDmN+DD0Wp3LaBOLf4Q==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [netbsd]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/openbsd-x64@0.17.19:
|
||||
resolution: {integrity: sha512-cnq5brJYrSZ2CF6c35eCmviIN3k3RczmHz8eYaVlNasVqsNY+JKohZU5MKmaOI+KkllCdzOKKdPs762VCPC20g==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [openbsd]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/sunos-x64@0.17.19:
|
||||
resolution: {integrity: sha512-vCRT7yP3zX+bKWFeP/zdS6SqdWB8OIpaRq/mbXQxTGHnIxspRtigpkUcDMlSCOejlHowLqII7K2JKevwyRP2rg==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [sunos]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/win32-arm64@0.17.19:
|
||||
resolution: {integrity: sha512-yYx+8jwowUstVdorcMdNlzklLYhPxjniHWFKgRqH7IFlUEa0Umu3KuYplf1HUZZ422e3NU9F4LGb+4O0Kdcaag==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [arm64]
|
||||
os: [win32]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/win32-ia32@0.17.19:
|
||||
resolution: {integrity: sha512-eggDKanJszUtCdlVs0RB+h35wNlb5v4TWEkq4vZcmVt5u/HiDZrTXe2bWFQUez3RgNHwx/x4sk5++4NSSicKkw==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [ia32]
|
||||
os: [win32]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@esbuild/win32-x64@0.17.19:
|
||||
resolution: {integrity: sha512-lAhycmKnVOuRYNtRtatQR1LPQf2oYCkRGkSFnseDAKPl8lu5SOsK/e1sXe5a0Pc5kHIHe6P2I/ilntNv2xf3cA==}
|
||||
engines: {node: '>=12'}
|
||||
cpu: [x64]
|
||||
os: [win32]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/@fastify/busboy@2.1.0:
|
||||
resolution: {integrity: sha512-+KpH+QxZU7O4675t3mnkQKcZZg56u+K/Ct2K+N2AZYNVK8kyeo/bI18tI8aPm3tvNNRyTWfj6s5tnGNlcbQRsA==}
|
||||
engines: {node: '>=14'}
|
||||
dev: true
|
||||
|
||||
/@jridgewell/resolve-uri@3.1.2:
|
||||
resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
|
||||
engines: {node: '>=6.0.0'}
|
||||
dev: true
|
||||
|
||||
/@jridgewell/sourcemap-codec@1.4.15:
|
||||
resolution: {integrity: sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==}
|
||||
dev: true
|
||||
|
||||
/@jridgewell/trace-mapping@0.3.9:
|
||||
resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
|
||||
dependencies:
|
||||
'@jridgewell/resolve-uri': 3.1.2
|
||||
'@jridgewell/sourcemap-codec': 1.4.15
|
||||
dev: true
|
||||
|
||||
/@types/node-forge@1.3.11:
|
||||
resolution: {integrity: sha512-FQx220y22OKNTqaByeBGqHWYz4cl94tpcxeFdvBo3wjG6XPBuZ0BNgNZRV5J5TFmmcsJ4IzsLkmGRiQbnYsBEQ==}
|
||||
dependencies:
|
||||
'@types/node': 20.11.20
|
||||
dev: true
|
||||
|
||||
/@types/node@20.11.20:
|
||||
resolution: {integrity: sha512-7/rR21OS+fq8IyHTgtLkDK949uzsa6n8BkziAKtPVpugIkO6D+/ooXMvzXxDnZrmtXVfjb1bKQafYpb8s89LOg==}
|
||||
dependencies:
|
||||
undici-types: 5.26.5
|
||||
dev: true
|
||||
|
||||
/acorn-walk@8.3.2:
|
||||
resolution: {integrity: sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==}
|
||||
engines: {node: '>=0.4.0'}
|
||||
dev: true
|
||||
|
||||
/acorn@8.11.3:
|
||||
resolution: {integrity: sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==}
|
||||
engines: {node: '>=0.4.0'}
|
||||
hasBin: true
|
||||
dev: true
|
||||
|
||||
/anymatch@3.1.3:
|
||||
resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
|
||||
engines: {node: '>= 8'}
|
||||
dependencies:
|
||||
normalize-path: 3.0.0
|
||||
picomatch: 2.3.1
|
||||
dev: true
|
||||
|
||||
/as-table@1.0.55:
|
||||
resolution: {integrity: sha512-xvsWESUJn0JN421Xb9MQw6AsMHRCUknCe0Wjlxvjud80mU4E6hQf1A6NzQKcYNmYw62MfzEtXc+badstZP3JpQ==}
|
||||
dependencies:
|
||||
printable-characters: 1.0.42
|
||||
dev: true
|
||||
|
||||
/binary-extensions@2.2.0:
|
||||
resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
|
||||
engines: {node: '>=8'}
|
||||
dev: true
|
||||
|
||||
/blake3-wasm@2.1.5:
|
||||
resolution: {integrity: sha512-F1+K8EbfOZE49dtoPtmxUQrpXaBIl3ICvasLh+nJta0xkz+9kF/7uet9fLnwKqhDrmj6g+6K3Tw9yQPUg2ka5g==}
|
||||
dev: true
|
||||
|
||||
/braces@3.0.2:
|
||||
resolution: {integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==}
|
||||
engines: {node: '>=8'}
|
||||
dependencies:
|
||||
fill-range: 7.0.1
|
||||
dev: true
|
||||
|
||||
/capnp-ts@0.7.0:
|
||||
resolution: {integrity: sha512-XKxXAC3HVPv7r674zP0VC3RTXz+/JKhfyw94ljvF80yynK6VkTnqE3jMuN8b3dUVmmc43TjyxjW4KTsmB3c86g==}
|
||||
dependencies:
|
||||
debug: 4.3.4
|
||||
tslib: 2.6.2
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
dev: true
|
||||
|
||||
/chokidar@3.6.0:
|
||||
resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
|
||||
engines: {node: '>= 8.10.0'}
|
||||
dependencies:
|
||||
anymatch: 3.1.3
|
||||
braces: 3.0.2
|
||||
glob-parent: 5.1.2
|
||||
is-binary-path: 2.1.0
|
||||
is-glob: 4.0.3
|
||||
normalize-path: 3.0.0
|
||||
readdirp: 3.6.0
|
||||
optionalDependencies:
|
||||
fsevents: 2.3.3
|
||||
dev: true
|
||||
|
||||
/cookie@0.5.0:
|
||||
resolution: {integrity: sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==}
|
||||
engines: {node: '>= 0.6'}
|
||||
dev: true
|
||||
|
||||
/data-uri-to-buffer@2.0.2:
|
||||
resolution: {integrity: sha512-ND9qDTLc6diwj+Xe5cdAgVTbLVdXbtxTJRXRhli8Mowuaan+0EJOtdqJ0QCHNSSPyoXGx9HX2/VMnKeC34AChA==}
|
||||
dev: true
|
||||
|
||||
/debug@4.3.4:
|
||||
resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
|
||||
engines: {node: '>=6.0'}
|
||||
peerDependencies:
|
||||
supports-color: '*'
|
||||
peerDependenciesMeta:
|
||||
supports-color:
|
||||
optional: true
|
||||
dependencies:
|
||||
ms: 2.1.2
|
||||
dev: true
|
||||
|
||||
/esbuild@0.17.19:
|
||||
resolution: {integrity: sha512-XQ0jAPFkK/u3LcVRcvVHQcTIqD6E2H1fvZMA5dQPSOWb3suUbWbfbRf94pjc0bNzRYLfIrDRQXr7X+LHIm5oHw==}
|
||||
engines: {node: '>=12'}
|
||||
hasBin: true
|
||||
requiresBuild: true
|
||||
optionalDependencies:
|
||||
'@esbuild/android-arm': 0.17.19
|
||||
'@esbuild/android-arm64': 0.17.19
|
||||
'@esbuild/android-x64': 0.17.19
|
||||
'@esbuild/darwin-arm64': 0.17.19
|
||||
'@esbuild/darwin-x64': 0.17.19
|
||||
'@esbuild/freebsd-arm64': 0.17.19
|
||||
'@esbuild/freebsd-x64': 0.17.19
|
||||
'@esbuild/linux-arm': 0.17.19
|
||||
'@esbuild/linux-arm64': 0.17.19
|
||||
'@esbuild/linux-ia32': 0.17.19
|
||||
'@esbuild/linux-loong64': 0.17.19
|
||||
'@esbuild/linux-mips64el': 0.17.19
|
||||
'@esbuild/linux-ppc64': 0.17.19
|
||||
'@esbuild/linux-riscv64': 0.17.19
|
||||
'@esbuild/linux-s390x': 0.17.19
|
||||
'@esbuild/linux-x64': 0.17.19
|
||||
'@esbuild/netbsd-x64': 0.17.19
|
||||
'@esbuild/openbsd-x64': 0.17.19
|
||||
'@esbuild/sunos-x64': 0.17.19
|
||||
'@esbuild/win32-arm64': 0.17.19
|
||||
'@esbuild/win32-ia32': 0.17.19
|
||||
'@esbuild/win32-x64': 0.17.19
|
||||
dev: true
|
||||
|
||||
/escape-string-regexp@4.0.0:
|
||||
resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==}
|
||||
engines: {node: '>=10'}
|
||||
dev: true
|
||||
|
||||
/estree-walker@0.6.1:
|
||||
resolution: {integrity: sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w==}
|
||||
dev: true
|
||||
|
||||
/exit-hook@2.2.1:
|
||||
resolution: {integrity: sha512-eNTPlAD67BmP31LDINZ3U7HSF8l57TxOY2PmBJ1shpCvpnxBF93mWCE8YHBnXs8qiUZJc9WDcWIeC3a2HIAMfw==}
|
||||
engines: {node: '>=6'}
|
||||
dev: true
|
||||
|
||||
/fill-range@7.0.1:
|
||||
resolution: {integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==}
|
||||
engines: {node: '>=8'}
|
||||
dependencies:
|
||||
to-regex-range: 5.0.1
|
||||
dev: true
|
||||
|
||||
/fsevents@2.3.3:
|
||||
resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
|
||||
engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
|
||||
os: [darwin]
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
optional: true
|
||||
|
||||
/function-bind@1.1.2:
|
||||
resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
|
||||
dev: true
|
||||
|
||||
/get-source@2.0.12:
|
||||
resolution: {integrity: sha512-X5+4+iD+HoSeEED+uwrQ07BOQr0kEDFMVqqpBuI+RaZBpBpHCuXxo70bjar6f0b0u/DQJsJ7ssurpP0V60Az+w==}
|
||||
dependencies:
|
||||
data-uri-to-buffer: 2.0.2
|
||||
source-map: 0.6.1
|
||||
dev: true
|
||||
|
||||
/glob-parent@5.1.2:
|
||||
resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
|
||||
engines: {node: '>= 6'}
|
||||
dependencies:
|
||||
is-glob: 4.0.3
|
||||
dev: true
|
||||
|
||||
/glob-to-regexp@0.4.1:
|
||||
resolution: {integrity: sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==}
|
||||
dev: true
|
||||
|
||||
/hasown@2.0.1:
|
||||
resolution: {integrity: sha512-1/th4MHjnwncwXsIW6QMzlvYL9kG5e/CpVvLRZe4XPa8TOUNbCELqmvhDmnkNsAjwaG4+I8gJJL0JBvTTLO9qA==}
|
||||
engines: {node: '>= 0.4'}
|
||||
dependencies:
|
||||
function-bind: 1.1.2
|
||||
dev: true
|
||||
|
||||
/is-binary-path@2.1.0:
|
||||
resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
|
||||
engines: {node: '>=8'}
|
||||
dependencies:
|
||||
binary-extensions: 2.2.0
|
||||
dev: true
|
||||
|
||||
/is-core-module@2.13.1:
|
||||
resolution: {integrity: sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==}
|
||||
dependencies:
|
||||
hasown: 2.0.1
|
||||
dev: true
|
||||
|
||||
/is-extglob@2.1.1:
|
||||
resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
|
||||
engines: {node: '>=0.10.0'}
|
||||
dev: true
|
||||
|
||||
/is-glob@4.0.3:
|
||||
resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
|
||||
engines: {node: '>=0.10.0'}
|
||||
dependencies:
|
||||
is-extglob: 2.1.1
|
||||
dev: true
|
||||
|
||||
/is-number@7.0.0:
|
||||
resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
|
||||
engines: {node: '>=0.12.0'}
|
||||
dev: true
|
||||
|
||||
/magic-string@0.25.9:
|
||||
resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==}
|
||||
dependencies:
|
||||
sourcemap-codec: 1.4.8
|
||||
dev: true
|
||||
|
||||
/mime@3.0.0:
|
||||
resolution: {integrity: sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==}
|
||||
engines: {node: '>=10.0.0'}
|
||||
hasBin: true
|
||||
dev: true
|
||||
|
||||
/miniflare@3.20240208.0:
|
||||
resolution: {integrity: sha512-NnP3MQFh2pV7iETNmJzSlMBF/KhRA+XT4A7JLCfxunadQSPbTMMgbsZo9EfLloMwHMUhZGNVot3Pvh+VnT2joQ==}
|
||||
engines: {node: '>=16.13'}
|
||||
hasBin: true
|
||||
dependencies:
|
||||
'@cspotcode/source-map-support': 0.8.1
|
||||
acorn: 8.11.3
|
||||
acorn-walk: 8.3.2
|
||||
capnp-ts: 0.7.0
|
||||
exit-hook: 2.2.1
|
||||
glob-to-regexp: 0.4.1
|
||||
stoppable: 1.1.0
|
||||
undici: 5.28.3
|
||||
workerd: 1.20240208.0
|
||||
ws: 8.16.0
|
||||
youch: 3.3.3
|
||||
zod: 3.22.4
|
||||
transitivePeerDependencies:
|
||||
- bufferutil
|
||||
- supports-color
|
||||
- utf-8-validate
|
||||
dev: true
|
||||
|
||||
/ms@2.1.2:
|
||||
resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
|
||||
dev: true
|
||||
|
||||
/mustache@4.2.0:
|
||||
resolution: {integrity: sha512-71ippSywq5Yb7/tVYyGbkBggbU8H3u5Rz56fH60jGFgr8uHwxs+aSKeqmluIVzM0m0kB7xQjKS6qPfd0b2ZoqQ==}
|
||||
hasBin: true
|
||||
dev: true
|
||||
|
||||
/nanoid@3.3.7:
|
||||
resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==}
|
||||
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
|
||||
hasBin: true
|
||||
dev: true
|
||||
|
||||
/node-forge@1.3.1:
|
||||
resolution: {integrity: sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==}
|
||||
engines: {node: '>= 6.13.0'}
|
||||
dev: true
|
||||
|
||||
/normalize-path@3.0.0:
|
||||
resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
|
||||
engines: {node: '>=0.10.0'}
|
||||
dev: true
|
||||
|
||||
/path-parse@1.0.7:
|
||||
resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
|
||||
dev: true
|
||||
|
||||
/path-to-regexp@6.2.1:
|
||||
resolution: {integrity: sha512-JLyh7xT1kizaEvcaXOQwOc2/Yhw6KZOvPf1S8401UyLk86CU79LN3vl7ztXGm/pZ+YjoyAJ4rxmHwbkBXJX+yw==}
|
||||
dev: true
|
||||
|
||||
/picomatch@2.3.1:
|
||||
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
|
||||
engines: {node: '>=8.6'}
|
||||
dev: true
|
||||
|
||||
/printable-characters@1.0.42:
|
||||
resolution: {integrity: sha512-dKp+C4iXWK4vVYZmYSd0KBH5F/h1HoZRsbJ82AVKRO3PEo8L4lBS/vLwhVtpwwuYcoIsVY+1JYKR268yn480uQ==}
|
||||
dev: true
|
||||
|
||||
/readdirp@3.6.0:
|
||||
resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
|
||||
engines: {node: '>=8.10.0'}
|
||||
dependencies:
|
||||
picomatch: 2.3.1
|
||||
dev: true
|
||||
|
||||
/resolve.exports@2.0.2:
|
||||
resolution: {integrity: sha512-X2UW6Nw3n/aMgDVy+0rSqgHlv39WZAlZrXCdnbyEiKm17DSqHX4MmQMaST3FbeWR5FTuRcUwYAziZajji0Y7mg==}
|
||||
engines: {node: '>=10'}
|
||||
dev: true
|
||||
|
||||
/resolve@1.22.8:
|
||||
resolution: {integrity: sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==}
|
||||
hasBin: true
|
||||
dependencies:
|
||||
is-core-module: 2.13.1
|
||||
path-parse: 1.0.7
|
||||
supports-preserve-symlinks-flag: 1.0.0
|
||||
dev: true
|
||||
|
||||
/rollup-plugin-inject@3.0.2:
|
||||
resolution: {integrity: sha512-ptg9PQwzs3orn4jkgXJ74bfs5vYz1NCZlSQMBUA0wKcGp5i5pA1AO3fOUEte8enhGUC+iapTCzEWw2jEFFUO/w==}
|
||||
deprecated: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.
|
||||
dependencies:
|
||||
estree-walker: 0.6.1
|
||||
magic-string: 0.25.9
|
||||
rollup-pluginutils: 2.8.2
|
||||
dev: true
|
||||
|
||||
/rollup-plugin-node-polyfills@0.2.1:
|
||||
resolution: {integrity: sha512-4kCrKPTJ6sK4/gLL/U5QzVT8cxJcofO0OU74tnB19F40cmuAKSzH5/siithxlofFEjwvw1YAhPmbvGNA6jEroA==}
|
||||
dependencies:
|
||||
rollup-plugin-inject: 3.0.2
|
||||
dev: true
|
||||
|
||||
/rollup-pluginutils@2.8.2:
|
||||
resolution: {integrity: sha512-EEp9NhnUkwY8aif6bxgovPHMoMoNr2FulJziTndpt5H9RdwC47GSGuII9XxpSdzVGM0GWrNPHV6ie1LTNJPaLQ==}
|
||||
dependencies:
|
||||
estree-walker: 0.6.1
|
||||
dev: true
|
||||
|
||||
/selfsigned@2.4.1:
|
||||
resolution: {integrity: sha512-th5B4L2U+eGLq1TVh7zNRGBapioSORUeymIydxgFpwww9d2qyKvtuPU2jJuHvYAwwqi2Y596QBL3eEqcPEYL8Q==}
|
||||
engines: {node: '>=10'}
|
||||
dependencies:
|
||||
'@types/node-forge': 1.3.11
|
||||
node-forge: 1.3.1
|
||||
dev: true
|
||||
|
||||
/source-map@0.6.1:
|
||||
resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
|
||||
engines: {node: '>=0.10.0'}
|
||||
dev: true
|
||||
|
||||
/sourcemap-codec@1.4.8:
|
||||
resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==}
|
||||
deprecated: Please use @jridgewell/sourcemap-codec instead
|
||||
dev: true
|
||||
|
||||
/stacktracey@2.1.8:
|
||||
resolution: {integrity: sha512-Kpij9riA+UNg7TnphqjH7/CzctQ/owJGNbFkfEeve4Z4uxT5+JapVLFXcsurIfN34gnTWZNJ/f7NMG0E8JDzTw==}
|
||||
dependencies:
|
||||
as-table: 1.0.55
|
||||
get-source: 2.0.12
|
||||
dev: true
|
||||
|
||||
/stoppable@1.1.0:
|
||||
resolution: {integrity: sha512-KXDYZ9dszj6bzvnEMRYvxgeTHU74QBFL54XKtP3nyMuJ81CFYtABZ3bAzL2EdFUaEwJOBOgENyFj3R7oTzDyyw==}
|
||||
engines: {node: '>=4', npm: '>=6'}
|
||||
dev: true
|
||||
|
||||
/supports-preserve-symlinks-flag@1.0.0:
|
||||
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
|
||||
engines: {node: '>= 0.4'}
|
||||
dev: true
|
||||
|
||||
/to-regex-range@5.0.1:
|
||||
resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
|
||||
engines: {node: '>=8.0'}
|
||||
dependencies:
|
||||
is-number: 7.0.0
|
||||
dev: true
|
||||
|
||||
/tslib@2.6.2:
|
||||
resolution: {integrity: sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==}
|
||||
dev: true
|
||||
|
||||
/typescript@5.3.3:
|
||||
resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==}
|
||||
engines: {node: '>=14.17'}
|
||||
hasBin: true
|
||||
dev: true
|
||||
|
||||
/undici-types@5.26.5:
|
||||
resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
|
||||
dev: true
|
||||
|
||||
/undici@5.28.3:
|
||||
resolution: {integrity: sha512-3ItfzbrhDlINjaP0duwnNsKpDQk3acHI3gVJ1z4fmwMK31k5G9OVIAMLSIaP6w4FaGkaAkN6zaQO9LUvZ1t7VA==}
|
||||
engines: {node: '>=14.0'}
|
||||
dependencies:
|
||||
'@fastify/busboy': 2.1.0
|
||||
dev: true
|
||||
|
||||
/workerd@1.20240208.0:
|
||||
resolution: {integrity: sha512-edFdwHU95Ww2SmjBvBJhbc7hhVXMEo6Y7qqSWCl6W9lGScTlCMCXd4AU3f/EGJ3P++FC+CWqu+XuAywebbKF2Q==}
|
||||
engines: {node: '>=16'}
|
||||
hasBin: true
|
||||
requiresBuild: true
|
||||
optionalDependencies:
|
||||
'@cloudflare/workerd-darwin-64': 1.20240208.0
|
||||
'@cloudflare/workerd-darwin-arm64': 1.20240208.0
|
||||
'@cloudflare/workerd-linux-64': 1.20240208.0
|
||||
'@cloudflare/workerd-linux-arm64': 1.20240208.0
|
||||
'@cloudflare/workerd-windows-64': 1.20240208.0
|
||||
dev: true
|
||||
|
||||
/wrangler@3.29.0(@cloudflare/workers-types@4.20240222.0):
|
||||
resolution: {integrity: sha512-VXUUltM0/fxCF20Z3tH39zpnykDJNPH2lMWI5wA0VmRpuKG0Gffjj5lU2vJaI/PfUCo3q4JErxWcgLezBGnFyA==}
|
||||
engines: {node: '>=16.17.0'}
|
||||
hasBin: true
|
||||
peerDependencies:
|
||||
'@cloudflare/workers-types': ^4.20230914.0
|
||||
peerDependenciesMeta:
|
||||
'@cloudflare/workers-types':
|
||||
optional: true
|
||||
dependencies:
|
||||
'@cloudflare/kv-asset-handler': 0.3.1
|
||||
'@cloudflare/workers-types': 4.20240222.0
|
||||
'@esbuild-plugins/node-globals-polyfill': 0.2.3(esbuild@0.17.19)
|
||||
'@esbuild-plugins/node-modules-polyfill': 0.2.2(esbuild@0.17.19)
|
||||
blake3-wasm: 2.1.5
|
||||
chokidar: 3.6.0
|
||||
esbuild: 0.17.19
|
||||
miniflare: 3.20240208.0
|
||||
nanoid: 3.3.7
|
||||
path-to-regexp: 6.2.1
|
||||
resolve: 1.22.8
|
||||
resolve.exports: 2.0.2
|
||||
selfsigned: 2.4.1
|
||||
source-map: 0.6.1
|
||||
xxhash-wasm: 1.0.2
|
||||
optionalDependencies:
|
||||
fsevents: 2.3.3
|
||||
transitivePeerDependencies:
|
||||
- bufferutil
|
||||
- supports-color
|
||||
- utf-8-validate
|
||||
dev: true
|
||||
|
||||
/ws@8.16.0:
|
||||
resolution: {integrity: sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==}
|
||||
engines: {node: '>=10.0.0'}
|
||||
peerDependencies:
|
||||
bufferutil: ^4.0.1
|
||||
utf-8-validate: '>=5.0.2'
|
||||
peerDependenciesMeta:
|
||||
bufferutil:
|
||||
optional: true
|
||||
utf-8-validate:
|
||||
optional: true
|
||||
dev: true
|
||||
|
||||
/xxhash-wasm@1.0.2:
|
||||
resolution: {integrity: sha512-ibF0Or+FivM9lNrg+HGJfVX8WJqgo+kCLDc4vx6xMeTce7Aj+DLttKbxxRR/gNLSAelRc1omAPlJ77N/Jem07A==}
|
||||
dev: true
|
||||
|
||||
/youch@3.3.3:
|
||||
resolution: {integrity: sha512-qSFXUk3UZBLfggAW3dJKg0BMblG5biqSF8M34E06o5CSsZtH92u9Hqmj2RzGiHDi64fhe83+4tENFP2DB6t6ZA==}
|
||||
dependencies:
|
||||
cookie: 0.5.0
|
||||
mustache: 4.2.0
|
||||
stacktracey: 2.1.8
|
||||
dev: true
|
||||
|
||||
/zod@3.22.4:
|
||||
resolution: {integrity: sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==}
|
||||
dev: true
|
||||
|
|
@ -2,6 +2,7 @@ import { CloudflareVectorizeStore } from '@langchain/cloudflare';
|
|||
import * as apiAdd from './routes/add';
|
||||
import * as apiQuery from "./routes/query"
|
||||
import * as apiAsk from "./routes/ask"
|
||||
import * as apiChat from "./routes/chat"
|
||||
import { OpenAIEmbeddings } from './OpenAIEmbedder';
|
||||
import { GenerativeModel } from '@google/generative-ai';
|
||||
import { Request } from '@cloudflare/workers-types';
|
||||
|
|
@ -17,6 +18,8 @@ routeMap.set('/query', apiQuery);
|
|||
|
||||
routeMap.set('/ask', apiAsk);
|
||||
|
||||
routeMap.set('/chat', apiChat);
|
||||
|
||||
// Add more route mappings as needed
|
||||
// routeMap.set('/api/otherRoute', { ... });
|
||||
|
||||
|
|
|
|||
113
apps/cf-ai-backend/src/routes/chat.ts
Normal file
113
apps/cf-ai-backend/src/routes/chat.ts
Normal file
|
|
@ -0,0 +1,113 @@
|
|||
import { Content, GenerativeModel } from "@google/generative-ai";
|
||||
import { OpenAIEmbeddings } from "../OpenAIEmbedder";
|
||||
import { CloudflareVectorizeStore } from "@langchain/cloudflare";
|
||||
import { Request } from "@cloudflare/workers-types";
|
||||
|
||||
export async function POST(request: Request, _: CloudflareVectorizeStore, embeddings: OpenAIEmbeddings, model: GenerativeModel, env?: Env) {
|
||||
const queryparams = new URL(request.url).searchParams;
|
||||
const query = queryparams.get("q");
|
||||
const topK = parseInt(queryparams.get("topK") ?? "5");
|
||||
const user = queryparams.get("user")
|
||||
const spaces = queryparams.get("spaces")
|
||||
const spacesArray = spaces ? spaces.split(",") : undefined
|
||||
|
||||
const sourcesOnly = (queryparams.get("sourcesOnly") ?? "false")
|
||||
|
||||
if (!user) {
|
||||
return new Response(JSON.stringify({ message: "Invalid User" }), { status: 400 });
|
||||
}
|
||||
|
||||
if (!query) {
|
||||
return new Response(JSON.stringify({ message: "Invalid Query" }), { status: 400 });
|
||||
}
|
||||
const filter: VectorizeVectorMetadataFilter = {
|
||||
user
|
||||
}
|
||||
|
||||
const responses: VectorizeMatches = { matches: [], count: 0 };
|
||||
|
||||
if (spacesArray) {
|
||||
for (const space of spacesArray) {
|
||||
filter.space = space;
|
||||
|
||||
const queryAsVector = await embeddings.embedQuery(query);
|
||||
|
||||
const resp = await env!.VECTORIZE_INDEX.query(queryAsVector, {
|
||||
topK,
|
||||
filter
|
||||
});
|
||||
|
||||
if (resp.count > 0) {
|
||||
responses.matches.push(...resp.matches)
|
||||
responses.count += resp.count
|
||||
}
|
||||
}
|
||||
} else {
|
||||
const queryAsVector = await embeddings.embedQuery(query);
|
||||
const resp = await env!.VECTORIZE_INDEX.query(queryAsVector, {
|
||||
topK,
|
||||
filter: {
|
||||
user
|
||||
}
|
||||
});
|
||||
|
||||
if (resp.count > 0) {
|
||||
responses.matches.push(...resp.matches)
|
||||
responses.count += resp.count
|
||||
}
|
||||
}
|
||||
|
||||
// if (responses.count === 0) {
|
||||
// return new Response(JSON.stringify({ message: "No Results Found" }), { status: 404 });
|
||||
// }
|
||||
|
||||
const highScoreIds = responses.matches.filter(({ score }) => score > 0.35).map(({ id }) => id)
|
||||
|
||||
if (sourcesOnly === "true") {
|
||||
return new Response(JSON.stringify({ ids: highScoreIds }), { status: 200 });
|
||||
}
|
||||
|
||||
const vec = await env!.VECTORIZE_INDEX.getByIds(highScoreIds)
|
||||
|
||||
const preparedContext = vec.map(({ metadata }) => `Website title: ${metadata!.title}\nDescription: ${metadata!.description}\nURL: ${metadata!.url}\nContent: ${metadata!.text}`).join("\n\n");
|
||||
|
||||
const body = await request.json() as {
|
||||
chatHistory?: Content[]
|
||||
};
|
||||
|
||||
const defaultHistory = [
|
||||
{
|
||||
role: "user",
|
||||
parts: [{ text: `You are an agent that summarizes a page based on the query. don't say 'based on the context'. I expect you to be like a 'Second Brain'. you will be provided with the context (old saved posts) and questions. Answer accordingly. Answer in markdown format` }],
|
||||
},
|
||||
{
|
||||
role: "model",
|
||||
parts: [{ text: "Ok, I am a personal assistant, and will act as a second brain to help with user's queries." }],
|
||||
},
|
||||
] as Content[];
|
||||
|
||||
const chat = model.startChat({
|
||||
history: [...defaultHistory, ...(body.chatHistory ?? [])],
|
||||
});
|
||||
|
||||
const prompt = `Context:\n${preparedContext}\n\nQuestion: ${query}\nAnswer:`;
|
||||
|
||||
const output = await chat.sendMessageStream(prompt);
|
||||
|
||||
const response = new Response(
|
||||
new ReadableStream({
|
||||
async start(controller) {
|
||||
const converter = new TextEncoder();
|
||||
for await (const chunk of output.stream) {
|
||||
const chunkText = await chunk.text();
|
||||
const encodedChunk = converter.encode("data: " + JSON.stringify({ "response": chunkText }) + "\n\n");
|
||||
controller.enqueue(encodedChunk);
|
||||
}
|
||||
const doneChunk = converter.encode("data: [DONE]");
|
||||
controller.enqueue(doneChunk);
|
||||
controller.close();
|
||||
}
|
||||
})
|
||||
);
|
||||
return response;
|
||||
}
|
||||
|
|
@ -21,15 +21,11 @@ export async function GET(request: Request, _: CloudflareVectorizeStore, embeddi
|
|||
}
|
||||
|
||||
const filter: VectorizeVectorMetadataFilter = {
|
||||
user: {
|
||||
$eq: user
|
||||
}
|
||||
user
|
||||
}
|
||||
|
||||
if (space) {
|
||||
filter.space = {
|
||||
$eq: space
|
||||
}
|
||||
filter.space
|
||||
}
|
||||
|
||||
const queryAsVector = await embeddings.embedQuery(query);
|
||||
|
|
@ -40,7 +36,7 @@ export async function GET(request: Request, _: CloudflareVectorizeStore, embeddi
|
|||
});
|
||||
|
||||
if (resp.count === 0) {
|
||||
return new Response(JSON.stringify({ message: "No Results Found" }), { status: 400 });
|
||||
return new Response(JSON.stringify({ message: "No Results Found" }), { status: 404 });
|
||||
}
|
||||
|
||||
const highScoreIds = resp.matches.filter(({ score }) => score > 0.3).map(({ id }) => id)
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@
|
|||
],
|
||||
"matches": [
|
||||
"http://localhost:3000/*",
|
||||
"https://opulent-funicular-94rx4v9w775f96q-3000.app.github.dev/*",
|
||||
"https://anycontext.dhr.wtf/*",
|
||||
"<all_urls>"
|
||||
]
|
||||
|
|
@ -27,6 +28,7 @@
|
|||
"activeTab",
|
||||
"storage",
|
||||
"http://localhost:3000/*",
|
||||
"https://opulent-funicular-94rx4v9w775f96q-3000.app.github.dev/*",
|
||||
"https://anycontext.dhr.wtf/*"
|
||||
],
|
||||
"background": {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
import { useEffect, useState } from 'react';
|
||||
import { z } from 'zod';
|
||||
import { userObj } from './types/zods';
|
||||
import { getEnv } from './util';
|
||||
|
||||
const backendUrl = getEnv() === "development" ? "http://localhost:3000" : "https://supermemory.dhr.wtf";
|
||||
|
||||
function App() {
|
||||
const [userData, setUserData] = useState<z.infer<typeof userObj> | null>(
|
||||
|
|
@ -14,7 +17,7 @@ function App() {
|
|||
|
||||
if (loginButton) {
|
||||
if (jwt) {
|
||||
fetch('https://supermemory.dhr.wtf/api/me', {
|
||||
fetch(`${backendUrl}/api/me`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${jwt}`,
|
||||
},
|
||||
|
|
@ -43,7 +46,7 @@ function App() {
|
|||
<button
|
||||
onClick={() =>
|
||||
chrome.tabs.create({
|
||||
url: 'https://supermemory.dhr.wtf/api/auth/signin',
|
||||
url: `${backendUrl}/api/auth/signin`,
|
||||
})
|
||||
}
|
||||
id="login"
|
||||
|
|
|
|||
|
|
@ -79,6 +79,9 @@ function SideBar({ jwt }: { jwt: string }) {
|
|||
|
||||
// Process each part to extract JSON objects
|
||||
parts.forEach((part, index) => {
|
||||
if (part.startsWith('data: [DONE]data: ')) {
|
||||
part = part.replace('data: [DONE]data: ', 'data: ');
|
||||
}
|
||||
try {
|
||||
const parsedPart = JSON.parse(part.replace('data: ', '')); // Try to parse the part as JSON
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
import { getEnv } from "./util";
|
||||
|
||||
const backendUrl = getEnv() === "development" ? "http://localhost:3000" : "https://supermemory.dhr.wtf";
|
||||
|
||||
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
|
||||
if (request.type === "getJwt") {
|
||||
chrome.storage.local.get(["jwt"], ({ jwt }) => {
|
||||
|
|
@ -17,7 +21,7 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
|
|||
console.error("No JWT found");
|
||||
return;
|
||||
}
|
||||
fetch("https://supermemory.dhr.wtf/api/store", {
|
||||
fetch(`${backendUrl}/api/store`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Authorization": `Bearer ${jwt}`,
|
||||
|
|
@ -33,7 +37,7 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
|
|||
const jwt = request.jwt;
|
||||
|
||||
(async () => {
|
||||
await fetch("https://supermemory.dhr.wtf/api/ask", {
|
||||
await fetch(`${backendUrl}/api/ask`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Authorization": `Bearer ${jwt}`,
|
||||
|
|
|
|||
13
apps/extension/src/util.ts
Normal file
13
apps/extension/src/util.ts
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
export const getEnv = () => {
|
||||
// chrome.management.getSelf((self) => {
|
||||
// if (self.installType === 'development') {
|
||||
// return "development"
|
||||
// }
|
||||
// else {
|
||||
// return "production"
|
||||
// }
|
||||
// })
|
||||
|
||||
// return null
|
||||
return 'development'
|
||||
}
|
||||
|
|
@ -16,6 +16,14 @@ CREATE TABLE `account` (
|
|||
FOREIGN KEY (`userId`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
|
||||
);
|
||||
--> statement-breakpoint
|
||||
CREATE TABLE `contentToSpace` (
|
||||
`contentId` integer NOT NULL,
|
||||
`spaceId` integer NOT NULL,
|
||||
PRIMARY KEY(`contentId`, `spaceId`),
|
||||
FOREIGN KEY (`contentId`) REFERENCES `storedContent`(`id`) ON UPDATE no action ON DELETE no action,
|
||||
FOREIGN KEY (`spaceId`) REFERENCES `space`(`id`) ON UPDATE no action ON DELETE no action
|
||||
);
|
||||
--> statement-breakpoint
|
||||
CREATE TABLE `session` (
|
||||
`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
|
||||
`sessionToken` text(255) NOT NULL,
|
||||
|
|
@ -24,23 +32,24 @@ CREATE TABLE `session` (
|
|||
FOREIGN KEY (`userId`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
|
||||
);
|
||||
--> statement-breakpoint
|
||||
CREATE TABLE `space` (
|
||||
`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
|
||||
`name` text DEFAULT 'all' NOT NULL,
|
||||
`user` text(255),
|
||||
FOREIGN KEY (`user`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
|
||||
);
|
||||
--> statement-breakpoint
|
||||
CREATE TABLE `storedContent` (
|
||||
`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
|
||||
`content` text NOT NULL,
|
||||
`title` text(255),
|
||||
`description` text(255),
|
||||
`url` text NOT NULL,
|
||||
`space` text(255),
|
||||
`savedAt` integer NOT NULL,
|
||||
`baseUrl` text(255),
|
||||
`image` text(255)
|
||||
);
|
||||
--> statement-breakpoint
|
||||
CREATE TABLE `userStoredContent` (
|
||||
`userId` text NOT NULL,
|
||||
`contentId` integer NOT NULL,
|
||||
FOREIGN KEY (`userId`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action,
|
||||
FOREIGN KEY (`contentId`) REFERENCES `storedContent`(`id`) ON UPDATE no action ON DELETE no action
|
||||
`image` text(255),
|
||||
`user` text(255),
|
||||
FOREIGN KEY (`user`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
|
||||
);
|
||||
--> statement-breakpoint
|
||||
CREATE TABLE `user` (
|
||||
|
|
@ -60,10 +69,9 @@ CREATE TABLE `verificationToken` (
|
|||
--> statement-breakpoint
|
||||
CREATE INDEX `account_userId_idx` ON `account` (`userId`);--> statement-breakpoint
|
||||
CREATE INDEX `session_userId_idx` ON `session` (`userId`);--> statement-breakpoint
|
||||
CREATE UNIQUE INDEX `storedContent_url_unique` ON `storedContent` (`url`);--> statement-breakpoint
|
||||
CREATE INDEX `spaces_name_idx` ON `space` (`name`);--> statement-breakpoint
|
||||
CREATE INDEX `spaces_user_idx` ON `space` (`user`);--> statement-breakpoint
|
||||
CREATE INDEX `storedContent_url_idx` ON `storedContent` (`url`);--> statement-breakpoint
|
||||
CREATE INDEX `storedContent_savedAt_idx` ON `storedContent` (`savedAt`);--> statement-breakpoint
|
||||
CREATE INDEX `storedContent_title_idx` ON `storedContent` (`title`);--> statement-breakpoint
|
||||
CREATE INDEX `storedContent_space_idx` ON `storedContent` (`space`);--> statement-breakpoint
|
||||
CREATE INDEX `userStoredContent_idx` ON `userStoredContent` (`userId`,`contentId`);--> statement-breakpoint
|
||||
CREATE UNIQUE INDEX `unique_user_content` ON `userStoredContent` (`userId`,`contentId`);
|
||||
CREATE INDEX `storedContent_user_idx` ON `storedContent` (`user`);
|
||||
|
|
@ -15,17 +15,23 @@
|
|||
"schema-change": "drizzle-kit generate:sqlite --out db/schema-change.sql && wrangler d1 execute dev-d1-anycontext --local --file=db/schema-change.sql"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
"next": "14.1.0",
|
||||
"@formkit/auto-animate": "^0.8.1",
|
||||
"@radix-ui/react-avatar": "^1.0.4",
|
||||
"@radix-ui/react-dialog": "^1.0.5",
|
||||
"@radix-ui/react-icons": "^1.3.0",
|
||||
"@radix-ui/react-popover": "^1.0.7",
|
||||
"@radix-ui/react-slot": "^1.0.2",
|
||||
"class-variance-authority": "^0.7.0",
|
||||
"clsx": "^2.1.0",
|
||||
"cmdk": "latest",
|
||||
"framer-motion": "^11.0.24",
|
||||
"lucide-react": "^0.338.0",
|
||||
"next": "14.1.0",
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
"tailwind-merge": "^2.2.1",
|
||||
"tailwindcss-animate": "^1.0.7"
|
||||
"tailwindcss-animate": "^1.0.7",
|
||||
"vaul": "^0.9.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@cloudflare/next-on-pages": "1",
|
||||
|
|
@ -38,6 +44,7 @@
|
|||
"eslint-config-next": "14.1.0",
|
||||
"eslint-plugin-next-on-pages": "^1.11.0",
|
||||
"postcss": "^8",
|
||||
"tailwind-scrollbar": "^3.1.0",
|
||||
"tailwindcss": "^3.3.0",
|
||||
"typescript": "^5",
|
||||
"vercel": "^33.6.2",
|
||||
|
|
|
|||
|
|
@ -9,8 +9,13 @@ function MessagePoster({ jwt }: { jwt: string }) {
|
|||
}, [jwt]);
|
||||
|
||||
return (
|
||||
<button onClick={() => window.postMessage({ jwt }, '*')}>
|
||||
Send auth token to extension
|
||||
<button
|
||||
onClick={() => {
|
||||
if (typeof window === 'undefined') return;
|
||||
window.postMessage({ jwt }, '*');
|
||||
}}
|
||||
>
|
||||
Send message
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
67
apps/web/src/app/api/chat/route.ts
Normal file
67
apps/web/src/app/api/chat/route.ts
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
import { db } from "@/server/db";
|
||||
import { eq } from "drizzle-orm";
|
||||
import { sessions, users } from "@/server/db/schema";
|
||||
import { type NextRequest, NextResponse } from "next/server";
|
||||
import { env } from "@/env";
|
||||
import { ChatHistory } from "../../../../types/memory";
|
||||
|
||||
export const runtime = "edge";
|
||||
|
||||
export async function POST(req: NextRequest) {
|
||||
const token = req.cookies.get("next-auth.session-token")?.value ?? req.cookies.get("__Secure-authjs.session-token")?.value ?? req.cookies.get("authjs.session-token")?.value ?? req.headers.get("Authorization")?.replace("Bearer ", "");
|
||||
|
||||
const sessionData = await db.select().from(sessions).where(eq(sessions.sessionToken, token!))
|
||||
|
||||
if (!sessionData || sessionData.length === 0) {
|
||||
return new Response(JSON.stringify({ message: "Invalid Key, session not found." }), { status: 404 });
|
||||
}
|
||||
|
||||
const user = await db.select().from(users).where(eq(users.id, sessionData[0].userId)).limit(1)
|
||||
|
||||
if (!user || user.length === 0) {
|
||||
return NextResponse.json({ message: "Invalid Key, session not found." }, { status: 404 });
|
||||
}
|
||||
|
||||
const session = { session: sessionData[0], user: user[0] }
|
||||
|
||||
const query = new URL(req.url).searchParams.get("q");
|
||||
const spaces = new URL(req.url).searchParams.get("spaces");
|
||||
|
||||
const sourcesOnly = new URL(req.url).searchParams.get("sourcesOnly") ?? "false";
|
||||
|
||||
const chatHistory = await req.json() as {
|
||||
chatHistory: ChatHistory[]
|
||||
};
|
||||
|
||||
console.log("CHathistory", chatHistory)
|
||||
|
||||
if (!query) {
|
||||
return new Response(JSON.stringify({ message: "Invalid query" }), { status: 400 });
|
||||
}
|
||||
|
||||
|
||||
const resp = await fetch(`https://cf-ai-backend.dhravya.workers.dev/chat?q=${query}&user=${session.user.email ?? session.user.name}&sourcesOnly=${sourcesOnly}&spaces=${spaces}`, {
|
||||
headers: {
|
||||
"X-Custom-Auth-Key": env.BACKEND_SECURITY_KEY,
|
||||
},
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
chatHistory: chatHistory.chatHistory ?? []
|
||||
})
|
||||
})
|
||||
|
||||
console.log(resp.status)
|
||||
console.log(resp.statusText)
|
||||
|
||||
if (resp.status !== 200 || !resp.ok) {
|
||||
const errorData = await resp.json();
|
||||
console.log(errorData)
|
||||
return new Response(JSON.stringify({ message: "Error in CF function", error: errorData }), { status: resp.status });
|
||||
}
|
||||
|
||||
// Stream the response back to the client
|
||||
const { readable, writable } = new TransformStream();
|
||||
resp && resp.body!.pipeTo(writable);
|
||||
|
||||
return new Response(readable, { status: 200 });
|
||||
}
|
||||
|
|
@ -21,7 +21,7 @@ export async function GET(req: NextRequest) {
|
|||
return NextResponse.json({ message: "Invalid Key, session not found." }, { status: 404 });
|
||||
}
|
||||
|
||||
const session = {session: sessionData[0], user: user[0]}
|
||||
const session = { session: sessionData[0], user: user[0] }
|
||||
|
||||
const query = new URL(req.url).searchParams.get("q");
|
||||
const sourcesOnly = new URL(req.url).searchParams.get("sourcesOnly") ?? "false";
|
||||
|
|
@ -36,8 +36,11 @@ export async function GET(req: NextRequest) {
|
|||
}
|
||||
})
|
||||
|
||||
console.log(resp.status)
|
||||
|
||||
if (resp.status !== 200 || !resp.ok) {
|
||||
const errorData = await resp.json();
|
||||
console.log(errorData)
|
||||
return new Response(JSON.stringify({ message: "Error in CF function", error: errorData }), { status: resp.status });
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { db } from "@/server/db";
|
||||
import { eq } from "drizzle-orm";
|
||||
import { sessions, storedContent, userStoredContent, users } from "@/server/db/schema";
|
||||
import { and, eq } from "drizzle-orm";
|
||||
import { contentToSpace, sessions, storedContent, users, space } from "@/server/db/schema";
|
||||
import { type NextRequest, NextResponse } from "next/server";
|
||||
import { env } from "@/env";
|
||||
import { getMetaData } from "@/server/helpers";
|
||||
|
|
@ -31,6 +31,7 @@ export async function POST(req: NextRequest) {
|
|||
const data = await req.json() as {
|
||||
pageContent: string,
|
||||
url: string,
|
||||
space?: string
|
||||
};
|
||||
|
||||
const metadata = await getMetaData(data.url);
|
||||
|
|
@ -38,32 +39,46 @@ export async function POST(req: NextRequest) {
|
|||
|
||||
let id: number | undefined = undefined;
|
||||
|
||||
const storedCont = await db.select().from(storedContent).where(eq(storedContent.url, data.url)).limit(1)
|
||||
let storeToSpace = data.space
|
||||
|
||||
if (storedCont.length > 0) {
|
||||
id = storedCont[0].id;
|
||||
} else {
|
||||
const storedContentId = await db.insert(storedContent).values({
|
||||
content: data.pageContent,
|
||||
title: metadata.title,
|
||||
description: metadata.description,
|
||||
url: data.url,
|
||||
baseUrl: metadata.baseUrl,
|
||||
image: metadata.image,
|
||||
savedAt: new Date()
|
||||
if (!storeToSpace) {
|
||||
storeToSpace = 'all'
|
||||
}
|
||||
|
||||
const storedContentId = await db.insert(storedContent).values({
|
||||
content: data.pageContent,
|
||||
title: metadata.title,
|
||||
description: metadata.description,
|
||||
url: data.url,
|
||||
baseUrl: metadata.baseUrl,
|
||||
image: metadata.image,
|
||||
savedAt: new Date(),
|
||||
user: session.user.id
|
||||
})
|
||||
|
||||
id = storedContentId.meta.last_row_id;
|
||||
|
||||
if (!id) {
|
||||
return NextResponse.json({ message: "Error", error: "Error in CF function" }, { status: 500 });
|
||||
}
|
||||
|
||||
let spaceID = 0;
|
||||
|
||||
const spaceData = await db.select().from(space).where(and(eq(space.name, storeToSpace), eq(space.user, session.user.id))).limit(1)
|
||||
spaceID = spaceData[0]?.id
|
||||
|
||||
if (!spaceData || spaceData.length === 0) {
|
||||
const spaceId = await db.insert(space).values({
|
||||
name: storeToSpace,
|
||||
user: session.user.id
|
||||
})
|
||||
|
||||
id = storedContentId.meta.last_row_id;
|
||||
spaceID = spaceId.meta.last_row_id;
|
||||
}
|
||||
|
||||
try {
|
||||
await db.insert(userStoredContent).values({
|
||||
userId: session.user.id,
|
||||
contentId: id
|
||||
});
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
await db.insert(contentToSpace).values({
|
||||
contentId: id as number,
|
||||
spaceId: spaceID
|
||||
})
|
||||
|
||||
const res = await Promise.race([
|
||||
fetch("https://cf-ai-backend.dhravya.workers.dev/add", {
|
||||
|
|
@ -78,10 +93,6 @@ export async function POST(req: NextRequest) {
|
|||
)
|
||||
]) as Response
|
||||
|
||||
const _ = await res.text();
|
||||
|
||||
console.log(_)
|
||||
|
||||
if (res.status !== 200) {
|
||||
return NextResponse.json({ message: "Error", error: "Error in CF function" }, { status: 500 });
|
||||
}
|
||||
|
|
|
|||
18
apps/web/src/app/content.tsx
Normal file
18
apps/web/src/app/content.tsx
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
'use client';
|
||||
import Main from '@/components/Main';
|
||||
import Sidebar from '@/components/Sidebar/index';
|
||||
import { SessionProvider } from 'next-auth/react';
|
||||
import { useState } from 'react';
|
||||
|
||||
export default function Content() {
|
||||
const [selectedItem, setSelectedItem] = useState<string | null>(null);
|
||||
|
||||
return (
|
||||
<SessionProvider>
|
||||
<div className="flex w-screen">
|
||||
<Sidebar selectChange={setSelectedItem} />
|
||||
<Main sidebarOpen={selectedItem !== null} />
|
||||
</div>
|
||||
</SessionProvider>
|
||||
);
|
||||
}
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
}
|
||||
|
||||
body {
|
||||
@apply bg-rgray-1 text-rgray-11;
|
||||
@apply bg-rgray-2 text-rgray-11 max-h-screen overflow-y-hidden;
|
||||
/* color: rgb(var(--foreground-rgb));
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
|
|
@ -30,8 +30,41 @@ body {
|
|||
rgb(var(--background-start-rgb)); */
|
||||
}
|
||||
|
||||
[vaul-drawer-wrapper] {
|
||||
@apply bg-rgray-2;
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
.text-balance {
|
||||
text-wrap: balance;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
height: 100vh;
|
||||
height: 100dvh;
|
||||
max-height: 100vh;
|
||||
max-height: 100dvh;
|
||||
}
|
||||
|
||||
.DrawerContent {
|
||||
padding-top: 5vh;
|
||||
padding-top: 5dvh;
|
||||
}
|
||||
|
||||
.main-hidden {
|
||||
padding-bottom: 20vh;
|
||||
padding-bottom: 15dvh;
|
||||
}
|
||||
|
||||
.chat-answer pre {
|
||||
@apply bg-rgray-3 rounded-md border border-rgray-5 p-3 text-sm my-5;
|
||||
}
|
||||
|
||||
.chat-answer h1 {
|
||||
@apply text-rgray-11 text-xl font-medium my-5;
|
||||
}
|
||||
|
||||
.chat-answer img {
|
||||
@apply rounded-md font-medium my-5;
|
||||
}
|
||||
|
|
@ -15,8 +15,12 @@ export default function RootLayout({
|
|||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={roboto.className}>{children}</body>
|
||||
<html lang="en" className="dark">
|
||||
<body className={roboto.className}>
|
||||
<div vaul-drawer-wrapper="" className="min-w-screen overflow-x-hidden">
|
||||
{children}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,29 +1,33 @@
|
|||
import { CardContent, Card } from '@/components/ui/card';
|
||||
import { db } from '@/server/db';
|
||||
import { db } from "@/server/db";
|
||||
import {
|
||||
contentToSpace,
|
||||
sessions,
|
||||
space,
|
||||
StoredContent,
|
||||
storedContent,
|
||||
userStoredContent,
|
||||
users,
|
||||
} from '@/server/db/schema';
|
||||
import { eq, inArray } from 'drizzle-orm';
|
||||
import { cookies, headers } from 'next/headers';
|
||||
import { redirect } from 'next/navigation';
|
||||
import Image from 'next/image';
|
||||
import QueryAI from '@/components/QueryAI';
|
||||
import MessagePoster from './MessagePoster';
|
||||
} from "@/server/db/schema";
|
||||
import { eq, inArray } from "drizzle-orm";
|
||||
import { cookies, headers } from "next/headers";
|
||||
import { redirect } from "next/navigation";
|
||||
import Sidebar from "@/components/Sidebar/index";
|
||||
import Main from "@/components/Main";
|
||||
import MessagePoster from "./MessagePoster";
|
||||
import { transformContent } from "../../types/memory";
|
||||
import { MemoryProvider } from "@/contexts/MemoryContext";
|
||||
import Content from "./content";
|
||||
|
||||
export const runtime = 'edge';
|
||||
export const runtime = "edge";
|
||||
|
||||
export default async function Home() {
|
||||
const token =
|
||||
cookies().get('next-auth.session-token')?.value ??
|
||||
cookies().get('__Secure-authjs.session-token')?.value ??
|
||||
cookies().get('authjs.session-token')?.value ??
|
||||
headers().get('Authorization')?.replace('Bearer ', '');
|
||||
cookies().get("next-auth.session-token")?.value ??
|
||||
cookies().get("__Secure-authjs.session-token")?.value ??
|
||||
cookies().get("authjs.session-token")?.value ??
|
||||
headers().get("Authorization")?.replace("Bearer ", "");
|
||||
|
||||
if (!token) {
|
||||
return redirect('/api/auth/signin');
|
||||
return redirect("/api/auth/signin");
|
||||
}
|
||||
|
||||
const session = await db
|
||||
|
|
@ -32,104 +36,50 @@ export default async function Home() {
|
|||
.where(eq(sessions.sessionToken, token!));
|
||||
|
||||
if (!session || session.length === 0) {
|
||||
return redirect('/api/auth/signin');
|
||||
return redirect("/api/auth/signin");
|
||||
}
|
||||
|
||||
const userContent = await db
|
||||
.select()
|
||||
.from(userStoredContent)
|
||||
.where(eq(userStoredContent.userId, session[0].userId));
|
||||
|
||||
const userData = await db
|
||||
const [userData] = await db
|
||||
.select()
|
||||
.from(users)
|
||||
.where(eq(users.id, session[0].userId))
|
||||
.limit(1);
|
||||
|
||||
if (!userData || userData.length === 0) {
|
||||
return redirect('/api/auth/signin');
|
||||
if (!userData) {
|
||||
return redirect("/api/auth/signin");
|
||||
}
|
||||
|
||||
const listOfContent =
|
||||
userContent.map((content) => content.contentId).length > 0
|
||||
? userContent.map((content) => content.contentId)
|
||||
: [1];
|
||||
|
||||
const posts = await db
|
||||
// Fetch all content for the user
|
||||
const contents = await db
|
||||
.select()
|
||||
.from(storedContent)
|
||||
.where(inArray(storedContent.id, listOfContent));
|
||||
.where(eq(storedContent.user, userData.id))
|
||||
.all();
|
||||
|
||||
const collectedSpaces =
|
||||
contents.length > 0 ? await transformContent(contents) : [];
|
||||
|
||||
collectedSpaces.push({
|
||||
id: 2,
|
||||
title: "Test",
|
||||
content: [
|
||||
{
|
||||
id: 1,
|
||||
content: "Test",
|
||||
title: "Vscode",
|
||||
description: "Test",
|
||||
url: "https://vscode-remake.vercel.app/",
|
||||
savedAt: new Date(),
|
||||
baseUrl: "https://vscode-remake.vercel.app/",
|
||||
image: "https://vscode-remake.vercel.app/favicon.svg",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex flex-col items-center">
|
||||
<div className="flex flex-col mt-16">
|
||||
<div className="flex flex-col md:flex-row gap-4">
|
||||
<Image
|
||||
className="rounded-2xl"
|
||||
src="/logo.png"
|
||||
width={120}
|
||||
height={120}
|
||||
alt="logo"
|
||||
/>
|
||||
<div className="mt-4 text-gray-400 max-w-md">
|
||||
<h1 className="text-xl font-bold text-white">SuperMemory</h1>
|
||||
Remember that one thing you read a while ago? We got you covered.
|
||||
Add the extension, click a button and I'll remember it for you.{' '}
|
||||
<a
|
||||
href="https://github.com/dhravyashah/anycontext"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="text-sky-500"
|
||||
>
|
||||
Get the Extension
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<QueryAI />
|
||||
|
||||
<MessagePoster jwt={token} />
|
||||
|
||||
{/* TODO: LABEL THE WEBSITES USING A CLASSIFICATION MODEL */}
|
||||
{/* <nav className="flex space-x-2 my-4">
|
||||
<Badge variant="secondary">Technology (2)</Badge>
|
||||
<Badge variant="secondary">Business & Finance (1)</Badge>
|
||||
<Badge variant="secondary">Education & Career (1)</Badge>
|
||||
</nav> */}
|
||||
<main className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mt-16">
|
||||
{posts.reverse().map((post) => (
|
||||
<a
|
||||
href={post.url}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:scale-105 ease-in-out transition-transform duration-300"
|
||||
>
|
||||
<Card className="w-full">
|
||||
<img
|
||||
alt="Not found"
|
||||
className="w-full h-48 object-cover rounded-md"
|
||||
height="200"
|
||||
src={
|
||||
post.image && post.image !== 'Image not found'
|
||||
? post.image
|
||||
: '/placeholder.svg'
|
||||
}
|
||||
style={{
|
||||
aspectRatio: '300/200',
|
||||
objectFit: 'cover',
|
||||
}}
|
||||
width="300"
|
||||
/>
|
||||
<CardContent>
|
||||
<h3 className="text-lg font-semibold mt-4">{post.title}</h3>
|
||||
<p className="text-sm text-gray-600">{post.baseUrl}</p>
|
||||
<p className="text-sm">{post.description}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</a>
|
||||
))}
|
||||
</main>
|
||||
</div>
|
||||
<MemoryProvider spaces={collectedSpaces}>
|
||||
<Content />
|
||||
{/* <MessagePoster jwt={token} /> */}
|
||||
</MemoryProvider>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
import Sidebar from "@/components/Sidebar";
|
||||
|
||||
export default async function Home() {
|
||||
return (
|
||||
<>
|
||||
<Sidebar />
|
||||
</>
|
||||
);
|
||||
}
|
||||
104
apps/web/src/assets/Bin.tsx
Normal file
104
apps/web/src/assets/Bin.tsx
Normal file
|
|
@ -0,0 +1,104 @@
|
|||
import { cn } from "@/lib/utils";
|
||||
import { useEffect, useRef } from "react";
|
||||
|
||||
export const Bin: React.FC<React.HTMLAttributes<HTMLDivElement> & {}> = ({
|
||||
className,
|
||||
...props
|
||||
}) => {
|
||||
const icon = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
let timeout: ReturnType<typeof setTimeout> | undefined;
|
||||
|
||||
const observer = new MutationObserver(function (mutations) {
|
||||
mutations.forEach(function (mutation) {
|
||||
if (
|
||||
mutation.type === "attributes" &&
|
||||
mutation.attributeName === "data-open" &&
|
||||
(mutation.oldValue === "false" || mutation.oldValue === null) &&
|
||||
icon.current?.dataset["open"] === "true"
|
||||
) {
|
||||
if (timeout) clearTimeout(timeout);
|
||||
timeout = setTimeout(() => {
|
||||
icon.current!.dataset["open"] = "false";
|
||||
}, 2000);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
observer.observe(icon.current!, {
|
||||
attributes: true, //configure it to listen to attribute changes
|
||||
});
|
||||
|
||||
return () => {
|
||||
observer.disconnect();
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div
|
||||
ref={icon}
|
||||
data-open="false"
|
||||
className={cn(
|
||||
"relative z-[100] flex w-full origin-bottom flex-col items-center justify-center transition-transform delay-500 duration-500 data-[open='true']:-translate-y-2 data-[open='true']:scale-150 data-[open='true']:delay-0 [&[data-open='true']>[data-lid]]:rotate-[150deg] [&[data-open='true']>[data-lid]]:delay-0",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<svg
|
||||
data-lid
|
||||
className="w-full origin-[90%_80%] transition-transform delay-500 duration-500 ease-in-out"
|
||||
viewBox="0 0 24 7"
|
||||
fill="none"
|
||||
strokeWidth={1}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M3 6H21"
|
||||
stroke="currentColor"
|
||||
strokeWidth={1}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M8 6V4C8 3 9 2 10 2H14C15 2 16 3 16 4V6"
|
||||
stroke="currentColor"
|
||||
strokeWidth={1}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
className="-mt-[1px] w-full"
|
||||
viewBox="0 0 24 19"
|
||||
fill="none"
|
||||
strokeWidth={1}
|
||||
data-trash-bin
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19 1V15C19 16 18 17 17 17H7C6 17 5 16 5 15V1"
|
||||
stroke="currentColor"
|
||||
strokeWidth={1}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M10 6V12"
|
||||
stroke="currentColor"
|
||||
strokeWidth={1}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M14 6V12"
|
||||
stroke="currentColor"
|
||||
strokeWidth={1}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
69
apps/web/src/assets/Memories.tsx
Normal file
69
apps/web/src/assets/Memories.tsx
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
export const MemoryIcon: React.FC<React.SVGAttributes<SVGElement>> = (
|
||||
props,
|
||||
) => (
|
||||
<svg
|
||||
viewBox="0 0 89 53"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<rect
|
||||
x="0.40697"
|
||||
y="8.52821"
|
||||
width="43.0286"
|
||||
height="43.0286"
|
||||
rx="5.5"
|
||||
transform="rotate(-12 0.40697 8.52821)"
|
||||
fill="var(--gray-5)"
|
||||
stroke="var(--gray-10)"
|
||||
/>
|
||||
<rect
|
||||
x="20.8257"
|
||||
y="9.19775"
|
||||
width="43"
|
||||
height="43"
|
||||
rx="5.5"
|
||||
fill="var(--gray-5)"
|
||||
stroke="var(--gray-10)"
|
||||
/>
|
||||
<rect
|
||||
x="47.6965"
|
||||
y="-0.612372"
|
||||
width="43.0286"
|
||||
height="43.0286"
|
||||
rx="5.5"
|
||||
transform="rotate(15 47.6965 -0.612372)"
|
||||
fill="var(--gray-5)"
|
||||
stroke="var(--gray-10)"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const SpaceIcon: React.FC<React.SVGAttributes<SVGElement>> = (props) => (
|
||||
<svg
|
||||
viewBox="0 0 34 30"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<rect
|
||||
x="1.39502"
|
||||
y="5.2229"
|
||||
width="24"
|
||||
height="24"
|
||||
rx="5.5"
|
||||
fill="var(--gray-5)"
|
||||
stroke="var(--gray-10)"
|
||||
/>
|
||||
<rect
|
||||
x="11.2231"
|
||||
y="-0.157702"
|
||||
width="24"
|
||||
height="24"
|
||||
rx="5.5"
|
||||
transform="rotate(20 11.2231 -0.157702)"
|
||||
fill="var(--gray-5)"
|
||||
stroke="var(--gray-10)"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
528
apps/web/src/assets/MemoryWithImages.tsx
Normal file
528
apps/web/src/assets/MemoryWithImages.tsx
Normal file
|
|
@ -0,0 +1,528 @@
|
|||
import { svgId } from "@/lib/utils";
|
||||
|
||||
export const MemoryWithImage: React.FC<
|
||||
{ image: string; id: string } & React.SVGAttributes<SVGElement>
|
||||
> = ({ image, id: _id, ...props }) => {
|
||||
const id = "space-1-" + _id;
|
||||
|
||||
return (
|
||||
<svg
|
||||
viewBox="0 0 137 137"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
{...props}
|
||||
>
|
||||
<g filter={`url(#${svgId(id, "filter0_d_83_72")})`}>
|
||||
<rect
|
||||
x="33"
|
||||
y="33"
|
||||
width="72.207"
|
||||
height="72.207"
|
||||
rx="10"
|
||||
fill="var(--gray-4)"
|
||||
/>
|
||||
</g>
|
||||
<rect
|
||||
x="47.0637"
|
||||
y="46.9976"
|
||||
width="45"
|
||||
height="45"
|
||||
fill={`url(#${svgId(id, "pattern0")})`}
|
||||
/>
|
||||
<defs>
|
||||
<filter
|
||||
id={svgId(id, "filter0_d_83_72")}
|
||||
x="21"
|
||||
y="21"
|
||||
width="96.207"
|
||||
height="96.207"
|
||||
filterUnits="userSpaceOnUse"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="2"
|
||||
operator="dilate"
|
||||
in="SourceAlpha"
|
||||
result="effect1_dropShadow_83_72"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="5" />
|
||||
<feComposite in2="hardAlpha" operator="out" />
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="BackgroundImageFix"
|
||||
result="effect1_dropShadow_83_72"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="effect1_dropShadow_83_72"
|
||||
result="shape"
|
||||
/>
|
||||
</filter>
|
||||
<pattern
|
||||
id={svgId(id, "pattern0")}
|
||||
patternContentUnits="objectBoundingBox"
|
||||
width="1"
|
||||
height="1"
|
||||
>
|
||||
<use
|
||||
xlinkHref={`#${svgId(id, "image0_83_72")}`}
|
||||
transform="scale(0.00520833)"
|
||||
/>
|
||||
</pattern>
|
||||
<image
|
||||
id={svgId(id, "image0_83_72")}
|
||||
width="192"
|
||||
height="192"
|
||||
xlinkHref={image}
|
||||
/>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
export const MemoryWithImages2: React.FC<
|
||||
{ images: string[]; id: string } & React.SVGAttributes<SVGElement>
|
||||
> = ({ images, id: _id, ...props }) => {
|
||||
const id = "space-2-" + _id;
|
||||
|
||||
return (
|
||||
<svg
|
||||
viewBox="0 0 137 137"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
{...props}
|
||||
>
|
||||
<g clipPath={`url(#${svgId(id, "clip0_80_62")})`}>
|
||||
<g filter={`url(#${svgId(id, "filter0_d_80_62")})`}>
|
||||
<rect
|
||||
x="7"
|
||||
y="51.5427"
|
||||
width="72.207"
|
||||
height="72.207"
|
||||
rx="10"
|
||||
transform="rotate(-24.1922 7 51.5427)"
|
||||
fill="var(--gray-4)"
|
||||
/>
|
||||
</g>
|
||||
<rect
|
||||
x="26.2664"
|
||||
y="58.9253"
|
||||
width="45"
|
||||
height="45"
|
||||
transform="rotate(-24.2 26.2664 58.9253)"
|
||||
fill={`url(#${svgId(id, "pattern0")})`}
|
||||
/>
|
||||
<g filter={`url(#${svgId(id, "filter1_d_80_62")})`}>
|
||||
<rect
|
||||
x="59.9409"
|
||||
y="42.2124"
|
||||
width="72.207"
|
||||
height="72.207"
|
||||
rx="10"
|
||||
transform="rotate(10.2301 59.9409 42.2124)"
|
||||
fill="var(--gray-4)"
|
||||
/>
|
||||
</g>
|
||||
<rect
|
||||
x="71.2952"
|
||||
y="58.4851"
|
||||
width="45"
|
||||
height="45"
|
||||
transform="rotate(10.23 71.2952 58.4851)"
|
||||
fill={`url(#${svgId(id, "pattern1")})`}
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter
|
||||
id={svgId(id, "filter0_d_80_62")}
|
||||
x="-1.78271"
|
||||
y="13.1697"
|
||||
width="113.021"
|
||||
height="113.021"
|
||||
filterUnits="userSpaceOnUse"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="2"
|
||||
operator="dilate"
|
||||
in="SourceAlpha"
|
||||
result="effect1_dropShadow_80_62"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="5" />
|
||||
<feComposite in2="hardAlpha" operator="out" />
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="BackgroundImageFix"
|
||||
result="effect1_dropShadow_80_62"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="effect1_dropShadow_80_62"
|
||||
result="shape"
|
||||
/>
|
||||
</filter>
|
||||
<pattern
|
||||
id={svgId(id, "pattern0")}
|
||||
patternContentUnits="objectBoundingBox"
|
||||
width="1"
|
||||
height="1"
|
||||
>
|
||||
<use
|
||||
xlinkHref={`#${svgId(id, "image0_80_62")}`}
|
||||
transform="scale(0.0111111)"
|
||||
/>
|
||||
</pattern>
|
||||
<filter
|
||||
id={svgId(id, "filter1_d_80_62")}
|
||||
x="36.7322"
|
||||
y="31.8276"
|
||||
width="104.652"
|
||||
height="104.653"
|
||||
filterUnits="userSpaceOnUse"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="2"
|
||||
operator="dilate"
|
||||
in="SourceAlpha"
|
||||
result="effect1_dropShadow_80_62"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="5" />
|
||||
<feComposite in2="hardAlpha" operator="out" />
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="BackgroundImageFix"
|
||||
result="effect1_dropShadow_80_62"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="effect1_dropShadow_80_62"
|
||||
result="shape"
|
||||
/>
|
||||
</filter>
|
||||
<pattern
|
||||
id={svgId(id, "pattern1")}
|
||||
patternContentUnits="objectBoundingBox"
|
||||
width="1"
|
||||
height="1"
|
||||
>
|
||||
<use
|
||||
xlinkHref={`#${svgId(id, "image1_80_62")}`}
|
||||
transform="scale(0.00520833)"
|
||||
/>
|
||||
</pattern>
|
||||
<clipPath id={svgId(id, "clip0_80_62")}>
|
||||
<rect width="137" height="137" fill="white" />
|
||||
</clipPath>
|
||||
<image
|
||||
id={svgId(id, "image0_80_62")}
|
||||
width="90"
|
||||
height="90"
|
||||
xlinkHref={images[0]}
|
||||
/>
|
||||
<image
|
||||
id={svgId(id, "image1_80_62")}
|
||||
width="192"
|
||||
height="192"
|
||||
xlinkHref={images[1]}
|
||||
/>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
export const MemoryWithImages3: React.FC<
|
||||
{ images: string[]; id: string } & React.SVGAttributes<SVGElement>
|
||||
> = ({ images, id: _id, ...props }) => {
|
||||
const id = "space-3-" + _id;
|
||||
|
||||
return (
|
||||
<svg
|
||||
viewBox="0 0 137 137"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
{...props}
|
||||
>
|
||||
<g clipPath={`url(#${svgId(id, "clip0_79_36")})`}>
|
||||
<g filter={`url(#${svgId(id, "filter0_d_79_36")})`}>
|
||||
<rect
|
||||
x="53.5242"
|
||||
y="12"
|
||||
width="72.207"
|
||||
height="72.207"
|
||||
rx="10"
|
||||
transform="rotate(14.9009 53.5242 12)"
|
||||
fill="var(--gray-4)"
|
||||
/>
|
||||
</g>
|
||||
<rect
|
||||
x="63.3663"
|
||||
y="27.3052"
|
||||
width="45"
|
||||
height="45"
|
||||
transform="rotate(14.9 63.3663 27.3052)"
|
||||
fill={`url(#${svgId(id, "pattern0")})`}
|
||||
/>
|
||||
<g filter={`url(#${svgId(id, "filter1_d_79_36")})`}>
|
||||
<rect
|
||||
x="7"
|
||||
y="51.5427"
|
||||
width="72.207"
|
||||
height="72.207"
|
||||
rx="10"
|
||||
transform="rotate(-24.1922 7 51.5427)"
|
||||
fill="var(--gray-4)"
|
||||
/>
|
||||
</g>
|
||||
<rect
|
||||
x="26.2664"
|
||||
y="58.9253"
|
||||
width="45"
|
||||
height="45"
|
||||
transform="rotate(-24.2 26.2664 58.9253)"
|
||||
fill={`url(#${svgId(id, "pattern1")})`}
|
||||
/>
|
||||
<g filter={`url(#${svgId(id, "filter2_d_79_36")})`}>
|
||||
<rect
|
||||
x="59.9409"
|
||||
y="42.2124"
|
||||
width="72.207"
|
||||
height="72.207"
|
||||
rx="10"
|
||||
transform="rotate(10.2301 59.9409 42.2124)"
|
||||
fill="var(--gray-4)"
|
||||
/>
|
||||
</g>
|
||||
<rect
|
||||
x="71.2952"
|
||||
y="58.4851"
|
||||
width="45"
|
||||
height="45"
|
||||
transform="rotate(10.23 71.2952 58.4851)"
|
||||
fill={`url(#${svgId(id, "pattern2")})`}
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter
|
||||
id={svgId(id, "filter0_d_79_36")}
|
||||
x="25.189"
|
||||
y="2.23267"
|
||||
width="107.881"
|
||||
height="107.881"
|
||||
filterUnits="userSpaceOnUse"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="2"
|
||||
operator="dilate"
|
||||
in="SourceAlpha"
|
||||
result="effect1_dropShadow_79_36"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="5" />
|
||||
<feComposite in2="hardAlpha" operator="out" />
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="BackgroundImageFix"
|
||||
result="effect1_dropShadow_79_36"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="effect1_dropShadow_79_36"
|
||||
result="shape"
|
||||
/>
|
||||
</filter>
|
||||
<pattern
|
||||
id={svgId(id, "pattern0")}
|
||||
patternContentUnits="objectBoundingBox"
|
||||
width="1"
|
||||
height="1"
|
||||
>
|
||||
<use
|
||||
xlinkHref={`#${svgId(id, "image0_79_36")}`}
|
||||
transform="scale(0.0111111)"
|
||||
/>
|
||||
</pattern>
|
||||
<filter
|
||||
id={svgId(id, "filter1_d_79_36")}
|
||||
x="-1.78271"
|
||||
y="13.1697"
|
||||
width="113.021"
|
||||
height="113.021"
|
||||
filterUnits="userSpaceOnUse"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="2"
|
||||
operator="dilate"
|
||||
in="SourceAlpha"
|
||||
result="effect1_dropShadow_79_36"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="5" />
|
||||
<feComposite in2="hardAlpha" operator="out" />
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="BackgroundImageFix"
|
||||
result="effect1_dropShadow_79_36"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="effect1_dropShadow_79_36"
|
||||
result="shape"
|
||||
/>
|
||||
</filter>
|
||||
<pattern
|
||||
id={svgId(id, "pattern1")}
|
||||
patternContentUnits="objectBoundingBox"
|
||||
width="1"
|
||||
height="1"
|
||||
>
|
||||
<use
|
||||
xlinkHref={`#${svgId(id, "image1_79_36")}`}
|
||||
transform="scale(0.0111111)"
|
||||
/>
|
||||
</pattern>
|
||||
<filter
|
||||
id={svgId(id, "filter2_d_79_36")}
|
||||
x="36.7322"
|
||||
y="31.8276"
|
||||
width="104.652"
|
||||
height="104.653"
|
||||
filterUnits="userSpaceOnUse"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feColorMatrix
|
||||
in="SourceAlpha"
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
result="hardAlpha"
|
||||
/>
|
||||
<feMorphology
|
||||
radius="2"
|
||||
operator="dilate"
|
||||
in="SourceAlpha"
|
||||
result="effect1_dropShadow_79_36"
|
||||
/>
|
||||
<feOffset />
|
||||
<feGaussianBlur stdDeviation="5" />
|
||||
<feComposite in2="hardAlpha" operator="out" />
|
||||
<feColorMatrix
|
||||
type="matrix"
|
||||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in2="BackgroundImageFix"
|
||||
result="effect1_dropShadow_79_36"
|
||||
/>
|
||||
<feBlend
|
||||
mode="normal"
|
||||
in="SourceGraphic"
|
||||
in2="effect1_dropShadow_79_36"
|
||||
result="shape"
|
||||
/>
|
||||
</filter>
|
||||
<pattern
|
||||
id={svgId(id, "pattern2")}
|
||||
patternContentUnits="objectBoundingBox"
|
||||
width="1"
|
||||
height="1"
|
||||
>
|
||||
<use
|
||||
xlinkHref={`#${svgId(id, "image2_79_36")}`}
|
||||
transform="scale(0.00520833)"
|
||||
/>
|
||||
</pattern>
|
||||
<clipPath id={svgId(id, "clip0_79_36")}>
|
||||
<rect width="137" height="137" fill="white" />
|
||||
</clipPath>
|
||||
<image
|
||||
id={svgId(id, "image0_79_36")}
|
||||
width="90"
|
||||
height="90"
|
||||
xlinkHref={images[0]}
|
||||
/>
|
||||
<image
|
||||
id={svgId(id, "image1_79_36")}
|
||||
width="90"
|
||||
height="90"
|
||||
xlinkHref={images[1]}
|
||||
/>
|
||||
<image
|
||||
id={svgId(id, "image2_79_36")}
|
||||
width="192"
|
||||
height="192"
|
||||
xlinkHref={images[2]}
|
||||
/>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
105
apps/web/src/components/ChatMessage.tsx
Normal file
105
apps/web/src/components/ChatMessage.tsx
Normal file
|
|
@ -0,0 +1,105 @@
|
|||
import React, { useEffect } from "react";
|
||||
import { motion } from "framer-motion";
|
||||
import { ArrowUpRight, Globe } from "lucide-react";
|
||||
import { convertRemToPixels } from "@/lib/utils";
|
||||
import { SpaceIcon } from "@/assets/Memories";
|
||||
import Markdown from "react-markdown";
|
||||
|
||||
export function ChatAnswer({
|
||||
children: message,
|
||||
sources,
|
||||
loading = false,
|
||||
}: {
|
||||
children: string;
|
||||
sources?: string[];
|
||||
loading?: boolean;
|
||||
}) {
|
||||
return (
|
||||
<div className="flex h-max w-full flex-col items-start gap-5">
|
||||
{loading ? (
|
||||
<MessageSkeleton />
|
||||
) : (
|
||||
<div className="chat-answer h-full w-full text-lg text-white/60">
|
||||
<Markdown>{message}</Markdown>
|
||||
</div>
|
||||
)}
|
||||
{!loading && sources && sources?.length > 0 && (
|
||||
<>
|
||||
<h1 className="animate-fade-in text-rgray-12 text-md flex items-center justify-center gap-2 opacity-0 [animation-duration:1s]">
|
||||
<SpaceIcon className="h-6 w-6 -translate-y-[2px]" />
|
||||
Related Memories
|
||||
</h1>
|
||||
<div className="animate-fade-in -mt-3 flex items-center justify-start opacity-0 [animation-duration:1s]">
|
||||
{sources?.map((source) => (
|
||||
<a
|
||||
className="bg-rgray-3 flex items-center justify-center gap-2 rounded-full py-1 pl-2 pr-3 text-sm"
|
||||
key={source}
|
||||
href={source}
|
||||
>
|
||||
<Globe className="h-4 w-4" />
|
||||
{source}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function ChatQuestion({ children }: { children: string }) {
|
||||
return (
|
||||
<div
|
||||
className={`text-rgray-12 h-max w-full text-left ${children.length > 200 ? "text-xl" : "text-2xl"}`}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function ChatMessage({
|
||||
children,
|
||||
isLast = false,
|
||||
index,
|
||||
}: {
|
||||
children: React.ReactNode | React.ReactNode[];
|
||||
isLast?: boolean;
|
||||
index: number;
|
||||
}) {
|
||||
const messageRef = React.useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isLast) return;
|
||||
messageRef.current?.parentElement?.scrollTo({
|
||||
top: messageRef.current?.offsetTop,
|
||||
behavior: "smooth",
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{
|
||||
type: "tween",
|
||||
duration: 0.5,
|
||||
}}
|
||||
ref={messageRef}
|
||||
className={`${index === 0 ? "pt-16" : "pt-28"} flex h-max w-full resize-y flex-col items-start justify-start gap-5 transition-[height] ${isLast ? "min-h-screen pb-[40vh]" : "h-max"}`}
|
||||
>
|
||||
{children}
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
|
||||
function MessageSkeleton() {
|
||||
return (
|
||||
<div className="animate-fade-in flex w-full flex-col items-start gap-3 opacity-0 [animation-delay:0.5s] [animation-duration:1s]">
|
||||
<div className="bg-rgray-5 h-6 w-full animate-pulse rounded-md text-lg"></div>
|
||||
<div className="bg-rgray-5 h-6 w-full animate-pulse rounded-md text-lg"></div>
|
||||
<div className="bg-rgray-5 h-6 w-full animate-pulse rounded-md text-lg"></div>
|
||||
<div className="bg-rgray-5 h-6 w-full animate-pulse rounded-md text-lg"></div>
|
||||
<div className="bg-rgray-5 h-6 w-[70%] animate-pulse rounded-md text-lg"></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
444
apps/web/src/components/Main.tsx
Normal file
444
apps/web/src/components/Main.tsx
Normal file
|
|
@ -0,0 +1,444 @@
|
|||
"use client";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import { FilterCombobox } from "./Sidebar/FilterCombobox";
|
||||
import { Textarea2 } from "./ui/textarea";
|
||||
import { ArrowRight, ArrowUp } from "lucide-react";
|
||||
import { MemoryDrawer } from "./MemoryDrawer";
|
||||
import useViewport from "@/hooks/useViewport";
|
||||
import { AnimatePresence, motion } from "framer-motion";
|
||||
import { cn, countLines } from "@/lib/utils";
|
||||
import { ChatHistory } from "../../types/memory";
|
||||
import { ChatAnswer, ChatMessage, ChatQuestion } from "./ChatMessage";
|
||||
import { useRouter, useSearchParams } from "next/navigation";
|
||||
import { useMemory } from "@/contexts/MemoryContext";
|
||||
|
||||
function supportsDVH() {
|
||||
try {
|
||||
return CSS.supports("height: 100dvh");
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
const failResponse = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. In volutpat bibendum ligula, nec consectetur purus iaculis eu. Sed venenatis magna at lacus efficitur, vel faucibus sem lobortis. Sed sit amet imperdiet eros, nec vestibulum ante. Integer ut eros pulvinar, tempus augue a, blandit nisl. Nulla ut ligula molestie, tincidunt ligula vitae, rhoncus tellus. Vestibulum molestie, orci nec scelerisque finibus, mauris eros convallis urna, vitae vehicula metus nisi id urna. Phasellus non metus et lectus sollicitudin convallis a sit amet turpis. Donec id lacinia sapien.
|
||||
|
||||
Donec eget eros diam. Ut enim nunc, placerat vitae augue vel, rutrum dapibus felis. Nulla et ultrices ex. In sed arcu eget lectus scelerisque semper. Nullam aliquam luctus ultrices. Morbi finibus nec dolor vitae mattis. Quisque ligula dui, ullamcorper sed blandit et, maximus vel quam. Nunc id eros id sapien tempor feugiat sit amet sed mi. Quisque feugiat hendrerit libero non cursus. Praesent convallis, diam eget ullamcorper bibendum, est tellus blandit velit, vel cursus diam turpis sed nisi.
|
||||
|
||||
Cras dictum tortor ex, id ullamcorper nibh mollis quis. Fusce mollis, massa vel sodales consectetur, lorem mi vehicula erat, id tincidunt lorem libero at augue. Suspendisse vitae enim varius, molestie augue ut, lobortis ipsum. Nam lobortis leo eget velit auctor, ac consequat nisl malesuada. Donec sed dapibus nunc. Curabitur euismod erat a erat viverra vestibulum lacinia quis nisl. Aenean rhoncus suscipit maximus. Aliquam vitae lectus est.
|
||||
|
||||
Sed rhoncus sem sapien, at posuere libero imperdiet eget. Maecenas in egestas quam. Duis non faucibus eros, nec sodales sem. Proin felis urna, dapibus eget ante vitae, porttitor bibendum nunc. Integer nec augue eget diam pulvinar vestibulum. Nulla lobortis libero tellus, eu commodo elit ullamcorper in. Sed semper ultricies turpis ac dignissim. Morbi at ligula non urna mollis interdum vitae sed nisi. Quisque mattis arcu eu nisl placerat ullamcorper. Cras aliquet risus sed hendrerit faucibus. Donec vitae ex quis magna cursus ultricies ut nec urna.
|
||||
|
||||
Integer molestie nulla interdum enim suscipit malesuada. Nullam eget ipsum et elit sagittis imperdiet sed dignissim sem. Fusce vitae tellus ligula. Donec eget mi varius, consequat eros sed, consectetur urna. Suspendisse potenti. Praesent posuere ullamcorper tincidunt. Donec bibendum, magna nec mollis posuere, nisi risus dictum mauris, sed gravida metus sapien vel ipsum. Etiam ultrices nulla tincidunt erat lacinia, sit amet bibendum libero posuere. Vestibulum vehicula lectus dolor, sit amet vehicula arcu ultricies nec. Proin blandit risus diam, vel finibus erat efficitur in. Suspendisse lacinia eros luctus posuere fermentum. Etiam sed lacus aliquam, vulputate est sed, venenatis ex. Aenean at nulla rhoncus, sollicitudin elit quis, auctor tortor. Donec semper, augue lacinia pharetra imperdiet, metus purus bibendum ex, et venenatis enim purus vitae nulla. Duis eu felis porta ligula laoreet viverra.
|
||||
Answer
|
||||
It seems like you've used placeholder text commonly known as "Lorem Ipsum," which is often used in design and publishing to simulate the appearance of written text. If you have any specific questions or need assistance with something related to this text, feel free to ask!
|
||||
what is its purpose?
|
||||
Sources
|
||||
solopress.com favicon
|
||||
typingpal.com favicon
|
||||
View 2 more
|
||||
Answer
|
||||
The purpose of Lorem Ipsum, a commonly used placeholder text in design and publishing, is to create a natural-looking block of text that doesn't distract from the layout. It allows designers to visualize how text will appear in a design without the need for actual content to be written and approved. Lorem Ipsum helps in planning out where the content will sit on a page, focusing on the design rather than the specific content. This practice is particularly useful when the main emphasis is on the visual layout, allowing designers and clients to review templates without being distracted by the actual copy on the page
|
||||
4
|
||||
5
|
||||
.
|
||||
hello
|
||||
`;
|
||||
|
||||
export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
|
||||
const searchParams = useSearchParams();
|
||||
const router = useRouter();
|
||||
|
||||
const [hide, setHide] = useState(false);
|
||||
const [layout, setLayout] = useState<"chat" | "initial">("initial");
|
||||
const [value, setValue] = useState("");
|
||||
const { width } = useViewport();
|
||||
const [isAiLoading, setIsAiLoading] = useState(false);
|
||||
|
||||
const { spaces } = useMemory();
|
||||
|
||||
// Variable to keep track of the chat history in this session
|
||||
const [chatHistory, setChatHistory] = useState<ChatHistory[]>([]);
|
||||
|
||||
const [toBeParsed, setToBeParsed] = useState("");
|
||||
|
||||
const textArea = useRef<HTMLDivElement>(null);
|
||||
const main = useRef<HTMLDivElement>(null);
|
||||
|
||||
const [selectedSpaces, setSelectedSpaces] = useState<number[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
const search = searchParams.get("q");
|
||||
if (search && search.trim().length > 0) {
|
||||
setValue(search);
|
||||
onSend();
|
||||
router.push("/");
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
function onResize() {
|
||||
if (!main.current || !window.visualViewport) return;
|
||||
if (
|
||||
window.visualViewport.height < window.innerHeight + 20 &&
|
||||
window.visualViewport.height > window.innerHeight - 20
|
||||
) {
|
||||
setHide(false);
|
||||
window.scrollTo(0, 0);
|
||||
} else {
|
||||
setHide(true);
|
||||
window.scrollTo(0, document.body.scrollHeight);
|
||||
}
|
||||
}
|
||||
|
||||
window.visualViewport?.addEventListener("resize", onResize);
|
||||
return () => {
|
||||
window.visualViewport?.removeEventListener("resize", onResize);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
// Define a function to try parsing the accumulated data
|
||||
const tryParseAccumulatedData = () => {
|
||||
// Attempt to parse the "toBeParsed" state as JSON
|
||||
try {
|
||||
// Split the accumulated data by the known delimiter "\n\n"
|
||||
const parts = toBeParsed.split("\n\n");
|
||||
let remainingData = "";
|
||||
|
||||
// Process each part to extract JSON objects
|
||||
parts.forEach((part, index) => {
|
||||
try {
|
||||
const parsedPart = JSON.parse(part.replace("data: ", "")); // Try to parse the part as JSON
|
||||
|
||||
// If the part is the last one and couldn't be parsed, keep it to accumulate more data
|
||||
if (index === parts.length - 1 && !parsedPart) {
|
||||
remainingData = part;
|
||||
} else if (parsedPart && parsedPart.response) {
|
||||
// Append to chat history in this way:
|
||||
// If the last message was from the model, append to that message
|
||||
// Otherwise, Start a new message from the model and append to that
|
||||
if (chatHistory.length > 0) {
|
||||
setChatHistory((prev: ChatHistory[]) => {
|
||||
const lastMessage = prev[prev.length - 1];
|
||||
const newParts = [
|
||||
...lastMessage.answer.parts,
|
||||
{ text: parsedPart.response },
|
||||
];
|
||||
return [
|
||||
...prev.slice(0, prev.length - 1),
|
||||
{
|
||||
...lastMessage,
|
||||
answer: {
|
||||
parts: newParts,
|
||||
sources: lastMessage.answer.sources,
|
||||
},
|
||||
},
|
||||
];
|
||||
});
|
||||
} else {
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
// If parsing fails and it's not the last part, it's a malformed JSON
|
||||
if (index !== parts.length - 1) {
|
||||
console.error("Malformed JSON part: ", part);
|
||||
} else {
|
||||
// If it's the last part, it may be incomplete, so keep it
|
||||
remainingData = part;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Update the toBeParsed state to only contain the unparsed remainder
|
||||
if (remainingData !== toBeParsed) {
|
||||
setToBeParsed(remainingData);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error parsing accumulated data: ", error);
|
||||
}
|
||||
};
|
||||
|
||||
// Call the parsing function if there's data to be parsed
|
||||
if (toBeParsed) {
|
||||
tryParseAccumulatedData();
|
||||
}
|
||||
}, [toBeParsed]);
|
||||
|
||||
const modifyChatHistory = useCallback((old: ChatHistory[]) => {
|
||||
const final: { role: "user" | "model"; parts: { text: string }[] }[] = [];
|
||||
old.forEach((chat) => {
|
||||
final.push({
|
||||
role: "user",
|
||||
parts: [{ text: chat.question }],
|
||||
});
|
||||
final.push({
|
||||
role: "model",
|
||||
parts: chat.answer.parts.map((part) => ({ text: part.text })),
|
||||
});
|
||||
});
|
||||
|
||||
return final;
|
||||
}, []);
|
||||
|
||||
const getSearchResults = async () => {
|
||||
setIsAiLoading(true);
|
||||
|
||||
const _value = value.trim();
|
||||
setValue("");
|
||||
|
||||
setChatHistory((prev) => [
|
||||
...prev,
|
||||
{
|
||||
question: _value,
|
||||
answer: {
|
||||
parts: [],
|
||||
sources: [],
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
const sourcesResponse = await fetch(
|
||||
`/api/chat?sourcesOnly=true&q=${_value}`,
|
||||
{
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
chatHistory: modifyChatHistory(chatHistory),
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
||||
const sourcesInJson = (await sourcesResponse.json()) as {
|
||||
ids: string[];
|
||||
};
|
||||
|
||||
setIsAiLoading(false);
|
||||
setChatHistory((prev) => {
|
||||
const lastMessage = prev[prev.length - 1];
|
||||
return [
|
||||
...prev.slice(0, prev.length - 1),
|
||||
{
|
||||
...lastMessage,
|
||||
answer: {
|
||||
parts: lastMessage.answer.parts,
|
||||
sources: sourcesInJson.ids ?? [],
|
||||
},
|
||||
},
|
||||
];
|
||||
});
|
||||
|
||||
const actualSelectedSpaces = selectedSpaces.map(
|
||||
(space) => spaces.find((s) => s.id === space)?.title ?? "",
|
||||
);
|
||||
|
||||
const response = await fetch(
|
||||
`/api/chat?q=${_value}&spaces=${actualSelectedSpaces.join(",")}`,
|
||||
{
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
chatHistory: modifyChatHistory(chatHistory),
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
||||
if (response.status !== 200) {
|
||||
setIsAiLoading(false);
|
||||
return;
|
||||
}
|
||||
|
||||
if (response.body) {
|
||||
let reader = response.body?.getReader();
|
||||
let decoder = new TextDecoder("utf-8");
|
||||
let result = "";
|
||||
|
||||
// @ts-ignore
|
||||
reader.read().then(function processText({ done, value }) {
|
||||
if (done) {
|
||||
setIsAiLoading(false);
|
||||
setToBeParsed("");
|
||||
setValue("");
|
||||
|
||||
return;
|
||||
}
|
||||
setToBeParsed((prev) => prev + decoder.decode(value));
|
||||
|
||||
return reader?.read().then(processText);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const onSend = async () => {
|
||||
setLayout("chat");
|
||||
await getSearchResults();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<AnimatePresence mode="wait">
|
||||
{layout === "chat" ? (
|
||||
<Chat
|
||||
key="chat"
|
||||
isLoading={isAiLoading}
|
||||
chatHistory={chatHistory}
|
||||
sidebarOpen={sidebarOpen}
|
||||
askQuestion={onSend}
|
||||
setValue={setValue}
|
||||
value={value}
|
||||
/>
|
||||
) : (
|
||||
<main
|
||||
data-sidebar-open={sidebarOpen}
|
||||
ref={main}
|
||||
className={cn(
|
||||
"sidebar flex w-full flex-col items-end justify-center gap-5 px-5 pt-5 transition-[padding-left,padding-top,padding-right] delay-200 duration-200 md:items-center md:gap-10 md:px-72 [&[data-sidebar-open='true']]:pr-10 [&[data-sidebar-open='true']]:delay-0 md:[&[data-sidebar-open='true']]:pl-[calc(2.5rem+30vw)]",
|
||||
hide ? "" : "main-hidden",
|
||||
)}
|
||||
>
|
||||
<h1 className="text-rgray-11 mt-auto w-full text-center text-3xl md:mt-0">
|
||||
Ask your Second brain
|
||||
</h1>
|
||||
|
||||
<Textarea2
|
||||
ref={textArea}
|
||||
exit={{
|
||||
opacity: 0,
|
||||
y: 50,
|
||||
}}
|
||||
transition={{
|
||||
type: "tween",
|
||||
duration: 0.2,
|
||||
}}
|
||||
textAreaProps={{
|
||||
placeholder: "Ask your SuperMemory...",
|
||||
className:
|
||||
"h-auto overflow-auto md:h-full md:resize-none text-lg py-0 px-2 pt-2 md:py-0 md:p-5 resize-y text-rgray-11 w-full min-h-[1em]",
|
||||
value,
|
||||
autoFocus: true,
|
||||
onChange: (e) => setValue(e.target.value),
|
||||
onKeyDown: (e) => {
|
||||
console.log(e.key, e.ctrlKey, e.metaKey);
|
||||
if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
|
||||
onSend();
|
||||
}
|
||||
},
|
||||
}}
|
||||
>
|
||||
<div className="text-rgray-11/70 flex h-full w-fit items-center justify-center pl-0 md:w-full md:p-2">
|
||||
<FilterCombobox
|
||||
onClose={() => {
|
||||
textArea.current?.querySelector("textarea")?.focus();
|
||||
}}
|
||||
className="hidden md:flex"
|
||||
selectedSpaces={selectedSpaces}
|
||||
setSelectedSpaces={setSelectedSpaces}
|
||||
/>
|
||||
<button
|
||||
onClick={onSend}
|
||||
disabled={value.trim().length < 1}
|
||||
className="text-rgray-11/70 bg-rgray-3 focus-visible:ring-rgray-8 hover:bg-rgray-4 mt-auto flex items-center justify-center rounded-full p-2 ring-2 ring-transparent focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:ml-auto md:mt-0"
|
||||
>
|
||||
<ArrowRight className="h-5 w-5" />
|
||||
</button>
|
||||
</div>
|
||||
</Textarea2>
|
||||
{width <= 768 && <MemoryDrawer hide={hide} />}
|
||||
</main>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export function Chat({
|
||||
sidebarOpen,
|
||||
chatHistory,
|
||||
isLoading = false,
|
||||
askQuestion,
|
||||
setValue,
|
||||
value,
|
||||
}: {
|
||||
sidebarOpen: boolean;
|
||||
isLoading?: boolean;
|
||||
chatHistory: ChatHistory[];
|
||||
askQuestion: () => void;
|
||||
setValue: (value: string) => void;
|
||||
value: string;
|
||||
}) {
|
||||
const textArea = useRef<HTMLDivElement>(null);
|
||||
|
||||
function onValueChange(e: React.ChangeEvent<HTMLTextAreaElement>) {
|
||||
const value = e.target.value;
|
||||
setValue(value);
|
||||
const lines = countLines(e.target);
|
||||
e.target.rows = Math.min(5, lines);
|
||||
}
|
||||
|
||||
return (
|
||||
<main
|
||||
data-sidebar-open={sidebarOpen}
|
||||
className={cn(
|
||||
"sidebar relative flex w-full flex-col items-end gap-5 px-5 pt-5 transition-[padding-left,padding-top,padding-right] delay-200 duration-200 md:items-center md:gap-10 md:px-72 [&[data-sidebar-open='true']]:pr-10 [&[data-sidebar-open='true']]:delay-0 md:[&[data-sidebar-open='true']]:pl-[calc(2.5rem+30vw)]",
|
||||
)}
|
||||
>
|
||||
<div className="scrollbar-none h-screen w-full overflow-y-auto px-5">
|
||||
{chatHistory.map((msg, i) => (
|
||||
<ChatMessage index={i} key={i} isLast={i === chatHistory.length - 1}>
|
||||
<ChatQuestion>{msg.question}</ChatQuestion>
|
||||
<ChatAnswer
|
||||
loading={i === chatHistory.length - 1 ? isLoading : false}
|
||||
sources={msg.answer.sources}
|
||||
>
|
||||
{msg.answer.parts.map((part) => part.text).join(" ")}
|
||||
</ChatAnswer>
|
||||
</ChatMessage>
|
||||
))}
|
||||
</div>
|
||||
<div className="from-rgray-2 via-rgray-2 to-rgray-2/0 absolute bottom-0 left-0 h-[30%] w-full bg-gradient-to-t" />
|
||||
<div
|
||||
data-sidebar-open={sidebarOpen}
|
||||
className="absolute flex w-full items-center justify-center"
|
||||
>
|
||||
<div className="animate-from-top fixed bottom-10 mt-auto flex w-[50%] flex-col items-start justify-center gap-2">
|
||||
<FilterCombobox
|
||||
onClose={() => {
|
||||
textArea.current?.querySelector("textarea")?.focus();
|
||||
}}
|
||||
side="top"
|
||||
align="start"
|
||||
className="bg-[#252525]"
|
||||
// TODO: SPACES FILTER HERE
|
||||
selectedSpaces={[]}
|
||||
setSelectedSpaces={(spaces) => {}}
|
||||
/>
|
||||
<Textarea2
|
||||
ref={textArea}
|
||||
className="bg-rgray-2 h-auto w-full flex-row items-start justify-center overflow-auto px-3 md:items-center md:justify-center"
|
||||
textAreaProps={{
|
||||
placeholder: "Ask your SuperMemory...",
|
||||
className:
|
||||
"overflow-auto h-auto p-3 md:resize-none text-lg w-auto resize-y text-rgray-11 w-full",
|
||||
value,
|
||||
rows: 1,
|
||||
autoFocus: true,
|
||||
onChange: onValueChange,
|
||||
onKeyDown: (e) => {
|
||||
if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
|
||||
askQuestion();
|
||||
}
|
||||
},
|
||||
}}
|
||||
>
|
||||
<div className="text-rgray-11/70 ml-auto mt-auto flex h-full w-min items-center justify-center pb-3 pr-2">
|
||||
<button
|
||||
onClick={askQuestion}
|
||||
disabled={value.trim().length < 1}
|
||||
className="text-rgray-11/70 bg-rgray-3 focus-visible:ring-rgray-8 hover:bg-rgray-4 mt-auto flex items-center justify-center rounded-full p-2 ring-2 ring-transparent transition-[filter] focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
|
||||
>
|
||||
<ArrowUp className="h-5 w-5" />
|
||||
</button>
|
||||
</div>
|
||||
</Textarea2>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
49
apps/web/src/components/MemoryDrawer.tsx
Normal file
49
apps/web/src/components/MemoryDrawer.tsx
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
import { useRef, useState } from "react";
|
||||
import { Drawer, DrawerContent, DrawerOverlay } from "./ui/drawer";
|
||||
import { MemoryIcon } from "@/assets/Memories";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { MemoriesBar } from "./Sidebar/MemoriesBar";
|
||||
|
||||
export interface Props extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
||||
hide?: boolean;
|
||||
}
|
||||
|
||||
export function MemoryDrawer({ className, hide = false, ...props }: Props) {
|
||||
const [activeSnapPoint, setActiveSnapPoint] = useState<
|
||||
number | null | string
|
||||
>(0.1);
|
||||
|
||||
return (
|
||||
<Drawer
|
||||
snapPoints={[0.1, 0.9]}
|
||||
activeSnapPoint={activeSnapPoint}
|
||||
shouldScaleBackground={false}
|
||||
setActiveSnapPoint={setActiveSnapPoint}
|
||||
open={true}
|
||||
dismissible={false}
|
||||
modal={false}
|
||||
>
|
||||
<DrawerContent
|
||||
overlay={false}
|
||||
data-expanded={activeSnapPoint === 0.9}
|
||||
className={cn(
|
||||
"border-rgray-6 DrawerContent data-[expanded=true]:bg-rgray-3 h-full w-screen border transition-[background] focus-visible:outline-none",
|
||||
hide ? "hidden" : "",
|
||||
)}
|
||||
handle={false}
|
||||
>
|
||||
<button
|
||||
onClick={() =>
|
||||
setActiveSnapPoint((prev) => (prev === 0.9 ? 0.1 : 0.9))
|
||||
}
|
||||
className="bg-rgray-4 border-rgray-6 text-rgray-11 absolute left-1/2 top-0 flex w-fit -translate-x-1/2 -translate-y-1/2 items-center justify-center gap-2 rounded-md border px-3 py-2"
|
||||
>
|
||||
<MemoryIcon className="h-7 w-7" />
|
||||
Memories
|
||||
</button>
|
||||
<MemoriesBar />
|
||||
</DrawerContent>
|
||||
<DrawerOverlay className="relative bg-transparent" />
|
||||
</Drawer>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,139 +0,0 @@
|
|||
'use client';
|
||||
|
||||
import { Label } from './ui/label';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { Input } from './ui/input';
|
||||
import { Button } from './ui/button';
|
||||
import SearchResults from './SearchResults';
|
||||
|
||||
function QueryAI() {
|
||||
const [searchResults, setSearchResults] = useState<string[]>([]);
|
||||
const [isAiLoading, setIsAiLoading] = useState(false);
|
||||
|
||||
const [aiResponse, setAIResponse] = useState('');
|
||||
const [input, setInput] = useState('');
|
||||
const [toBeParsed, setToBeParsed] = useState('');
|
||||
|
||||
const handleStreamData = (newChunk: string) => {
|
||||
// Append the new chunk to the existing data to be parsed
|
||||
setToBeParsed((prev) => prev + newChunk);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
// Define a function to try parsing the accumulated data
|
||||
const tryParseAccumulatedData = () => {
|
||||
// Attempt to parse the "toBeParsed" state as JSON
|
||||
try {
|
||||
// Split the accumulated data by the known delimiter "\n\n"
|
||||
const parts = toBeParsed.split('\n\n');
|
||||
let remainingData = '';
|
||||
|
||||
// Process each part to extract JSON objects
|
||||
parts.forEach((part, index) => {
|
||||
try {
|
||||
const parsedPart = JSON.parse(part.replace('data: ', '')); // Try to parse the part as JSON
|
||||
|
||||
// If the part is the last one and couldn't be parsed, keep it to accumulate more data
|
||||
if (index === parts.length - 1 && !parsedPart) {
|
||||
remainingData = part;
|
||||
} else if (parsedPart && parsedPart.response) {
|
||||
// If the part is parsable and has the "response" field, update the AI response state
|
||||
setAIResponse((prev) => prev + parsedPart.response);
|
||||
}
|
||||
} catch (error) {
|
||||
// If parsing fails and it's not the last part, it's a malformed JSON
|
||||
if (index !== parts.length - 1) {
|
||||
console.error('Malformed JSON part: ', part);
|
||||
} else {
|
||||
// If it's the last part, it may be incomplete, so keep it
|
||||
remainingData = part;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Update the toBeParsed state to only contain the unparsed remainder
|
||||
if (remainingData !== toBeParsed) {
|
||||
setToBeParsed(remainingData);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error parsing accumulated data: ', error);
|
||||
}
|
||||
};
|
||||
|
||||
// Call the parsing function if there's data to be parsed
|
||||
if (toBeParsed) {
|
||||
tryParseAccumulatedData();
|
||||
}
|
||||
}, [toBeParsed]);
|
||||
|
||||
const getSearchResults = async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
setIsAiLoading(true);
|
||||
|
||||
const sourcesResponse = await fetch(
|
||||
`/api/query?sourcesOnly=true&q=${input}`,
|
||||
);
|
||||
|
||||
const sourcesInJson = (await sourcesResponse.json()) as {
|
||||
ids: string[];
|
||||
};
|
||||
|
||||
setSearchResults(sourcesInJson.ids);
|
||||
|
||||
const response = await fetch(`/api/query?q=${input}`);
|
||||
|
||||
if (response.status !== 200) {
|
||||
setIsAiLoading(false);
|
||||
return;
|
||||
}
|
||||
|
||||
if (response.body) {
|
||||
let reader = response.body.getReader();
|
||||
let decoder = new TextDecoder('utf-8');
|
||||
let result = '';
|
||||
|
||||
// @ts-ignore
|
||||
reader.read().then(function processText({ done, value }) {
|
||||
if (done) {
|
||||
// setSearchResults(JSON.parse(result.replace('data: ', '')));
|
||||
// setIsAiLoading(false);
|
||||
return;
|
||||
}
|
||||
|
||||
handleStreamData(decoder.decode(value));
|
||||
|
||||
return reader.read().then(processText);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="w-full max-w-2xl mx-auto">
|
||||
<form onSubmit={async (e) => await getSearchResults(e)} className="mt-8">
|
||||
<Label htmlFor="searchInput">Ask your SuperMemory</Label>
|
||||
<div className="flex flex-col md:flex-row md:w-full md:items-center space-y-2 md:space-y-0 md:space-x-2">
|
||||
<Input
|
||||
value={input}
|
||||
onChange={(e) => setInput(e.target.value)}
|
||||
placeholder="Search using AI... ✨"
|
||||
id="searchInput"
|
||||
/>
|
||||
<Button
|
||||
disabled={isAiLoading}
|
||||
className="max-w-min md:w-full"
|
||||
type="submit"
|
||||
variant="default"
|
||||
>
|
||||
Ask AI
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{searchResults && (
|
||||
<SearchResults aiResponse={aiResponse} sources={searchResults} />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default QueryAI;
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
'use client'
|
||||
|
||||
import React from 'react';
|
||||
import { Card, CardContent } from './ui/card';
|
||||
import Markdown from 'react-markdown';
|
||||
import remarkGfm from 'remark-gfm'
|
||||
|
||||
function SearchResults({
|
||||
aiResponse,
|
||||
sources,
|
||||
}: {
|
||||
aiResponse: string;
|
||||
sources: string[];
|
||||
}) {
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
backgroundImage: `linear-gradient(to right, #E5D9F2, #CDC1FF)`,
|
||||
}}
|
||||
className="w-full max-w-2xl mx-auto px-4 py-6 space-y-6 border mt-4 rounded-xl"
|
||||
>
|
||||
<div className="text-start">
|
||||
<div className="text-xl text-black">
|
||||
<Markdown remarkPlugins={[remarkGfm]}>{aiResponse.replace('</s>', '')}</Markdown>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid gap-6">
|
||||
{sources.map((value, index) => (
|
||||
<Card key={index}>
|
||||
<CardContent className="space-y-2">{value}</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default SearchResults;
|
||||
|
|
@ -26,8 +26,7 @@ export default function Sidebar() {
|
|||
description: '',
|
||||
image: 'https://code.visualstudio.com/favicon.ico',
|
||||
baseUrl: 'https://code.visualstudio.com',
|
||||
savedAt: new Date(),
|
||||
space: 'Development',
|
||||
savedAt: new Date()
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
|
|
@ -37,8 +36,7 @@ export default function Sidebar() {
|
|||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
space: 'Development',
|
||||
savedAt: new Date()
|
||||
},
|
||||
];
|
||||
|
||||
|
|
|
|||
298
apps/web/src/components/Sidebar/CategoryItem.tsx
Normal file
298
apps/web/src/components/Sidebar/CategoryItem.tsx
Normal file
|
|
@ -0,0 +1,298 @@
|
|||
'use client';
|
||||
import { cleanUrl } from '@/lib/utils';
|
||||
import { StoredContent } from '@/server/db/schema';
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuTrigger,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
} from '../ui/dropdown-menu';
|
||||
import { Label } from '../ui/label';
|
||||
import {
|
||||
ArrowUpRight,
|
||||
MoreHorizontal,
|
||||
Tags,
|
||||
ChevronDown,
|
||||
Edit3,
|
||||
Trash2,
|
||||
Save,
|
||||
ChevronRight,
|
||||
Plus,
|
||||
Minus,
|
||||
} from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import {
|
||||
Drawer,
|
||||
DrawerContent,
|
||||
DrawerHeader,
|
||||
DrawerTitle,
|
||||
DrawerDescription,
|
||||
DrawerFooter,
|
||||
DrawerClose,
|
||||
} from '../ui/drawer';
|
||||
import { Input } from '../ui/input';
|
||||
import { Textarea } from '../ui/textarea';
|
||||
import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';
|
||||
import {
|
||||
AnimatePresence,
|
||||
motion,
|
||||
Reorder,
|
||||
useMotionValue,
|
||||
} from 'framer-motion';
|
||||
|
||||
const pages: StoredContent[] = [
|
||||
{
|
||||
id: 1,
|
||||
content: '',
|
||||
title: 'Visual Studio Code',
|
||||
url: 'https://code.visualstudio.com',
|
||||
description: '',
|
||||
image: 'https://code.visualstudio.com/favicon.ico',
|
||||
baseUrl: 'https://code.visualstudio.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
content: '',
|
||||
title: "yxshv/vscode: An unofficial remake of vscode's landing page",
|
||||
url: 'https://github.com/yxshv/vscode',
|
||||
description: '',
|
||||
image: 'https://github.com/favicon.ico',
|
||||
baseUrl: 'https://github.com',
|
||||
savedAt: new Date(),
|
||||
},
|
||||
];
|
||||
export const CategoryItem: React.FC<{ item: StoredContent }> = ({ item }) => {
|
||||
const [isExpanded, setIsExpanded] = useState(false);
|
||||
const [isEditDrawerOpen, setIsEditDrawerOpen] = useState(false);
|
||||
|
||||
const [items, setItems] = useState<StoredContent[]>(pages);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="hover:bg-rgray-5 has-[button:focus]:bg-rgray-5 flex w-full items-center rounded-full py-1 pl-3 pr-2 transition [&:hover>button>div>[data-down-icon]]:scale-125 [&:hover>button>div>[data-down-icon]]:opacity-100 [&:hover>button>div>[data-down-icon]]:delay-150 [&:hover>button>div>[data-tags-icon]]:scale-75 [&:hover>button>div>[data-tags-icon]]:opacity-0 [&:hover>button>div>[data-tags-icon]]:delay-0 [&:hover>button]:opacity-100">
|
||||
<button
|
||||
onClick={() => setIsExpanded((prev) => !prev)}
|
||||
className="flex w-full items-center gap-2 focus-visible:outline-none"
|
||||
>
|
||||
<div className="relative h-5 min-w-5">
|
||||
<Tags
|
||||
data-tags-icon
|
||||
className="z-1 h-5 w-5 transition-[transform,opacity] delay-150 duration-150"
|
||||
strokeWidth={1.5}
|
||||
/>
|
||||
<ChevronDown
|
||||
data-down-icon
|
||||
className={`absolute left-1/2 top-1/2 z-[2] h-4 w-4 min-w-4 -translate-x-1/2 -translate-y-1/2 scale-75 opacity-0 transition-[transform,opacity] duration-150 ${isExpanded ? 'rotate-180' : 'rotate-0'}`}
|
||||
strokeWidth={1.5}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<span className="w-full truncate text-nowrap text-left">
|
||||
{item.title ?? 'Untitled website'}
|
||||
</span>
|
||||
</button>
|
||||
<Drawer
|
||||
shouldScaleBackground
|
||||
open={isEditDrawerOpen}
|
||||
onOpenChange={setIsEditDrawerOpen}
|
||||
>
|
||||
<DrawerContent className="pb-10 lg:px-[25vw]">
|
||||
<DrawerHeader className="relative mt-10 px-0">
|
||||
<DrawerTitle className=" flex w-full justify-between">
|
||||
Edit Page Details
|
||||
</DrawerTitle>
|
||||
<DrawerDescription>Change the page details</DrawerDescription>
|
||||
<a
|
||||
target="_blank"
|
||||
href={item.url}
|
||||
className="text-rgray-11/90 bg-rgray-3 text-md absolute right-0 top-0 flex w-min translate-y-1/2 items-center justify-center gap-1 rounded-full px-5 py-1"
|
||||
>
|
||||
<img src={item.image ?? '/brain.png'} className="h-4 w-4" />
|
||||
{cleanUrl(item.url)}
|
||||
</a>
|
||||
</DrawerHeader>
|
||||
|
||||
<div className="mt-5">
|
||||
<Label>Title</Label>
|
||||
<Input
|
||||
className=""
|
||||
required
|
||||
value={item.title ?? ''}
|
||||
placeholder={item.title ?? 'Enter the title for the page'}
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-5">
|
||||
<Label>Additional Context</Label>
|
||||
<Textarea
|
||||
className=""
|
||||
value={item.content ?? ''}
|
||||
placeholder={'Enter additional context for this page'}
|
||||
/>
|
||||
</div>
|
||||
<DrawerFooter className="flex flex-row-reverse items-center justify-end px-0 pt-5">
|
||||
<DrawerClose className="flex items-center justify-center rounded-md px-3 py-2 ring-2 ring-transparent transition hover:bg-blue-100 hover:text-blue-400 focus-visible:bg-blue-100 focus-visible:text-blue-400 focus-visible:outline-none focus-visible:ring-blue-200 dark:hover:bg-blue-100/10 dark:focus-visible:bg-blue-100/10 dark:focus-visible:ring-blue-200/30">
|
||||
<Save className="mr-2 h-4 w-4 " strokeWidth={1.5} />
|
||||
Save
|
||||
</DrawerClose>
|
||||
<DrawerClose className="hover:bg-rgray-3 focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 flex items-center justify-center rounded-md px-3 py-2 ring-2 ring-transparent transition focus-visible:outline-none">
|
||||
Cancel
|
||||
</DrawerClose>
|
||||
<DrawerClose className="mr-auto flex items-center justify-center rounded-md bg-red-100 px-3 py-2 text-red-400 ring-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-red-200 dark:bg-red-100/10 dark:focus-visible:ring-red-200/30">
|
||||
<Trash2 className="mr-2 h-4 w-4 " strokeWidth={1.5} />
|
||||
Delete
|
||||
</DrawerClose>
|
||||
</DrawerFooter>
|
||||
</DrawerContent>
|
||||
</Drawer>
|
||||
</div>
|
||||
<AnimatePresence>
|
||||
{isExpanded && (
|
||||
<Reorder.Group
|
||||
axis="y"
|
||||
values={items}
|
||||
onReorder={setItems}
|
||||
as="div"
|
||||
initial={{ height: 0 }}
|
||||
animate={{ height: 'auto' }}
|
||||
exit={{
|
||||
height: 0,
|
||||
transition: {},
|
||||
}}
|
||||
layoutScroll
|
||||
className="flex max-h-32 w-full flex-col items-center overflow-y-auto pl-7"
|
||||
>
|
||||
<AnimatePresence>
|
||||
{items.map((item, i) => (
|
||||
<CategoryPage
|
||||
key={item.id}
|
||||
index={i}
|
||||
item={item}
|
||||
onRemove={() =>
|
||||
setItems((prev) => prev.filter((_, index) => i !== index))
|
||||
}
|
||||
/>
|
||||
))}
|
||||
</AnimatePresence>
|
||||
</Reorder.Group>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export const CategoryPage: React.FC<{
|
||||
item: StoredContent;
|
||||
index: number;
|
||||
onRemove?: () => void;
|
||||
}> = ({ item, onRemove, index }) => {
|
||||
return (
|
||||
<Reorder.Item
|
||||
value={item}
|
||||
as="div"
|
||||
key={index}
|
||||
exit={{ opacity: 0, scale: 0.8 }}
|
||||
dragListener={false}
|
||||
className="hover:bg-rgray-5 has-[a:focus]:bg-rgray-5 flex w-full items-center rounded-full py-1 pl-3 pr-2 transition [&:hover>a>div>[data-icon]]:scale-125 [&:hover>a>div>[data-icon]]:opacity-100 [&:hover>a>div>[data-icon]]:delay-150 [&:hover>a>div>img]:scale-75 [&:hover>a>div>img]:opacity-0 [&:hover>a>div>img]:delay-0 [&:hover>button]:opacity-100"
|
||||
>
|
||||
<a
|
||||
href={item.url}
|
||||
target="_blank"
|
||||
className="flex w-[90%] items-center gap-2 focus-visible:outline-none"
|
||||
>
|
||||
<div className="relative h-4 min-w-4">
|
||||
<img
|
||||
src={item.image ?? '/brain.png'}
|
||||
alt={item.title ?? 'Untitiled website'}
|
||||
className="z-1 h-4 w-4 transition-[transform,opacity] delay-150 duration-150"
|
||||
/>
|
||||
<ArrowUpRight
|
||||
data-icon
|
||||
className="absolute left-1/2 top-1/2 z-[2] h-4 w-4 min-w-4 -translate-x-1/2 -translate-y-1/2 scale-75 opacity-0 transition-[transform,opacity] duration-150"
|
||||
strokeWidth={1.5}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<span className="w-full truncate text-nowrap">
|
||||
{item.title ?? 'Untitled website'}
|
||||
</span>
|
||||
</a>
|
||||
<button
|
||||
onClick={() => onRemove?.()}
|
||||
className="ml-auto w-4 min-w-4 rounded-[0.15rem] opacity-0 focus-visible:opacity-100 focus-visible:outline-none"
|
||||
>
|
||||
<Minus className="h-4 w-4 min-w-4" />
|
||||
</button>
|
||||
</Reorder.Item>
|
||||
);
|
||||
};
|
||||
147
apps/web/src/components/Sidebar/FilterCombobox.tsx
Normal file
147
apps/web/src/components/Sidebar/FilterCombobox.tsx
Normal file
|
|
@ -0,0 +1,147 @@
|
|||
'use client';
|
||||
|
||||
import * as React from 'react';
|
||||
import { Check, ChevronsUpDown } from 'lucide-react';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import {
|
||||
Command,
|
||||
CommandEmpty,
|
||||
CommandGroup,
|
||||
CommandInput,
|
||||
CommandItem,
|
||||
CommandList,
|
||||
} from '@/components/ui/command';
|
||||
import {
|
||||
Popover,
|
||||
PopoverContent,
|
||||
PopoverTrigger,
|
||||
} from '@/components/ui/popover';
|
||||
import { SpaceIcon } from '@/assets/Memories';
|
||||
import { AnimatePresence, LayoutGroup, motion } from 'framer-motion';
|
||||
import { useMemory } from '@/contexts/MemoryContext';
|
||||
|
||||
export interface Props extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
||||
side?: 'top' | 'bottom';
|
||||
align?: 'end' | 'start' | 'center';
|
||||
onClose?: () => void;
|
||||
selectedSpaces: number[];
|
||||
setSelectedSpaces: (spaces: number[] | ((prev: number[]) => number[])) => void;
|
||||
}
|
||||
|
||||
export function FilterCombobox({
|
||||
className,
|
||||
side = 'bottom',
|
||||
align = 'center',
|
||||
onClose,
|
||||
selectedSpaces,
|
||||
setSelectedSpaces,
|
||||
...props
|
||||
}: Props) {
|
||||
const { spaces, addSpace } = useMemory();
|
||||
|
||||
const [open, setOpen] = React.useState(false);
|
||||
|
||||
const sortedSpaces = spaces.sort(({ id: a }, { id: b }) =>
|
||||
selectedSpaces.includes(a) && !selectedSpaces.includes(b)
|
||||
? -1
|
||||
: selectedSpaces.includes(b) && !selectedSpaces.includes(a)
|
||||
? 1
|
||||
: 0,
|
||||
);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (!open) {
|
||||
onClose?.();
|
||||
}
|
||||
}, [open]);
|
||||
|
||||
return (
|
||||
<AnimatePresence mode="popLayout">
|
||||
<LayoutGroup>
|
||||
<Popover open={open} onOpenChange={setOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
<button
|
||||
data-state-on={open}
|
||||
className={cn(
|
||||
'text-rgray-11/70 on:bg-rgray-3 focus-visible:ring-rgray-8 hover:bg-rgray-3 relative flex items-center justify-center gap-1 rounded-md px-3 py-1.5 ring-2 ring-transparent focus-visible:outline-none',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<SpaceIcon className="mr-1 h-5 w-5" />
|
||||
Filter
|
||||
<ChevronsUpDown className="h-4 w-4" />
|
||||
<div
|
||||
data-state-on={selectedSpaces.length > 0}
|
||||
className="on:flex text-rgray-11 border-rgray-6 bg-rgray-2 absolute left-0 top-0 hidden aspect-[1] h-4 w-4 -translate-x-1/3 -translate-y-1/3 items-center justify-center rounded-full border text-center text-[9px]"
|
||||
>
|
||||
{selectedSpaces.length}
|
||||
</div>
|
||||
</button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent
|
||||
onCloseAutoFocus={(e) => e.preventDefault()}
|
||||
align={align}
|
||||
side={side}
|
||||
className="w-[200px] p-0"
|
||||
>
|
||||
<Command
|
||||
filter={(val, search) =>
|
||||
spaces
|
||||
.find((s) => s.id.toString() === val)
|
||||
?.title.toLowerCase()
|
||||
.includes(search.toLowerCase().trim())
|
||||
? 1
|
||||
: 0
|
||||
}
|
||||
>
|
||||
<CommandInput placeholder="Filter spaces..." />
|
||||
<CommandList asChild>
|
||||
<motion.div layoutScroll>
|
||||
<CommandEmpty>Nothing found</CommandEmpty>
|
||||
<CommandGroup>
|
||||
{sortedSpaces.map((space) => (
|
||||
<CommandItem
|
||||
key={space.id}
|
||||
value={space.id.toString()}
|
||||
onSelect={(val) => {
|
||||
setSelectedSpaces((prev: number[]) =>
|
||||
prev.includes(parseInt(val))
|
||||
? prev.filter((v) => v !== parseInt(val))
|
||||
: [...prev, parseInt(val)],
|
||||
);
|
||||
}}
|
||||
asChild
|
||||
>
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1, transition: { delay: 0.05 } }}
|
||||
transition={{ duration: 0.15 }}
|
||||
layout
|
||||
layoutId={`space-combobox-${space.id}`}
|
||||
className="text-rgray-11"
|
||||
>
|
||||
<SpaceIcon className="mr-2 h-4 w-4" />
|
||||
{space.title}
|
||||
{selectedSpaces.includes(space.id)}
|
||||
<Check
|
||||
data-state-on={selectedSpaces.includes(space.id)}
|
||||
className={cn(
|
||||
'on:opacity-100 ml-auto h-4 w-4 opacity-0',
|
||||
)}
|
||||
/>
|
||||
</motion.div>
|
||||
</CommandItem>
|
||||
))}
|
||||
</CommandGroup>
|
||||
</motion.div>
|
||||
</CommandList>
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
</LayoutGroup>
|
||||
</AnimatePresence>
|
||||
);
|
||||
}
|
||||
363
apps/web/src/components/Sidebar/MemoriesBar.tsx
Normal file
363
apps/web/src/components/Sidebar/MemoriesBar.tsx
Normal file
|
|
@ -0,0 +1,363 @@
|
|||
import { useAutoAnimate } from "@formkit/auto-animate/react";
|
||||
import {
|
||||
MemoryWithImage,
|
||||
MemoryWithImages3,
|
||||
MemoryWithImages2,
|
||||
} from "@/assets/MemoryWithImages";
|
||||
import { type CollectedSpaces } from "../../../types/memory";
|
||||
import { Input, InputWithIcon } from "../ui/input";
|
||||
import {
|
||||
ArrowUpRight,
|
||||
Edit3,
|
||||
MoreHorizontal,
|
||||
Plus,
|
||||
Search,
|
||||
Sparkles,
|
||||
Text,
|
||||
Trash2,
|
||||
} from "lucide-react";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuTrigger,
|
||||
} from "../ui/dropdown-menu";
|
||||
import { useState } from "react";
|
||||
import { Variant, useAnimate, motion } from "framer-motion";
|
||||
import { useMemory } from "@/contexts/MemoryContext";
|
||||
import { SpaceIcon } from "@/assets/Memories";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogTitle,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogFooter,
|
||||
DialogClose,
|
||||
} from "../ui/dialog";
|
||||
import { Label } from "../ui/label";
|
||||
import useViewport from "@/hooks/useViewport";
|
||||
import useTouchHold from "@/hooks/useTouchHold";
|
||||
|
||||
export function MemoriesBar() {
|
||||
const [parent, enableAnimations] = useAutoAnimate();
|
||||
const { spaces, deleteSpace } = useMemory();
|
||||
|
||||
const [isDropdownOpen, setIsDropdownOpen] = useState(false);
|
||||
const [addMemoryState, setAddMemoryState] = useState<
|
||||
"page" | "note" | "space" | null
|
||||
>(null);
|
||||
|
||||
return (
|
||||
<div className="text-rgray-11 flex w-full flex-col items-start py-8 text-left">
|
||||
<div className="w-full px-8">
|
||||
<h1 className="w-full text-2xl">Your Memories</h1>
|
||||
<InputWithIcon
|
||||
placeholder="Search"
|
||||
icon={<Search className="text-rgray-11 h-5 w-5 opacity-50" />}
|
||||
className="bg-rgray-4 mt-2 w-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-2 flex w-full px-8">
|
||||
<DropdownMenu open={isDropdownOpen} onOpenChange={setIsDropdownOpen}>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<button className="focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 hover:bg-rgray-4 ml-auto flex items-center justify-center rounded-md px-3 py-2 transition focus-visible:outline-none focus-visible:ring-2">
|
||||
<Plus className="mr-2 h-5 w-5" />
|
||||
Add
|
||||
</button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuItem
|
||||
onClick={() => {
|
||||
setIsDropdownOpen(false);
|
||||
setAddMemoryState("page");
|
||||
}}
|
||||
>
|
||||
<Sparkles className="mr-2 h-4 w-4" />
|
||||
Page to Memory
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem>
|
||||
<Text className="mr-2 h-4 w-4" />
|
||||
Note
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem>
|
||||
<SpaceIcon className="mr-2 h-4 w-4" />
|
||||
Space
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</div>
|
||||
<AddMemoryModal
|
||||
state={addMemoryState}
|
||||
onStateChange={setAddMemoryState}
|
||||
/>
|
||||
<div
|
||||
ref={parent}
|
||||
className="grid w-full grid-flow-row grid-cols-3 gap-1 px-2 py-5"
|
||||
>
|
||||
{spaces.map((space) => (
|
||||
<SpaceItem
|
||||
onDelete={() => deleteSpace(space.id)}
|
||||
key={space.id}
|
||||
{...space}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const SpaceExitVariant: Variant = {
|
||||
opacity: 0,
|
||||
scale: 0,
|
||||
borderRadius: "50%",
|
||||
background: "var(--gray-1)",
|
||||
transition: {
|
||||
duration: 0.2,
|
||||
},
|
||||
};
|
||||
|
||||
export function SpaceItem({
|
||||
title,
|
||||
content,
|
||||
id,
|
||||
onDelete,
|
||||
}: CollectedSpaces & { onDelete: () => void }) {
|
||||
const [itemRef, animateItem] = useAnimate();
|
||||
const { width } = useViewport();
|
||||
|
||||
const [moreDropdownOpen, setMoreDropdownOpen] = useState(false);
|
||||
|
||||
const touchEventProps = useTouchHold({
|
||||
onHold() {
|
||||
setMoreDropdownOpen(true);
|
||||
},
|
||||
});
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
ref={itemRef}
|
||||
{...touchEventProps}
|
||||
className="hover:bg-rgray-2 has-[[data-state='true']]:bg-rgray-2 has-[[data-space-text]:focus-visible]:bg-rgray-2 has-[[data-space-text]:focus-visible]:ring-rgray-7 [&:has-[[data-space-text]:focus-visible]>[data-more-button]]:opacity-100 relative flex select-none flex-col-reverse items-center justify-center rounded-md p-2 pb-4 text-center font-normal ring-transparent transition has-[[data-space-text]:focus-visible]:outline-none has-[[data-space-text]:focus-visible]:ring-2 md:has-[[data-state='true']]:bg-transparent [&:hover>[data-more-button]]:opacity-100"
|
||||
>
|
||||
<button data-space-text className="focus-visible:outline-none">
|
||||
{title}
|
||||
</button>
|
||||
<SpaceMoreButton
|
||||
isOpen={moreDropdownOpen}
|
||||
setIsOpen={setMoreDropdownOpen}
|
||||
onDelete={() => {
|
||||
if (!itemRef.current || width < 768) {
|
||||
onDelete();
|
||||
return;
|
||||
}
|
||||
const trash = document.querySelector("#trash")! as HTMLDivElement;
|
||||
const trashBin = document.querySelector("#trash-button")!;
|
||||
const trashRect = trashBin.getBoundingClientRect();
|
||||
const scopeRect = itemRef.current.getBoundingClientRect();
|
||||
const el = document.createElement("div");
|
||||
el.style.position = "fixed";
|
||||
el.style.top = "0";
|
||||
el.style.left = "0";
|
||||
el.style.width = "15px";
|
||||
el.style.height = "15px";
|
||||
el.style.backgroundColor = "var(--gray-7)";
|
||||
el.style.zIndex = "60";
|
||||
el.style.borderRadius = "50%";
|
||||
el.style.transform = "scale(5)";
|
||||
el.style.opacity = "0";
|
||||
trash.dataset["open"] = "true";
|
||||
const initial = {
|
||||
x: scopeRect.left + scopeRect.width / 2,
|
||||
y: scopeRect.top + scopeRect.height / 2,
|
||||
};
|
||||
const delta = {
|
||||
x:
|
||||
trashRect.left +
|
||||
trashRect.width / 2 -
|
||||
scopeRect.left +
|
||||
scopeRect.width / 2,
|
||||
y:
|
||||
trashRect.top +
|
||||
trashRect.height / 4 -
|
||||
scopeRect.top +
|
||||
scopeRect.height / 2,
|
||||
};
|
||||
const end = {
|
||||
x: trashRect.left + trashRect.width / 2,
|
||||
y: trashRect.top + trashRect.height / 4,
|
||||
};
|
||||
el.style.offsetPath = `path('M ${initial.x} ${initial.y} Q ${delta.x * 0.01} ${delta.y * 0.01} ${end.x} ${end.y}`;
|
||||
animateItem(itemRef.current, SpaceExitVariant, {
|
||||
duration: 0.2,
|
||||
}).then(() => {
|
||||
itemRef.current.style.scale = "0";
|
||||
onDelete();
|
||||
});
|
||||
document.body.appendChild(el);
|
||||
el.animate(
|
||||
{
|
||||
transform: ["scale(5)", "scale(1)"],
|
||||
opacity: [0, 0.3, 1],
|
||||
},
|
||||
{
|
||||
duration: 200,
|
||||
easing: "cubic-bezier(0.64, 0.57, 0.67, 1.53)",
|
||||
fill: "forwards",
|
||||
},
|
||||
);
|
||||
el.animate(
|
||||
{
|
||||
offsetDistance: ["0%", "100%"],
|
||||
},
|
||||
{
|
||||
duration: 2000,
|
||||
easing: "cubic-bezier(0.64, 0.57, 0.67, 1.53)",
|
||||
fill: "forwards",
|
||||
delay: 200,
|
||||
},
|
||||
).onfinish = () => {
|
||||
el.animate(
|
||||
{ transform: "scale(0)", opacity: 0 },
|
||||
{ duration: 200, fill: "forwards" },
|
||||
).onfinish = () => {
|
||||
el.remove();
|
||||
};
|
||||
};
|
||||
}}
|
||||
/>
|
||||
{content.length > 2 ? (
|
||||
<MemoryWithImages3
|
||||
className="h-24 w-24"
|
||||
id={id.toString()}
|
||||
images={content.map((c) => c.image).reverse() as string[]}
|
||||
/>
|
||||
) : content.length === 1 ? (
|
||||
<MemoryWithImage
|
||||
className="h-24 w-24"
|
||||
id={id.toString()}
|
||||
image={content[0].image!}
|
||||
/>
|
||||
) : (
|
||||
<MemoryWithImages2
|
||||
className="h-24 w-24"
|
||||
id={id.toString()}
|
||||
images={content.map((c) => c.image).reverse() as string[]}
|
||||
/>
|
||||
)}
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
|
||||
export function SpaceMoreButton({
|
||||
onDelete,
|
||||
isOpen,
|
||||
setIsOpen,
|
||||
}: {
|
||||
onDelete?: () => void;
|
||||
isOpen?: boolean;
|
||||
setIsOpen?: (open: boolean) => void;
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<DropdownMenu open={isOpen} onOpenChange={setIsOpen}>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<button
|
||||
data-more-button
|
||||
className="hover:bg-rgray-3 focus-visible:bg-rgray-3 focus-visible:ring-rgray-7 absolute right-2 top-2 scale-0 rounded-md p-1 opacity-0 ring-transparent transition focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 md:block md:scale-100 md:bg-transparent"
|
||||
>
|
||||
<MoreHorizontal className="text-rgray-11 h-5 w-5" />
|
||||
</button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="start">
|
||||
<DropdownMenuItem>
|
||||
<ArrowUpRight
|
||||
className="mr-2 h-4 w-4 scale-125"
|
||||
strokeWidth={1.5}
|
||||
/>
|
||||
Open
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem onClick={() => {}}>
|
||||
<Edit3 className="mr-2 h-4 w-4" strokeWidth={1.5} />
|
||||
Edit
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem
|
||||
onClick={onDelete}
|
||||
className="focus:bg-red-100 focus:text-red-400 dark:focus:bg-red-100/10"
|
||||
>
|
||||
<Trash2 className="mr-2 h-4 w-4" strokeWidth={1.5} />
|
||||
Move to Trash
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export function AddMemoryModal({
|
||||
state,
|
||||
onStateChange,
|
||||
}: {
|
||||
state: "page" | "note" | "space" | null;
|
||||
onStateChange: (state: "page" | "note" | "space" | null) => void;
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<Dialog
|
||||
open={state === "page"}
|
||||
onOpenChange={(open) => onStateChange(open ? "page" : null)}
|
||||
>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Add a web page to memory</DialogTitle>
|
||||
<DialogDescription>
|
||||
This will take you the web page you are trying to add to memory,
|
||||
where the extension will save the page to memory
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<Label className="mt-5">URL</Label>
|
||||
<Input
|
||||
autoFocus
|
||||
placeholder="Enter the URL of the page"
|
||||
type="url"
|
||||
className="bg-rgray-4 mt-2 w-full"
|
||||
/>
|
||||
<DialogFooter>
|
||||
<DialogClose className="bg-rgray-4 hover:bg-rgray-5 focus-visible:bg-rgray-5 focus-visible:ring-rgray-7 rounded-md px-4 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2">
|
||||
Add
|
||||
</DialogClose>
|
||||
<DialogClose className="hover:bg-rgray-4 focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 rounded-md px-3 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2">
|
||||
Cancel
|
||||
</DialogClose>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
<Dialog open={state === "note"}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Add a web page to memory</DialogTitle>
|
||||
<DialogDescription>
|
||||
This will take you the web page you are trying to add to memory,
|
||||
where the extension will save the page to memory
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<Label className="mt-5">URL</Label>
|
||||
<Input
|
||||
autoFocus
|
||||
placeholder="Enter the URL of the page"
|
||||
type="url"
|
||||
className="bg-rgray-4 mt-2 w-full"
|
||||
/>
|
||||
<DialogFooter>
|
||||
<DialogClose className="bg-rgray-4 hover:bg-rgray-5 focus-visible:bg-rgray-5 focus-visible:ring-rgray-7 rounded-md px-4 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2">
|
||||
Add
|
||||
</DialogClose>
|
||||
<DialogClose className="hover:bg-rgray-4 focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 rounded-md px-3 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2">
|
||||
Cancel
|
||||
</DialogClose>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
}
|
||||
178
apps/web/src/components/Sidebar/index.tsx
Normal file
178
apps/web/src/components/Sidebar/index.tsx
Normal file
|
|
@ -0,0 +1,178 @@
|
|||
'use client';
|
||||
import { MemoryIcon } from '../../assets/Memories';
|
||||
import { Trash2, User2 } from 'lucide-react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { MemoriesBar } from './MemoriesBar';
|
||||
import { AnimatePresence, motion } from 'framer-motion';
|
||||
import { Bin } from '@/assets/Bin';
|
||||
import { Avatar, AvatarFallback, AvatarImage } from '@radix-ui/react-avatar';
|
||||
import { useSession } from 'next-auth/react';
|
||||
|
||||
export type MenuItem = {
|
||||
icon: React.ReactNode | React.ReactNode[];
|
||||
label: string;
|
||||
content?: React.ReactNode;
|
||||
};
|
||||
|
||||
export default function Sidebar({
|
||||
selectChange,
|
||||
}: {
|
||||
selectChange?: (selectedItem: string | null) => void;
|
||||
}) {
|
||||
const { data: session } = useSession();
|
||||
const menuItemsTop: Array<MenuItem> = [
|
||||
{
|
||||
icon: <MemoryIcon className="h-10 w-10" />,
|
||||
label: 'Memories',
|
||||
content: <MemoriesBar />,
|
||||
},
|
||||
];
|
||||
|
||||
const menuItemsBottom: Array<MenuItem> = [
|
||||
{
|
||||
icon: <Trash2 strokeWidth={1.3} className="h-6 w-6" />,
|
||||
label: 'Trash',
|
||||
},
|
||||
{
|
||||
icon: (
|
||||
<div>
|
||||
<Avatar>
|
||||
{session?.user?.image ? (
|
||||
<AvatarImage
|
||||
className="h-6 w-6 rounded-full"
|
||||
src={session?.user?.image}
|
||||
alt="user pfp"
|
||||
/>
|
||||
) : (
|
||||
<User2 strokeWidth={1.3} className="h-6 w-6" />
|
||||
)}
|
||||
<AvatarFallback>
|
||||
{session?.user?.name?.split(' ').map((n) => n[0])}{' '}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
</div>
|
||||
),
|
||||
label: 'Profile',
|
||||
},
|
||||
];
|
||||
|
||||
const menuItems = [...menuItemsTop, ...menuItemsBottom];
|
||||
const [selectedItem, setSelectedItem] = useState<string | null>(null);
|
||||
|
||||
const Subbar = menuItems.find((i) => i.label === selectedItem)?.content ?? (
|
||||
<></>
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
void selectChange?.(selectedItem);
|
||||
}, [selectedItem]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="relative hidden h-screen max-h-screen w-max flex-col items-center text-sm font-light md:flex">
|
||||
<div className="bg-rgray-2 border-r-rgray-6 relative z-[50] flex h-full w-full flex-col items-center justify-center border-r px-2 py-5 ">
|
||||
<MenuItem
|
||||
item={{
|
||||
label: 'Memories',
|
||||
icon: <MemoryIcon className="h-10 w-10" />,
|
||||
content: <MemoriesBar />,
|
||||
}}
|
||||
selectedItem={selectedItem}
|
||||
setSelectedItem={setSelectedItem}
|
||||
/>
|
||||
|
||||
<div className="mt-auto" />
|
||||
|
||||
<MenuItem
|
||||
item={{
|
||||
label: 'Trash',
|
||||
icon: <Bin id="trash" className="z-[300] h-7 w-7" />,
|
||||
}}
|
||||
selectedItem={selectedItem}
|
||||
id="trash-button"
|
||||
setSelectedItem={setSelectedItem}
|
||||
/>
|
||||
<MenuItem
|
||||
item={{
|
||||
label: 'Profile',
|
||||
icon: (
|
||||
<div className="mb-2">
|
||||
<Avatar>
|
||||
{session?.user?.image ? (
|
||||
<AvatarImage
|
||||
className="h-6 w-6 rounded-full"
|
||||
src={session?.user?.image}
|
||||
alt="@shadcn"
|
||||
/>
|
||||
) : (
|
||||
<User2 strokeWidth={1.3} className="h-6 w-6" />
|
||||
)}
|
||||
<AvatarFallback>
|
||||
{session?.user?.name?.split(' ').map((n) => n[0])}{' '}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
</div>
|
||||
),
|
||||
}}
|
||||
selectedItem={selectedItem}
|
||||
setSelectedItem={setSelectedItem}
|
||||
/>
|
||||
</div>
|
||||
<AnimatePresence>
|
||||
{selectedItem && <SubSidebar>{Subbar}</SubSidebar>}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const MenuItem = ({
|
||||
item: { icon, label },
|
||||
selectedItem,
|
||||
setSelectedItem,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLButtonElement> & {
|
||||
item: MenuItem;
|
||||
selectedItem: string | null;
|
||||
setSelectedItem: React.Dispatch<React.SetStateAction<string | null>>;
|
||||
}) => (
|
||||
<button
|
||||
data-state-on={selectedItem === label}
|
||||
onClick={() => setSelectedItem((prev) => (prev === label ? null : label))}
|
||||
className="on:opacity-100 on:bg-rgray-4 focus-visible:ring-rgray-7 relative z-[100] flex w-full flex-col items-center justify-center rounded-md px-3 py-3 opacity-80 ring-2 ring-transparent transition hover:opacity-100 focus-visible:opacity-100 focus-visible:outline-none"
|
||||
{...props}
|
||||
>
|
||||
{icon}
|
||||
<span className="">{label}</span>
|
||||
</button>
|
||||
);
|
||||
|
||||
export function SubSidebar({ children }: { children?: React.ReactNode }) {
|
||||
return (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: '-100%' }}
|
||||
animate={{ opacity: 1, x: 0 }}
|
||||
exit={{
|
||||
opacity: 0,
|
||||
x: '-100%',
|
||||
transition: { delay: 0.2 },
|
||||
}}
|
||||
transition={{
|
||||
duration: 0.2,
|
||||
}}
|
||||
className="bg-rgray-3 border-r-rgray-6 absolute left-[100%] top-0 z-[10] hidden h-screen w-[30vw] items-start justify-center overflow-x-hidden border-r font-light md:flex"
|
||||
>
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
exit={{ opacity: 0, transition: { delay: 0 } }}
|
||||
transition={{
|
||||
delay: 0.2,
|
||||
}}
|
||||
className="z-[10] flex h-full w-full min-w-full flex-col items-center opacity-0"
|
||||
>
|
||||
{children}
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
155
apps/web/src/components/ui/command.tsx
Normal file
155
apps/web/src/components/ui/command.tsx
Normal file
|
|
@ -0,0 +1,155 @@
|
|||
"use client";
|
||||
|
||||
import * as React from "react";
|
||||
import { type DialogProps } from "@radix-ui/react-dialog";
|
||||
import { Command as CommandPrimitive } from "cmdk";
|
||||
import { Search } from "lucide-react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { Dialog, DialogContent } from "@/components/ui/dialog";
|
||||
|
||||
const Command = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<CommandPrimitive
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"bg-rgray-3 text-rgray-11 flex h-full w-full flex-col overflow-hidden rounded-md focus-visible:outline-none [&>[cmdk-list-sizer]]:max-h-[250px] [&>[cmdk-list-sizer]]:overflow-y-scroll",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
Command.displayName = CommandPrimitive.displayName;
|
||||
|
||||
interface CommandDialogProps extends DialogProps {}
|
||||
|
||||
const CommandDialog = ({ children, ...props }: CommandDialogProps) => {
|
||||
return (
|
||||
<Dialog {...props}>
|
||||
<DialogContent className="overflow-hidden p-0 shadow-lg">
|
||||
<Command className="[&_[cmdk-group-heading]]:text-rgray-11 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
|
||||
{children}
|
||||
</Command>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
const CommandInput = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive.Input>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<div
|
||||
className="border-rgray-6 flex items-center border-b px-3"
|
||||
cmdk-input-wrapper=""
|
||||
>
|
||||
<Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
|
||||
<CommandPrimitive.Input
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"placeholder:text-rgray-11/50 flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
</div>
|
||||
));
|
||||
|
||||
CommandInput.displayName = CommandPrimitive.Input.displayName;
|
||||
|
||||
const CommandList = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive.List>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<CommandPrimitive.List
|
||||
ref={ref}
|
||||
className={cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
|
||||
CommandList.displayName = CommandPrimitive.List.displayName;
|
||||
|
||||
const CommandEmpty = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive.Empty>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>
|
||||
>((props, ref) => (
|
||||
<CommandPrimitive.Empty
|
||||
ref={ref}
|
||||
className="py-6 text-center text-sm"
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
|
||||
CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
|
||||
|
||||
const CommandGroup = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive.Group>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<CommandPrimitive.Group
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"text-rgray-12 [&_[cmdk-group-heading]]:text-rgray-11 overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
|
||||
CommandGroup.displayName = CommandPrimitive.Group.displayName;
|
||||
|
||||
const CommandSeparator = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive.Separator>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<CommandPrimitive.Separator
|
||||
ref={ref}
|
||||
className={cn("bg-rgray-3 -mx-1 h-px", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
|
||||
|
||||
const CommandItem = React.forwardRef<
|
||||
React.ElementRef<typeof CommandPrimitive.Item>,
|
||||
React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<CommandPrimitive.Item
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"aria-selected:bg-rgray-5 aria-selected:text-rgray-12 relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm opacity-70 outline-none data-[disabled='true']:pointer-events-none data-[disabled='true']:opacity-50",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
|
||||
CommandItem.displayName = CommandPrimitive.Item.displayName;
|
||||
|
||||
const CommandShortcut = ({
|
||||
className,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLSpanElement>) => {
|
||||
return (
|
||||
<span
|
||||
className={cn("text-gray-11 ml-auto text-xs tracking-widest", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
};
|
||||
CommandShortcut.displayName = "CommandShortcut";
|
||||
|
||||
export {
|
||||
Command,
|
||||
CommandDialog,
|
||||
CommandInput,
|
||||
CommandList,
|
||||
CommandEmpty,
|
||||
CommandGroup,
|
||||
CommandItem,
|
||||
CommandShortcut,
|
||||
CommandSeparator,
|
||||
};
|
||||
122
apps/web/src/components/ui/dialog.tsx
Normal file
122
apps/web/src/components/ui/dialog.tsx
Normal file
|
|
@ -0,0 +1,122 @@
|
|||
"use client";
|
||||
|
||||
import * as React from "react";
|
||||
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
||||
import { X } from "lucide-react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const Dialog = DialogPrimitive.Root;
|
||||
|
||||
const DialogTrigger = DialogPrimitive.Trigger;
|
||||
|
||||
const DialogPortal = DialogPrimitive.Portal;
|
||||
|
||||
const DialogClose = DialogPrimitive.Close;
|
||||
|
||||
const DialogOverlay = React.forwardRef<
|
||||
React.ElementRef<typeof DialogPrimitive.Overlay>,
|
||||
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DialogPrimitive.Overlay
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
|
||||
|
||||
const DialogContent = React.forwardRef<
|
||||
React.ElementRef<typeof DialogPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
|
||||
>(({ className, children, ...props }, ref) => (
|
||||
<DialogPortal>
|
||||
<DialogOverlay />
|
||||
<DialogPrimitive.Content
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] border-rgray-6 bg-rgray-3 fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border p-6 shadow-lg duration-200 sm:rounded-lg",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<DialogPrimitive.Close className="ring-offset-rgray-2 focus:ring-rgray-7 data-[state=open]:bg-rgray-3 data-[state=open]:text-rgray-11 absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none">
|
||||
<X className="h-4 w-4" />
|
||||
<span className="sr-only">Close</span>
|
||||
</DialogPrimitive.Close>
|
||||
</DialogPrimitive.Content>
|
||||
</DialogPortal>
|
||||
));
|
||||
DialogContent.displayName = DialogPrimitive.Content.displayName;
|
||||
|
||||
const DialogHeader = ({
|
||||
className,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLDivElement>) => (
|
||||
<div
|
||||
className={cn(
|
||||
"flex flex-col space-y-1.5 text-center sm:text-left",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
DialogHeader.displayName = "DialogHeader";
|
||||
|
||||
const DialogFooter = ({
|
||||
className,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLDivElement>) => (
|
||||
<div
|
||||
className={cn(
|
||||
"mt-5 flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
DialogFooter.displayName = "DialogFooter";
|
||||
|
||||
const DialogTitle = React.forwardRef<
|
||||
React.ElementRef<typeof DialogPrimitive.Title>,
|
||||
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DialogPrimitive.Title
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"mb-1 text-xl font-medium leading-none tracking-tight",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
||||
|
||||
const DialogDescription = React.forwardRef<
|
||||
React.ElementRef<typeof DialogPrimitive.Description>,
|
||||
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DialogPrimitive.Description
|
||||
ref={ref}
|
||||
className={cn("text-rgray-11 text-sm", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
DialogDescription.displayName = DialogPrimitive.Description.displayName;
|
||||
|
||||
export {
|
||||
Dialog,
|
||||
DialogPortal,
|
||||
DialogOverlay,
|
||||
DialogClose,
|
||||
DialogTrigger,
|
||||
DialogContent,
|
||||
DialogHeader,
|
||||
DialogFooter,
|
||||
DialogTitle,
|
||||
DialogDescription,
|
||||
};
|
||||
124
apps/web/src/components/ui/drawer.tsx
Normal file
124
apps/web/src/components/ui/drawer.tsx
Normal file
|
|
@ -0,0 +1,124 @@
|
|||
"use client";
|
||||
|
||||
import * as React from "react";
|
||||
import { Drawer as DrawerPrimitive } from "vaul";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const Drawer = ({
|
||||
shouldScaleBackground = true,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DrawerPrimitive.Root>) => (
|
||||
<DrawerPrimitive.Root
|
||||
shouldScaleBackground={shouldScaleBackground}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
Drawer.displayName = "Drawer";
|
||||
|
||||
const DrawerTrigger = DrawerPrimitive.Trigger;
|
||||
|
||||
const DrawerPortal = DrawerPrimitive.Portal;
|
||||
|
||||
const DrawerClose = DrawerPrimitive.Close;
|
||||
|
||||
const DrawerOverlay = React.forwardRef<
|
||||
React.ElementRef<typeof DrawerPrimitive.Overlay>,
|
||||
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DrawerPrimitive.Overlay
|
||||
ref={ref}
|
||||
data-drawer-overlay
|
||||
className={cn("fixed inset-0 z-50 bg-black/80", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
|
||||
|
||||
const DrawerContent = React.forwardRef<
|
||||
React.ElementRef<typeof DrawerPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content> & {
|
||||
overlay?: boolean;
|
||||
handle?: boolean;
|
||||
}
|
||||
>(({ className, children, overlay = true, handle = true, ...props }, ref) => (
|
||||
<DrawerPortal>
|
||||
{overlay && <DrawerOverlay />}
|
||||
<DrawerPrimitive.Content
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"border-rgray-6 bg-rgray-2 fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{handle && (
|
||||
<div className="bg-rgray-4 mx-auto mt-4 h-2 w-[100px] rounded-full " />
|
||||
)}
|
||||
{children}
|
||||
</DrawerPrimitive.Content>
|
||||
</DrawerPortal>
|
||||
));
|
||||
DrawerContent.displayName = "DrawerContent";
|
||||
|
||||
const DrawerHeader = ({
|
||||
className,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLDivElement>) => (
|
||||
<div
|
||||
className={cn("grid gap-1.5 p-4 text-center sm:text-left", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
DrawerHeader.displayName = "DrawerHeader";
|
||||
|
||||
const DrawerFooter = ({
|
||||
className,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLDivElement>) => (
|
||||
<div
|
||||
className={cn("mt-auto flex flex-col gap-2 p-4", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
DrawerFooter.displayName = "DrawerFooter";
|
||||
|
||||
const DrawerTitle = React.forwardRef<
|
||||
React.ElementRef<typeof DrawerPrimitive.Title>,
|
||||
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DrawerPrimitive.Title
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"text-rgray-12 text-xl font-medium leading-none tracking-tight",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
|
||||
|
||||
const DrawerDescription = React.forwardRef<
|
||||
React.ElementRef<typeof DrawerPrimitive.Description>,
|
||||
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DrawerPrimitive.Description
|
||||
ref={ref}
|
||||
className={cn("text-rgray-11 text-md", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
|
||||
|
||||
export {
|
||||
Drawer,
|
||||
DrawerPortal,
|
||||
DrawerOverlay,
|
||||
DrawerTrigger,
|
||||
DrawerClose,
|
||||
DrawerContent,
|
||||
DrawerHeader,
|
||||
DrawerFooter,
|
||||
DrawerTitle,
|
||||
DrawerDescription,
|
||||
};
|
||||
|
|
@ -65,7 +65,7 @@ const DropdownMenuContent = React.forwardRef<
|
|||
ref={ref}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"data-[state=open]:animate-in bg-rgray-3 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-rgray-6 text-rgray-11 z-50 min-w-[8rem] overflow-hidden rounded-md border p-1 shadow-md",
|
||||
"data-[state=open]:animate-in bg-rgray-3 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-rgray-6 text-rgray-11 z-50 min-w-[9rem] overflow-hidden rounded-md border p-1 shadow-md",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import * as React from "react"
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils"
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
export interface InputProps
|
||||
extends React.InputHTMLAttributes<HTMLInputElement> {}
|
||||
|
|
@ -11,15 +11,43 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
|||
<input
|
||||
type={type}
|
||||
className={cn(
|
||||
"flex h-10 w-full rounded-md border border-gray-200 bg-white px-3 py-2 text-sm ring-offset-white file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-gray-500 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-950 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-800 dark:bg-gray-950 dark:ring-offset-gray-950 dark:placeholder:text-gray-400 dark:focus-visible:ring-gray-300",
|
||||
className
|
||||
"border-rgray-6 text-rgray-11 placeholder:text-rgray-11 focus-visible:ring-rgray-7 flex h-10 w-full rounded-md border bg-transparent px-3 py-2 text-sm font-normal transition file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-50 ",
|
||||
className,
|
||||
)}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
)
|
||||
Input.displayName = "Input"
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
export { Input }
|
||||
export interface InputWithIconProps
|
||||
extends React.InputHTMLAttributes<HTMLInputElement> {
|
||||
icon: React.ReactNode;
|
||||
}
|
||||
|
||||
const InputWithIcon = React.forwardRef<HTMLInputElement, InputWithIconProps>(
|
||||
({ className, type, icon, ...props }, ref) => {
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
"border-rgray-6 text-rgray-11 focus-within:ring-rgray-7 flex h-10 w-full items-center justify-center gap-2 rounded-md border bg-transparent px-3 py-2 text-sm font-normal transition focus-within:outline-none focus-within:ring-2 ",
|
||||
className,
|
||||
)}
|
||||
>
|
||||
{icon}
|
||||
<input
|
||||
type={type}
|
||||
className={
|
||||
"placeholder:text-rgray-11/50 w-full bg-transparent font-normal file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
|
||||
}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
);
|
||||
InputWithIcon.displayName = "Input";
|
||||
|
||||
export { Input, InputWithIcon };
|
||||
|
|
|
|||
40
apps/web/src/components/ui/popover.tsx
Normal file
40
apps/web/src/components/ui/popover.tsx
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
"use client";
|
||||
|
||||
import * as React from "react";
|
||||
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const Popover = PopoverPrimitive.Root;
|
||||
|
||||
const PopoverTrigger = PopoverPrimitive.Trigger;
|
||||
|
||||
const PopoverContent = React.forwardRef<
|
||||
React.ElementRef<typeof PopoverPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content> & {
|
||||
animate?: boolean;
|
||||
}
|
||||
>(
|
||||
(
|
||||
{ className, align = "center", animate = true, sideOffset = 4, ...props },
|
||||
ref,
|
||||
) => (
|
||||
<PopoverPrimitive.Portal>
|
||||
<PopoverPrimitive.Content
|
||||
ref={ref}
|
||||
align={align}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"border-rgray-6 bg-rgray-3 text-rgray-11 z-50 w-72 rounded-md border p-4 shadow-md outline-none",
|
||||
animate &&
|
||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
</PopoverPrimitive.Portal>
|
||||
),
|
||||
);
|
||||
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
|
||||
|
||||
export { Popover, PopoverTrigger, PopoverContent };
|
||||
57
apps/web/src/components/ui/textarea.tsx
Normal file
57
apps/web/src/components/ui/textarea.tsx
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { HTMLMotionProps, motion } from "framer-motion";
|
||||
|
||||
export interface TextareaProps
|
||||
extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
|
||||
|
||||
const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
|
||||
({ className, ...props }, ref) => {
|
||||
return (
|
||||
<textarea
|
||||
className={cn(
|
||||
"border-rgray-6 text-rgray-11 placeholder:text-rgray-11/70 focus-within:ring-rgray-7 flex min-h-[80px] w-full rounded-md border bg-transparent px-3 py-2 text-sm font-normal transition focus-within:outline-none focus-within:ring-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className,
|
||||
)}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
},
|
||||
);
|
||||
Textarea.displayName = "Textarea";
|
||||
|
||||
export interface Textarea2Props extends HTMLMotionProps<"div"> {
|
||||
textAreaProps?: TextareaProps;
|
||||
children: React.ReactNode | React.ReactNode[];
|
||||
}
|
||||
|
||||
const Textarea2 = React.forwardRef<HTMLDivElement, Textarea2Props>(
|
||||
({ className, children, textAreaProps: _textAreaProps, ...props }, ref) => {
|
||||
const { className: textAreaClassName, ...textAreaProps } =
|
||||
_textAreaProps || {};
|
||||
return (
|
||||
<motion.div
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"border-rgray-6 text-rgray-11 has-[textarea:focus-visible]:ring-rgray-7 flex h-auto min-h-[80px] w-full flex-col items-start justify-center rounded-md border bg-transparent px-3 py-2 text-sm transition has-[textarea:focus-visible]:ring-2",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<textarea
|
||||
className={cn(
|
||||
"text-rgray-11 h-full w-full resize-none bg-transparent placeholder:text-white/50 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
|
||||
textAreaClassName,
|
||||
)}
|
||||
{...textAreaProps}
|
||||
/>
|
||||
{children}
|
||||
</motion.div>
|
||||
);
|
||||
},
|
||||
);
|
||||
Textarea2.displayName = "Textarea2";
|
||||
|
||||
export { Textarea, Textarea2 };
|
||||
47
apps/web/src/contexts/MemoryContext.tsx
Normal file
47
apps/web/src/contexts/MemoryContext.tsx
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
'use client';
|
||||
import React, { useCallback } from 'react';
|
||||
import { CollectedSpaces } from '../../types/memory';
|
||||
|
||||
// temperory (will change)
|
||||
export const MemoryContext = React.createContext<{
|
||||
spaces: CollectedSpaces[];
|
||||
deleteSpace: (id: number) => Promise<void>;
|
||||
addSpace: (space: CollectedSpaces) => Promise<void>;
|
||||
}>({
|
||||
spaces: [],
|
||||
addSpace: async (space) => {},
|
||||
deleteSpace: async (id) => {},
|
||||
});
|
||||
|
||||
export const MemoryProvider: React.FC<
|
||||
{ spaces: CollectedSpaces[] } & React.PropsWithChildren
|
||||
> = ({ children, spaces: initalSpaces }) => {
|
||||
const [spaces, setSpaces] = React.useState<CollectedSpaces[]>(initalSpaces);
|
||||
|
||||
const addSpace = useCallback(
|
||||
async (space: CollectedSpaces) => {
|
||||
setSpaces((prev) => [...prev, space]);
|
||||
},
|
||||
[spaces],
|
||||
);
|
||||
const deleteSpace = useCallback(
|
||||
async (id: number) => {
|
||||
setSpaces((prev) => prev.filter((s) => s.id !== id));
|
||||
},
|
||||
[spaces],
|
||||
);
|
||||
|
||||
return (
|
||||
<MemoryContext.Provider value={{ spaces, addSpace, deleteSpace }}>
|
||||
{children}
|
||||
</MemoryContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export const useMemory = () => {
|
||||
const context = React.useContext(MemoryContext);
|
||||
if (context === undefined) {
|
||||
throw new Error('useMemory must be used within a MemoryProvider');
|
||||
}
|
||||
return context;
|
||||
};
|
||||
27
apps/web/src/hooks/useTouchHold.ts
Normal file
27
apps/web/src/hooks/useTouchHold.ts
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
import { useState } from "react";
|
||||
|
||||
// holdDuration (in ms)
|
||||
const useTouchHold = ({
|
||||
onHold,
|
||||
holdDuration = 500,
|
||||
}: {
|
||||
holdDuration?: number;
|
||||
onHold: () => Promise<void> | void;
|
||||
}) => {
|
||||
const [touchTimeout, setTouchTimeout] = useState<ReturnType<
|
||||
typeof setTimeout
|
||||
> | null>(null);
|
||||
|
||||
return {
|
||||
onTouchStart: () => {
|
||||
setTouchTimeout(setTimeout(onHold, holdDuration));
|
||||
},
|
||||
onTouchEnd: () => {
|
||||
if (touchTimeout) {
|
||||
clearTimeout(touchTimeout);
|
||||
}
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
export default useTouchHold;
|
||||
34
apps/web/src/hooks/useViewport.ts
Normal file
34
apps/web/src/hooks/useViewport.ts
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
import { useState, useEffect } from "react";
|
||||
|
||||
function getViewport() {
|
||||
try {
|
||||
const { innerWidth: width, innerHeight: height } = window ?? {
|
||||
innerWidth: 0,
|
||||
innerHeight: 0,
|
||||
};
|
||||
return {
|
||||
width,
|
||||
height,
|
||||
};
|
||||
} catch {
|
||||
return {
|
||||
width: 0,
|
||||
height: 0,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export default function useViewport() {
|
||||
const [viewport, setViewport] = useState(getViewport());
|
||||
|
||||
useEffect(() => {
|
||||
function handleResize() {
|
||||
setViewport(getViewport());
|
||||
}
|
||||
|
||||
window.addEventListener("resize", handleResize);
|
||||
return () => window.removeEventListener("resize", handleResize);
|
||||
}, []);
|
||||
|
||||
return viewport;
|
||||
}
|
||||
12
apps/web/src/lib/searchParams.ts
Normal file
12
apps/web/src/lib/searchParams.ts
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import {
|
||||
createSearchParamsCache,
|
||||
parseAsInteger,
|
||||
parseAsString
|
||||
} from 'nuqs/server'
|
||||
// Note: import from 'nuqs/server' to avoid the "use client" directive
|
||||
|
||||
export const searchParamsCache = createSearchParamsCache({
|
||||
// List your search param keys and associated parsers here:
|
||||
q: parseAsString.withDefault(''),
|
||||
maxResults: parseAsInteger.withDefault(10)
|
||||
})
|
||||
|
|
@ -1,6 +1,77 @@
|
|||
import { type ClassValue, clsx } from "clsx"
|
||||
import { twMerge } from "tailwind-merge"
|
||||
"use client";
|
||||
import { type ClassValue, clsx } from "clsx";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
return twMerge(clsx(inputs));
|
||||
}
|
||||
|
||||
// removes http(s?):// and / from the url
|
||||
export function cleanUrl(url: string) {
|
||||
if (url.endsWith("/")) {
|
||||
url = url.slice(0, -1);
|
||||
}
|
||||
return url.startsWith("https://")
|
||||
? url.slice(8)
|
||||
: url.startsWith("http://")
|
||||
? url.slice(7)
|
||||
: url;
|
||||
}
|
||||
|
||||
export function generateId() {
|
||||
return Math.random().toString(36).slice(2, 9);
|
||||
}
|
||||
|
||||
export function svgId(prefix: string, id: string) {
|
||||
return `${prefix}-${id}`;
|
||||
}
|
||||
|
||||
export function countLines(textarea: HTMLTextAreaElement): number {
|
||||
let _buffer: HTMLTextAreaElement | null = null;
|
||||
|
||||
if (_buffer == null) {
|
||||
_buffer = document.createElement("textarea");
|
||||
_buffer.style.border = "none";
|
||||
_buffer.style.height = "0";
|
||||
_buffer.style.overflow = "hidden";
|
||||
_buffer.style.padding = "0";
|
||||
_buffer.style.position = "absolute";
|
||||
_buffer.style.left = "0";
|
||||
_buffer.style.top = "0";
|
||||
_buffer.style.zIndex = "-1";
|
||||
document.body.appendChild(_buffer);
|
||||
}
|
||||
|
||||
const cs = window.getComputedStyle(textarea);
|
||||
const pl = parseInt(cs.paddingLeft as string);
|
||||
const pr = parseInt(cs.paddingRight as string);
|
||||
let lh = parseInt(cs.lineHeight as string);
|
||||
|
||||
// [cs.lineHeight] may return 'normal', which means line height = font size.
|
||||
if (isNaN(lh)) lh = parseInt(cs.fontSize as string);
|
||||
|
||||
// Copy content width.
|
||||
if (_buffer) {
|
||||
_buffer.style.width = textarea.clientWidth - pl - pr + "px";
|
||||
|
||||
// Copy text properties.
|
||||
_buffer.style.font = cs.font as string;
|
||||
_buffer.style.letterSpacing = cs.letterSpacing as string;
|
||||
_buffer.style.whiteSpace = cs.whiteSpace as string;
|
||||
_buffer.style.wordBreak = cs.wordBreak as string;
|
||||
_buffer.style.wordSpacing = cs.wordSpacing as string;
|
||||
_buffer.style.wordWrap = cs.wordWrap as string;
|
||||
|
||||
// Copy value.
|
||||
_buffer.value = textarea.value;
|
||||
|
||||
const result = Math.floor(_buffer.scrollHeight / lh);
|
||||
return result > 0 ? result : 1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
}
|
||||
|
||||
export function convertRemToPixels(rem: number) {
|
||||
return rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,15 +6,9 @@ import {
|
|||
sqliteTableCreator,
|
||||
text,
|
||||
integer,
|
||||
unique,
|
||||
unique
|
||||
} from "drizzle-orm/sqlite-core";
|
||||
|
||||
/**
|
||||
* This is an example of how to use the multi-project schema feature of Drizzle ORM. Use the same
|
||||
* database instance for multiple projects.
|
||||
*
|
||||
* @see https://orm.drizzle.team/docs/goodies#multi-project-schema
|
||||
*/
|
||||
export const createTable = sqliteTableCreator((name) => `${name}`);
|
||||
|
||||
export const users = createTable("user", {
|
||||
|
|
@ -84,27 +78,6 @@ export const verificationTokens = createTable(
|
|||
}),
|
||||
);
|
||||
|
||||
export const userStoredContent = createTable(
|
||||
"userStoredContent",
|
||||
{
|
||||
userId: text("userId")
|
||||
.notNull()
|
||||
.references(() => users.id),
|
||||
contentId: integer("contentId")
|
||||
.notNull()
|
||||
.references(() => storedContent.id),
|
||||
},
|
||||
(usc) => ({
|
||||
userContentIdx: index("userStoredContent_idx").on(
|
||||
usc.userId,
|
||||
usc.contentId,
|
||||
),
|
||||
uniqueUserContent: unique("unique_user_content").on(
|
||||
usc.userId,
|
||||
usc.contentId,
|
||||
),
|
||||
}),
|
||||
);
|
||||
|
||||
export const storedContent = createTable(
|
||||
"storedContent",
|
||||
|
|
@ -113,18 +86,42 @@ export const storedContent = createTable(
|
|||
content: text("content").notNull(),
|
||||
title: text("title", { length: 255 }),
|
||||
description: text("description", { length: 255 }),
|
||||
url: text("url").notNull().unique(),
|
||||
space: text("space", { length: 255 }),
|
||||
url: text("url").notNull(),
|
||||
savedAt: int("savedAt", { mode: "timestamp" }).notNull(),
|
||||
baseUrl: text("baseUrl", { length: 255 }),
|
||||
image: text("image", { length: 255 }),
|
||||
user: text("user", { length: 255 }).references(() => users.id),
|
||||
},
|
||||
(sc) => ({
|
||||
urlIdx: index("storedContent_url_idx").on(sc.url),
|
||||
savedAtIdx: index("storedContent_savedAt_idx").on(sc.savedAt),
|
||||
titleInx: index("storedContent_title_idx").on(sc.title),
|
||||
spaceIdx: index("storedContent_space_idx").on(sc.space),
|
||||
userIdx: index("storedContent_user_idx").on(sc.user),
|
||||
}),
|
||||
);
|
||||
|
||||
export type StoredContent = typeof storedContent.$inferSelect;
|
||||
export const contentToSpace = createTable(
|
||||
"contentToSpace",
|
||||
{
|
||||
contentId: integer("contentId").notNull().references(() => storedContent.id),
|
||||
spaceId: integer("spaceId").notNull().references(() => space.id),
|
||||
},
|
||||
(cts) => ({
|
||||
compoundKey: primaryKey({ columns: [cts.contentId, cts.spaceId] }),
|
||||
}),
|
||||
);
|
||||
|
||||
export const space = createTable(
|
||||
"space",
|
||||
{
|
||||
id: integer("id").notNull().primaryKey({ autoIncrement: true }),
|
||||
name: text('name').notNull().default('all'),
|
||||
user: text("user", { length: 255 }).references(() => users.id),
|
||||
},
|
||||
(space) => ({
|
||||
nameIdx: index("spaces_name_idx").on(space.name),
|
||||
userIdx: index("spaces_user_idx").on(space.user),
|
||||
}),
|
||||
);
|
||||
|
||||
export type StoredContent = Omit<typeof storedContent.$inferSelect, 'user'>
|
||||
|
|
@ -1,13 +1,56 @@
|
|||
import type { Config } from "tailwindcss";
|
||||
import plugin from "tailwindcss/plugin";
|
||||
|
||||
const config: Config = {
|
||||
content: [
|
||||
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
],
|
||||
content: ["./src/**/*.{js,ts,jsx,tsx,mdx}"],
|
||||
theme: {
|
||||
extend: {
|
||||
keyframes: {
|
||||
"scale-in": {
|
||||
"0%": {
|
||||
transform: "scale(0)",
|
||||
transformOrigin: "var(--radix-popover-content-transform-origin)",
|
||||
},
|
||||
"100%": {
|
||||
transform: "scale(1)",
|
||||
transformOrigin: "var(--radix-popover-content-transform-origin)",
|
||||
},
|
||||
},
|
||||
"scale-out": {
|
||||
"0%": {
|
||||
transform: "scale(1)",
|
||||
transformOrigin: "var(--radix-popover-content-transform-origin)",
|
||||
},
|
||||
"100%": {
|
||||
transform: "scale(0)",
|
||||
transformOrigin: "var(--radix-popover-content-transform-origin)",
|
||||
},
|
||||
},
|
||||
"fade-in": {
|
||||
"0%": {
|
||||
opacity: "0",
|
||||
},
|
||||
"100%": {
|
||||
opacity: "1",
|
||||
},
|
||||
},
|
||||
"from-top": {
|
||||
"0%": {
|
||||
transform: "translateY(-50px)",
|
||||
opacity: "0",
|
||||
},
|
||||
"100%": {
|
||||
transform: "translateY(0)",
|
||||
opacity: "1",
|
||||
},
|
||||
},
|
||||
},
|
||||
animation: {
|
||||
"scale-in": "scale-in 0.2s cubic-bezier(0.16, 1, 0.3, 1)",
|
||||
"scale-out": "scale-out 0.2s cubic-bezier(0.16, 1, 0.3, 1)",
|
||||
"fade-in": "fade-in 0.2s 0.5s forwards cubic-bezier(0.16, 1, 0.3, 1)",
|
||||
"from-top": "from-top 0.2s ease-in-out",
|
||||
},
|
||||
backgroundImage: {
|
||||
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
|
||||
"gradient-conic":
|
||||
|
|
@ -31,6 +74,14 @@ const config: Config = {
|
|||
},
|
||||
},
|
||||
},
|
||||
plugins: [require("tailwindcss-animate")],
|
||||
safelist: ["pb-[20vh]", "pb-5", "h-[2em]", "max-h-[2em]", "p-0"],
|
||||
darkMode: "class",
|
||||
plugins: [
|
||||
require("tailwindcss-animate"),
|
||||
plugin(function ({ addVariant }) {
|
||||
addVariant("on", "&[data-state-on='true']");
|
||||
}),
|
||||
require("tailwind-scrollbar"),
|
||||
],
|
||||
};
|
||||
export default config;
|
||||
|
|
|
|||
63
apps/web/types/memory.tsx
Normal file
63
apps/web/types/memory.tsx
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
import { db } from "@/server/db";
|
||||
import { contentToSpace, space, StoredContent } from "@/server/db/schema";
|
||||
import { eq, inArray, or } from "drizzle-orm";
|
||||
|
||||
export const transformContent = async (
|
||||
content: StoredContent[],
|
||||
): Promise<CollectedSpaces[]> => {
|
||||
// Retrieve spaces and their associated content from the database
|
||||
const spacesWithContent = await db
|
||||
.select({
|
||||
id: space.id,
|
||||
name: space.name,
|
||||
contentId: contentToSpace.contentId,
|
||||
})
|
||||
.from(space)
|
||||
.leftJoin(contentToSpace, eq(space.id, contentToSpace.spaceId))
|
||||
.where(
|
||||
inArray(
|
||||
contentToSpace.contentId,
|
||||
content.map((c: StoredContent) => c.id),
|
||||
),
|
||||
)
|
||||
.all();
|
||||
|
||||
// Group content by id
|
||||
const contentById = content.reduce(
|
||||
(acc, c) => {
|
||||
acc[c.id] = acc[c.id] || [];
|
||||
acc[c.id].push(c);
|
||||
return acc;
|
||||
},
|
||||
{} as { [key: number]: StoredContent[] },
|
||||
);
|
||||
|
||||
// Aggregate content for each space
|
||||
const aggregatedSpaces = spacesWithContent.reduce(
|
||||
(acc, space) => {
|
||||
if (!acc[space.id]) {
|
||||
acc[space.id] = { id: space.id, title: space.name, content: [] };
|
||||
}
|
||||
acc[space.id].content.push(...contentById[space.contentId!]);
|
||||
return acc;
|
||||
},
|
||||
{} as { [key: number]: CollectedSpaces },
|
||||
);
|
||||
|
||||
// Convert the aggregated spaces object to an array
|
||||
return Object.values(aggregatedSpaces);
|
||||
};
|
||||
|
||||
export type CollectedSpaces = {
|
||||
id: number;
|
||||
title: string;
|
||||
content: StoredContent[];
|
||||
};
|
||||
|
||||
export type ChatHistory = {
|
||||
question: string;
|
||||
answer: {
|
||||
parts: { text: string }[];
|
||||
sources: string[];
|
||||
};
|
||||
};
|
||||
|
|
@ -58,8 +58,10 @@
|
|||
"html-metadata-parser": "^2.0.4",
|
||||
"lucide-react": "^0.343.0",
|
||||
"next-auth": "beta",
|
||||
"nuqs": "^1.17.1",
|
||||
"react-markdown": "^9.0.1",
|
||||
"remark-gfm": "^4.0.0",
|
||||
"tailwind-scrollbar": "^3.1.0",
|
||||
"tailwindcss-animate": "^1.0.7"
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue