From 49cacb2da2ee332463077c18ebe9e192362f669e Mon Sep 17 00:00:00 2001 From: Alfredo Gallardo Date: Tue, 31 Oct 2023 08:28:28 -0300 Subject: [PATCH 01/17] - feature: added feature to export encrypted credentials --- .../export-connection/export-connection.tsx | 162 ++++++++++++++++++ apps/shinkai-visor/src/components/nav/nav.tsx | 45 +++-- .../src/components/popup/popup.tsx | 18 +- .../src/components/settings/settings.tsx | 28 +++ apps/shinkai-visor/src/lang/en.json | 11 +- apps/shinkai-visor/src/lang/es.json | 2 +- package-lock.json | 9 + package.json | 1 + 8 files changed, 262 insertions(+), 14 deletions(-) create mode 100644 apps/shinkai-visor/src/components/export-connection/export-connection.tsx create mode 100644 apps/shinkai-visor/src/components/settings/settings.tsx diff --git a/apps/shinkai-visor/src/components/export-connection/export-connection.tsx b/apps/shinkai-visor/src/components/export-connection/export-connection.tsx new file mode 100644 index 000000000..5975d1b10 --- /dev/null +++ b/apps/shinkai-visor/src/components/export-connection/export-connection.tsx @@ -0,0 +1,162 @@ +import { zodResolver } from '@hookform/resolvers/zod'; +import { Download, FileKey } from 'lucide-react'; +import { QRCodeCanvas } from 'qrcode.react'; +import { useEffect, useRef, useState } from 'react'; +import { useForm } from 'react-hook-form'; +import { FormattedMessage, useIntl } from 'react-intl'; +import { z } from 'zod'; + +import shinkaiLogo from '../../assets/icons/shinkai-min.svg'; +import { srcUrlResolver } from '../../helpers/src-url-resolver'; +import { useAuth } from '../../store/auth/auth'; +import { Button } from '../ui/button'; +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, +} from '../ui/form'; +import { Input } from '../ui/input'; + +export const ExportConnection = () => { + const intl = useIntl(); + const formSchema = z + .object({ + passphrase: z.string().min(8), + confirmPassphrase: z.string().min(8), + }) + .superRefine(({ passphrase, confirmPassphrase }, ctx) => { + if (passphrase !== confirmPassphrase) { + ctx.addIssue({ + code: 'custom', + message: intl.formatMessage({ id: 'passphrases-dont-match'}), + path: ['confirmPassphrase'], + }); + } + }); + type FormSchemaType = z.infer; + const auth = useAuth((state) => state.auth); + const form = useForm({ + resolver: zodResolver(formSchema), + defaultValues: { + passphrase: '', + confirmPassphrase: '', + }, + }); + const qrCanvasContainerRef = useRef(null); + const passphrase = form.watch('passphrase'); + const confirmPassphrase = form.watch('confirmPassphrase'); + const [encryptedSetupData, setEncryptedSetupData] = useState(''); + useEffect(() => { + setEncryptedSetupData(''); + }, [passphrase, confirmPassphrase, setEncryptedSetupData]); + const exportConnection = (values: FormSchemaType): void => { + // TODO: Convert to a common format + const parsedSetupData = JSON.stringify(auth); + const encryptedSetupData = parsedSetupData; // TODO: call shinkai-typescript + setEncryptedSetupData(encryptedSetupData); + }; + const qrPropsCanvas = { + level: 'L', + size: 150, + imageSettings: { + src: srcUrlResolver(shinkaiLogo), + x: undefined, + y: undefined, + height: 24, + width: 24, + excavate: true, + includeMargin: false, + }, + }; + const downloadQR = (): void => { + const canvas: HTMLCanvasElement | undefined = qrCanvasContainerRef?.current?.children[0] as HTMLCanvasElement; + if (!qrCanvasContainerRef.current || !canvas) { + return; + } + const imageRef = canvas.toDataURL('image/jpg'); + const dummyAnchor = document.createElement('a'); + dummyAnchor.href = imageRef; + dummyAnchor.download = `shinkai-${auth?.registration_name}-backup.jpg`; + document.body.appendChild(dummyAnchor); + dummyAnchor.click(); + document.body.removeChild(dummyAnchor); + }; + return ( +
+
+ +

+ +

+
+
+
+ +
+ ( + + + + + + + + + + )} + /> + ( + + + + + + + + + + )} + /> +
+ +
+ + + {encryptedSetupData && ( +
+ + + +
+
+ +
+ +
+
+ )} +
+
+ ); +}; diff --git a/apps/shinkai-visor/src/components/nav/nav.tsx b/apps/shinkai-visor/src/components/nav/nav.tsx index dfea03a36..5b26cc977 100644 --- a/apps/shinkai-visor/src/components/nav/nav.tsx +++ b/apps/shinkai-visor/src/components/nav/nav.tsx @@ -1,4 +1,14 @@ -import { ArrowLeft, Bot, Inbox, LogOut, Menu, MessageCircle, Workflow, X } from 'lucide-react'; +import { + ArrowLeft, + Bot, + Inbox, + LogOut, + Menu, + MessageCircle, + Settings, + Workflow, + X, +} from 'lucide-react'; import { useState } from 'react'; import { FormattedMessage } from 'react-intl'; import { useHistory, useLocation } from 'react-router-dom'; @@ -24,6 +34,7 @@ enum MenuOption { Agents = 'agents', AddAgent = 'add-agent', CreateJob = 'create-job', + Settings = 'settings', Logout = 'logout', } @@ -34,17 +45,16 @@ export default function NavBar() { const uiContainer = useUIContainer((state) => state.uiContainer); const [isMenuOpened, setMenuOpened] = useState(false); - const isRootPage = ['/inboxes', '/agents'].includes( - location.pathname - ); + const isRootPage = ['/inboxes', '/agents', '/settings'].includes(location.pathname); const goBack = () => { history.goBack(); - } + }; const logout = (): void => { setLogout(); }; const onClickMenuOption = (key: MenuOption) => { + console.log('menu option', key, MenuOption.Settings); switch (key) { case MenuOption.Inbox: history.push('/inboxes'); @@ -61,6 +71,9 @@ export default function NavBar() { case MenuOption.AddAgent: history.push('/agents/add'); break; + case MenuOption.Settings: + history.push('/settings'); + break; case MenuOption.Logout: logout(); break; @@ -71,11 +84,15 @@ export default function NavBar() { return ( ); diff --git a/apps/shinkai-visor/src/components/popup/popup.tsx b/apps/shinkai-visor/src/components/popup/popup.tsx index 48e89143f..203f6fab5 100644 --- a/apps/shinkai-visor/src/components/popup/popup.tsx +++ b/apps/shinkai-visor/src/components/popup/popup.tsx @@ -15,12 +15,11 @@ import { useGlobalPopupChromeMessage } from '../../hooks/use-global-popup-chrome import { langMessages, locale } from '../../lang/intl'; import { useAuth } from '../../store/auth/auth'; import { AddAgent } from '../add-agent/add-agent'; -import { AddNode } from '../add-node/add-node'; import { Agents } from '../agents/agents'; import { AnimatedRoute } from '../animated-route/animated-routed'; +import { ConnectMethodQrCode } from '../connect-method-qr-code/connec-method-qr-code'; import { ConnectMethodQuickStart } from '../connect-method-quick-start/connect-method-quick-start'; import { ConnectMethodRestoreConnection } from '../connect-method-restore-connection/connect-method-restore-connection'; -import { ConnectSelectMethod } from '../connect-select-method/connect-select-method'; import { CreateInbox } from '../create-inbox/create-inbox'; import { CreateJob } from '../create-job/create-job'; import { ExportConnection } from '../export-connection/export-connection'; @@ -79,17 +78,14 @@ export const Popup = () => { - - - - - + + From bc799f751b032d34ba7dbadbb6acbc8b7e09972e Mon Sep 17 00:00:00 2001 From: Alfredo Gallardo Date: Thu, 2 Nov 2023 15:27:31 -0300 Subject: [PATCH 13/17] - refactor: page header --- .../src/components/add-agent/add-agent.tsx | 11 ++-- .../src/components/agents/agents.tsx | 41 +++++++------- .../connect-method-quick-start.tsx | 22 ++++---- .../connect-method-restore-connection.tsx | 46 ++++++++-------- .../connection-method-option.tsx | 1 + .../components/create-inbox/create-inbox.tsx | 11 ++-- .../src/components/create-job/create-job.tsx | 11 ++-- .../export-connection/export-connection.tsx | 54 ++++++++++--------- .../src/components/header/header.tsx | 21 ++++++++ .../src/components/inbox/inbox.tsx | 4 +- .../src/components/inboxes/inboxes.css | 7 --- .../src/components/inboxes/inboxes.tsx | 14 +++-- .../src/components/settings/settings.tsx | 11 ++-- 13 files changed, 136 insertions(+), 118 deletions(-) create mode 100644 apps/shinkai-visor/src/components/header/header.tsx delete mode 100644 apps/shinkai-visor/src/components/inboxes/inboxes.css diff --git a/apps/shinkai-visor/src/components/add-agent/add-agent.tsx b/apps/shinkai-visor/src/components/add-agent/add-agent.tsx index 636995ee4..1ee086b5c 100644 --- a/apps/shinkai-visor/src/components/add-agent/add-agent.tsx +++ b/apps/shinkai-visor/src/components/add-agent/add-agent.tsx @@ -8,6 +8,7 @@ import { z } from 'zod'; import { useAuth } from '../../store/auth/auth'; import { useUIContainer } from '../../store/ui-container/ui-container'; +import { Header } from '../header/header'; import { Button } from '../ui/button'; import { Form, @@ -101,12 +102,10 @@ export const AddAgent = () => { }; return (
-
- -

- -

-
+
} + title={} + />
{ profile_encryption_sk: auth?.profile_encryption_sk ?? '', profile_identity_sk: auth?.profile_identity_sk ?? '', }); - return !agents?.length ? ( -
- -
- ) : ( + return (
-
- -

- -

-
- - {agents?.map((agent) => ( - - - - ))} - +
} + title={} + /> + {!agents?.length ? ( +
+ +
+ ) : ( + + {agents?.map((agent) => ( + + + + ))} + + )}
); }; diff --git a/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx b/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx index 5867cc7ca..23244f783 100644 --- a/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx +++ b/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx @@ -13,6 +13,7 @@ import { } from '../../helpers/encryption-keys'; import { SetupData, useAuth } from '../../store/auth/auth'; import { ConnectionMethodOption } from '../connection-method-option/connection-method-option'; +import { Header } from '../header/header'; import { Button } from '../ui/button'; import ErrorMessage from '../ui/error-message'; import { @@ -37,7 +38,7 @@ export const ConnectMethodQuickStart = () => { const history = useHistory(); const setAuth = useAuth((state) => state.setAuth); const DEFAULT_NODE_ADDRESS = 'http://127.0.0.1:9550'; - const DEFAULT_SHINKAI_IDENTITY = '@@localhost.shinkai' + const DEFAULT_SHINKAI_IDENTITY = '@@localhost.shinkai'; const [encryptionKeys, setEncryptedKeys] = useState( null ); @@ -101,18 +102,15 @@ export const ConnectMethodQuickStart = () => { return (
-
-
- - - - -
- +
- -
- + } + icon={} + title={ + + } + /> { }; const restore = async (values: FormType) => { try { - const decryptedValue = await decryptMessageWithPassphrase(values.encryptedConnection, values.passphrase); + const decryptedValue = await decryptMessageWithPassphrase( + values.encryptedConnection, + values.passphrase + ); if (decryptedValue) { const decryptedSetupData = JSON.parse(decryptedValue); - + setAuth(decryptedSetupData); // TODO: Add logic to test if setup data is valid to create an authenticated connection with Shinkai Node - history.replace('/inboxes'); + history.replace('/inboxes'); } } catch (_) { setError(true); @@ -83,17 +87,15 @@ export const ConnectMethodRestoreConnection = () => { }; return (
-
-
- -

- -

-
- +
- -
+ } + icon={} + title={ + + } + /> {
- {encryptedConnectionFile.name} + + {encryptedConnectionFile.name} +
+ className="h-6 w-6" + onClick={() => removeConnectionFile()} + size="icon" + > + +
) : (
{encryptedConnectionFile && ( - + )}
diff --git a/apps/shinkai-visor/src/components/connection-method-option/connection-method-option.tsx b/apps/shinkai-visor/src/components/connection-method-option/connection-method-option.tsx index 89355aacf..e25c9283d 100644 --- a/apps/shinkai-visor/src/components/connection-method-option/connection-method-option.tsx +++ b/apps/shinkai-visor/src/components/connection-method-option/connection-method-option.tsx @@ -6,6 +6,7 @@ export type ConnectionMethodOptionProps = { description: ReactNode; onClick?: () => void; }; + export const ConnectionMethodOption = ({ icon, title, diff --git a/apps/shinkai-visor/src/components/create-inbox/create-inbox.tsx b/apps/shinkai-visor/src/components/create-inbox/create-inbox.tsx index 07825238f..7aaef723f 100644 --- a/apps/shinkai-visor/src/components/create-inbox/create-inbox.tsx +++ b/apps/shinkai-visor/src/components/create-inbox/create-inbox.tsx @@ -8,6 +8,7 @@ import { useHistory } from 'react-router-dom'; import { z } from 'zod'; import { useAuth } from '../../store/auth/auth'; +import { Header } from '../header/header'; import { Button } from '../ui/button'; import { Form, @@ -68,12 +69,10 @@ export const CreateInbox = () => { return (
-
- -

- -

-
+
} + title={} + >
{ return (
-
- -

- -

-
+
} + title={} + /> { const intl = useIntl(); const formSchema = z - .object({ - passphrase: z.string().min(8), - confirmPassphrase: z.string().min(8), - }) - .superRefine(({ passphrase, confirmPassphrase }, ctx) => { - if (passphrase !== confirmPassphrase) { - ctx.addIssue({ - code: 'custom', - message: intl.formatMessage({ id: 'passphrases-dont-match'}), - path: ['confirmPassphrase'], - }); - } - }); + .object({ + passphrase: z.string().min(8), + confirmPassphrase: z.string().min(8), + }) + .superRefine(({ passphrase, confirmPassphrase }, ctx) => { + if (passphrase !== confirmPassphrase) { + ctx.addIssue({ + code: 'custom', + message: intl.formatMessage({ id: 'passphrases-dont-match' }), + path: ['confirmPassphrase'], + }); + } + }); type FormSchemaType = z.infer; const auth = useAuth((state) => state.auth); const form = useForm({ @@ -52,11 +53,14 @@ export const ExportConnection = () => { const exportConnection = async (values: FormSchemaType): Promise => { // TODO: Convert to a common format shared by visor, app and tray const parsedSetupData = JSON.stringify(auth); - const encryptedSetupData = await encryptMessageWithPassphrase(parsedSetupData, values.passphrase); + const encryptedSetupData = await encryptMessageWithPassphrase( + parsedSetupData, + values.passphrase + ); setEncryptedSetupData(encryptedSetupData); }; const download = (): void => { - const link = document.createElement("a"); + const link = document.createElement('a'); const content = encryptedSetupData; const file = new Blob([content], { type: 'text/plain' }); link.href = URL.createObjectURL(file); @@ -66,12 +70,10 @@ export const ExportConnection = () => { }; return (
-
- -

- -

-
+
} + title={} + />
{
-
download()}> - +
download()}> +
- onQrImageSelected(event)} - ref={fileInput} - type="file" - /> -
+
+ } + icon={} + title={ + + } + /> +
+
+
+ {qrImageFile && qrImageUrl ? ( +
+
+ + {qrImageFile.name} +
+
+ qr connection data + +
+ +
+ ) : ( + + )}
- )} +
- {currentStep === AddNodeSteps.Connect && ( + {qrImageFile && ( {
( @@ -332,7 +252,7 @@ export const ConnectMethodQrCode = () => { ( @@ -345,13 +265,33 @@ export const ConnectMethodQrCode = () => { )} /> + + ( + + + + + + + + + + )} + /> + {isSubmitError && ( )}
- diff --git a/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx b/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx index 23244f783..69236fb17 100644 --- a/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx +++ b/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx @@ -1,6 +1,6 @@ import { zodResolver } from '@hookform/resolvers/zod'; import { useSubmitRegistrationNoCode } from '@shinkai_network/shinkai-node-state/lib/mutations/submitRegistation/useSubmitRegistrationNoCode'; -import { FileKey, Loader2, QrCode, Zap } from 'lucide-react'; +import { FileKey, Loader2, PlugZap, QrCode, Zap } from 'lucide-react'; import { useState } from 'react'; import { useForm } from 'react-hook-form'; import { FormattedMessage } from 'react-intl'; @@ -169,7 +169,11 @@ export const ConnectMethodQuickStart = () => {
diff --git a/apps/shinkai-visor/src/components/connect-method-restore-connection/connect-method-restore-connection.tsx b/apps/shinkai-visor/src/components/connect-method-restore-connection/connect-method-restore-connection.tsx index 3f12afb5e..4831153c9 100644 --- a/apps/shinkai-visor/src/components/connect-method-restore-connection/connect-method-restore-connection.tsx +++ b/apps/shinkai-visor/src/components/connect-method-restore-connection/connect-method-restore-connection.tsx @@ -1,6 +1,6 @@ import { zodResolver } from '@hookform/resolvers/zod'; import { decryptMessageWithPassphrase } from '@shinkai_network/shinkai-message-ts/cryptography'; -import { FileKey, Loader2, Trash, Upload } from 'lucide-react'; +import { FileKey, PlugZap, Trash, Upload } from 'lucide-react'; import { useState } from 'react'; import { useForm } from 'react-hook-form'; import { FormattedMessage } from 'react-intl'; @@ -32,7 +32,6 @@ export const ConnectMethodRestoreConnection = () => { const history = useHistory(); const setAuth = useAuth((state) => state.setAuth); const [error, setError] = useState(false); - const [isLoading, setIsLoading] = useState(false); const [encryptedConnectionFile, setEncryptedConnectionFile] = useState(null); const form = useForm({ @@ -117,7 +116,7 @@ export const ConnectMethodRestoreConnection = () => {
{encryptedConnectionFile ? (
-
+
{encryptedConnectionFile.name} @@ -188,8 +187,8 @@ export const ConnectMethodRestoreConnection = () => { {error && }
- From f14a1fe289f8085e2f68b856dcff799f14b8fa99 Mon Sep 17 00:00:00 2001 From: Alfredo Gallardo Date: Thu, 2 Nov 2023 18:24:52 -0300 Subject: [PATCH 15/17] - fix: removed unused depedencies --- .eslintignore | 4 +- libs/shinkai-message-ts/package.json | 3 +- package-lock.json | 156 +++------------------------ package.json | 3 - 4 files changed, 22 insertions(+), 144 deletions(-) diff --git a/.eslintignore b/.eslintignore index 3c3629e64..6e4c02cef 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1 +1,3 @@ -node_modules +**/node_modules +**/android +**/ios \ No newline at end of file diff --git a/libs/shinkai-message-ts/package.json b/libs/shinkai-message-ts/package.json index 4c006b61d..3da8c28c1 100644 --- a/libs/shinkai-message-ts/package.json +++ b/libs/shinkai-message-ts/package.json @@ -16,7 +16,8 @@ }, "dependencies": { "@noble/ed25519": "^2.0.0", - "curve25519-js": "^0.0.4" + "curve25519-js": "^0.0.4", + "libsodium-wrappers-sumo": "^0.7.13" }, "exports": { ".": { diff --git a/package-lock.json b/package-lock.json index 22ee6fd55..f94c6cb24 100644 --- a/package-lock.json +++ b/package-lock.json @@ -63,8 +63,6 @@ "libsodium-wrappers-sumo": "^0.7.13", "lucide-react": "^0.263.1", "node-forge": ">=1.0.0", - "qrcode": "^1.5.3", - "qrcode.react": "^3.1.0", "react": "18.2.0", "react-dom": "18.2.0", "react-hook-form": "^7.47.0", @@ -116,7 +114,6 @@ "@types/jest": "^29.5.4", "@types/libsodium-wrappers-sumo": "^0.7.7", "@types/node": "18.14.2", - "@types/qrcode": "^1.5.4", "@types/react": "18.2.14", "@types/react-dom": "18.2.6", "@types/react-router": "^5.1.20", @@ -8726,15 +8723,6 @@ "version": "15.7.5", "license": "MIT" }, - "node_modules/@types/qrcode": { - "version": "1.5.4", - "resolved": "https://registry.npmjs.org/@types/qrcode/-/qrcode-1.5.4.tgz", - "integrity": "sha512-ufYqUO7wUBq49hugJry+oIYKscvxIQerJSmXeny215aJKfrepN04DDZP8FCgxvV82kOqKPULCE4PIW3qUmZrRA==", - "dev": true, - "dependencies": { - "@types/node": "*" - } - }, "node_modules/@types/qs": { "version": "6.9.8", "dev": true, @@ -9823,6 +9811,7 @@ }, "node_modules/ansi-regex": { "version": "5.0.1", + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -9830,6 +9819,7 @@ }, "node_modules/ansi-styles": { "version": "4.3.0", + "dev": true, "license": "MIT", "dependencies": { "color-convert": "^2.0.1" @@ -11148,6 +11138,7 @@ }, "node_modules/camelcase": { "version": "5.3.1", + "dev": true, "license": "MIT", "engines": { "node": ">=6" @@ -11864,6 +11855,7 @@ }, "node_modules/color-convert": { "version": "2.0.1", + "dev": true, "license": "MIT", "dependencies": { "color-name": "~1.1.4" @@ -11874,6 +11866,7 @@ }, "node_modules/color-name": { "version": "1.1.4", + "dev": true, "license": "MIT" }, "node_modules/colord": { @@ -12813,14 +12806,6 @@ } } }, - "node_modules/decamelize": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz", - "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==", - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/decimal.js": { "version": "10.4.3", "dev": true, @@ -13068,11 +13053,6 @@ "node": "^14.15.0 || ^16.10.0 || >=18.0.0" } }, - "node_modules/dijkstrajs": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz", - "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==" - }, "node_modules/dir-glob": { "version": "3.0.1", "dev": true, @@ -13299,6 +13279,7 @@ }, "node_modules/emoji-regex": { "version": "8.0.0", + "dev": true, "license": "MIT" }, "node_modules/emojis-list": { @@ -13309,11 +13290,6 @@ "node": ">= 4" } }, - "node_modules/encode-utf8": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/encode-utf8/-/encode-utf8-1.0.3.tgz", - "integrity": "sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==" - }, "node_modules/encodeurl": { "version": "1.0.2", "dev": true, @@ -14734,6 +14710,7 @@ }, "node_modules/find-up": { "version": "4.1.0", + "dev": true, "license": "MIT", "dependencies": { "locate-path": "^5.0.0", @@ -15080,6 +15057,7 @@ }, "node_modules/get-caller-file": { "version": "2.0.5", + "dev": true, "license": "ISC", "engines": { "node": "6.* || 8.* || >= 10.*" @@ -16330,6 +16308,7 @@ }, "node_modules/is-fullwidth-code-point": { "version": "3.0.0", + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -18070,6 +18049,7 @@ }, "node_modules/locate-path": { "version": "5.0.0", + "dev": true, "license": "MIT", "dependencies": { "p-locate": "^4.1.0" @@ -20286,6 +20266,7 @@ }, "node_modules/p-locate": { "version": "4.1.0", + "dev": true, "license": "MIT", "dependencies": { "p-limit": "^2.2.0" @@ -20296,6 +20277,7 @@ }, "node_modules/p-locate/node_modules/p-limit": { "version": "2.3.0", + "dev": true, "license": "MIT", "dependencies": { "p-try": "^2.0.0" @@ -20335,6 +20317,7 @@ }, "node_modules/p-try": { "version": "2.2.0", + "dev": true, "license": "MIT", "engines": { "node": ">=6" @@ -20564,6 +20547,7 @@ }, "node_modules/path-exists": { "version": "4.0.0", + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -20734,14 +20718,6 @@ "node": ">=10.4.0" } }, - "node_modules/pngjs": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz", - "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==", - "engines": { - "node": ">=10.13.0" - } - }, "node_modules/portfinder": { "version": "1.0.32", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.32.tgz", @@ -21767,92 +21743,6 @@ "teleport": ">=0.2.0" } }, - "node_modules/qrcode": { - "version": "1.5.3", - "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.3.tgz", - "integrity": "sha512-puyri6ApkEHYiVl4CFzo1tDkAZ+ATcnbJrJ6RiBM1Fhctdn/ix9MTE3hRph33omisEbC/2fcfemsseiKgBPKZg==", - "dependencies": { - "dijkstrajs": "^1.0.1", - "encode-utf8": "^1.0.3", - "pngjs": "^5.0.0", - "yargs": "^15.3.1" - }, - "bin": { - "qrcode": "bin/qrcode" - }, - "engines": { - "node": ">=10.13.0" - } - }, - "node_modules/qrcode.react": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/qrcode.react/-/qrcode.react-3.1.0.tgz", - "integrity": "sha512-oyF+Urr3oAMUG/OiOuONL3HXM+53wvuH3mtIWQrYmsXoAq0DkvZp2RYUWFSMFtbdOpuS++9v+WAkzNVkMlNW6Q==", - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - } - }, - "node_modules/qrcode/node_modules/cliui": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz", - "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==", - "dependencies": { - "string-width": "^4.2.0", - "strip-ansi": "^6.0.0", - "wrap-ansi": "^6.2.0" - } - }, - "node_modules/qrcode/node_modules/wrap-ansi": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz", - "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==", - "dependencies": { - "ansi-styles": "^4.0.0", - "string-width": "^4.1.0", - "strip-ansi": "^6.0.0" - }, - "engines": { - "node": ">=8" - } - }, - "node_modules/qrcode/node_modules/y18n": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz", - "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==" - }, - "node_modules/qrcode/node_modules/yargs": { - "version": "15.4.1", - "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz", - "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==", - "dependencies": { - "cliui": "^6.0.0", - "decamelize": "^1.2.0", - "find-up": "^4.1.0", - "get-caller-file": "^2.0.1", - "require-directory": "^2.1.1", - "require-main-filename": "^2.0.0", - "set-blocking": "^2.0.0", - "string-width": "^4.2.0", - "which-module": "^2.0.0", - "y18n": "^4.0.0", - "yargs-parser": "^18.1.2" - }, - "engines": { - "node": ">=8" - } - }, - "node_modules/qrcode/node_modules/yargs-parser": { - "version": "18.1.3", - "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz", - "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==", - "dependencies": { - "camelcase": "^5.0.0", - "decamelize": "^1.2.0" - }, - "engines": { - "node": ">=6" - } - }, "node_modules/qs": { "version": "6.11.0", "dev": true, @@ -22601,6 +22491,7 @@ }, "node_modules/require-directory": { "version": "2.1.1", + "dev": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -22614,11 +22505,6 @@ "node": ">=0.10.0" } }, - "node_modules/require-main-filename": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz", - "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==" - }, "node_modules/requires-port": { "version": "1.0.0", "dev": true, @@ -23202,11 +23088,6 @@ "node": ">= 0.8.0" } }, - "node_modules/set-blocking": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz", - "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==" - }, "node_modules/setprototypeof": { "version": "1.2.0", "dev": true, @@ -23857,6 +23738,7 @@ }, "node_modules/string-width": { "version": "4.2.3", + "dev": true, "license": "MIT", "dependencies": { "emoji-regex": "^8.0.0", @@ -23929,6 +23811,7 @@ }, "node_modules/strip-ansi": { "version": "6.0.1", + "dev": true, "license": "MIT", "dependencies": { "ansi-regex": "^5.0.1" @@ -26309,11 +26192,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/which-module": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.1.tgz", - "integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==" - }, "node_modules/which-typed-array": { "version": "1.1.11", "dev": true, diff --git a/package.json b/package.json index 24f76618b..fc6eef2bf 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,6 @@ "@types/jest": "^29.5.4", "@types/libsodium-wrappers-sumo": "^0.7.7", "@types/node": "18.14.2", - "@types/qrcode": "^1.5.4", "@types/react": "18.2.14", "@types/react-dom": "18.2.6", "@types/react-router": "^5.1.20", @@ -140,8 +139,6 @@ "libsodium-wrappers-sumo": "^0.7.13", "lucide-react": "^0.263.1", "node-forge": ">=1.0.0", - "qrcode": "^1.5.3", - "qrcode.react": "^3.1.0", "react": "18.2.0", "react-dom": "18.2.0", "react-hook-form": "^7.47.0", From 7e348ac8a9101b398571b90f21ecd38595db7cc3 Mon Sep 17 00:00:00 2001 From: Alfredo Gallardo Date: Thu, 2 Nov 2023 19:22:50 -0300 Subject: [PATCH 16/17] - fix: encrypt param error --- libs/shinkai-message-ts/src/cryptography/shinkai-encryption.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/libs/shinkai-message-ts/src/cryptography/shinkai-encryption.ts b/libs/shinkai-message-ts/src/cryptography/shinkai-encryption.ts index 97e203d9b..3eedbac88 100644 --- a/libs/shinkai-message-ts/src/cryptography/shinkai-encryption.ts +++ b/libs/shinkai-message-ts/src/cryptography/shinkai-encryption.ts @@ -19,9 +19,8 @@ export async function encryptMessageWithPassphrase( const nonce = sodium.randombytes_buf( sodium.crypto_aead_chacha20poly1305_IETF_NPUBBYTES ); - const plaintext_bytes = sodium.from_string(message); const ciphertext = sodium.crypto_aead_chacha20poly1305_ietf_encrypt( - plaintext_bytes, + message, null, null, nonce, From ca4742b361e180a370b0b0b7376015d9ae8a2cba Mon Sep 17 00:00:00 2001 From: Alfredo Gallardo Date: Thu, 2 Nov 2023 20:14:55 -0300 Subject: [PATCH 17/17] - fix: ui fixes and improvemens --- .../connec-method-qr-code.tsx | 148 +++++++++--------- .../connect-method-quick-start.tsx | 94 ++++++----- .../connection-method-option.tsx | 4 +- .../src/components/header/header.tsx | 8 +- apps/shinkai-visor/src/lang/en.json | 6 +- apps/shinkai-visor/src/lang/es.json | 24 ++- 6 files changed, 152 insertions(+), 132 deletions(-) diff --git a/apps/shinkai-visor/src/components/connect-method-qr-code/connec-method-qr-code.tsx b/apps/shinkai-visor/src/components/connect-method-qr-code/connec-method-qr-code.tsx index c15d5064f..39edd90fa 100644 --- a/apps/shinkai-visor/src/components/connect-method-qr-code/connec-method-qr-code.tsx +++ b/apps/shinkai-visor/src/components/connect-method-qr-code/connec-method-qr-code.tsx @@ -175,65 +175,69 @@ export const ConnectMethodQrCode = () => { } /> -
-
-
- {qrImageFile && qrImageUrl ? ( -
-
- - {qrImageFile.name} -
-
- qr connection data - + +
+ +
+
+ QR code +
+
+ {qrImageFile && qrImageUrl ? ( +
+
+ + + {qrImageFile.name} + +
+
+ qr connection data + +
+
+ ) : ( + + )}
-
- ) : ( - - )} -
-
- - {qrImageFile && ( - - -
+
+ {qrImageFile && ( + <> { )} /> + + )} - {isSubmitError && ( - - )} -
- - - - )} -
+ {isSubmitError && } +
+ + +
); }; diff --git a/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx b/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx index 69236fb17..e70d4a251 100644 --- a/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx +++ b/apps/shinkai-visor/src/components/connect-method-quick-start/connect-method-quick-start.tsx @@ -116,57 +116,55 @@ export const ConnectMethodQuickStart = () => { className="flex flex-col space-y-2 justify-between" onSubmit={form.handleSubmit(connect)} > -
- ( - - - - - - - - - - )} - /> + ( + + + + + + + + + + )} + /> - ( - - - - - - - - - - )} - /> + ( + + + + + + + + + + )} + /> - ( - - - - - - - - - - )} - /> + ( + + + + + + + + + + )} + /> - {isSubmitError && } -
+ {isSubmitError && }