From d906c72e8bdb63c28a1fcf4045e7275d2939bfbc Mon Sep 17 00:00:00 2001 From: Silas Date: Sat, 8 Apr 2023 19:30:34 -0400 Subject: [PATCH] add chat and about page, style everything, let user upload a file and have server return string array of the file's text contents chunked by 4k characters --- .vscode/settings.json | 3 + src/lib/shared/stores/prompt.ts | 5 ++ src/routes/+layout.svelte | 30 ++------- src/routes/+page.svelte | 111 +++++++++++++------------------- src/routes/+server.ts | 35 ++++++++++ src/routes/about/+page.svelte | 13 ++++ src/routes/chat/+page.svelte | 10 +++ tailwind.config.cjs | 15 +++-- 8 files changed, 127 insertions(+), 95 deletions(-) create mode 100644 src/lib/shared/stores/prompt.ts create mode 100644 src/routes/+server.ts create mode 100644 src/routes/about/+page.svelte create mode 100644 src/routes/chat/+page.svelte diff --git a/.vscode/settings.json b/.vscode/settings.json index efe2500..a9422a3 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,5 +1,8 @@ { "prettier.documentSelectors": ["**/*.svelte"], + "[svelte]": { + "editor.defaultFormatter": "svelte.svelte-vscode" + }, "tailwindCSS.classAttributes": [ "class", "accent", diff --git a/src/lib/shared/stores/prompt.ts b/src/lib/shared/stores/prompt.ts new file mode 100644 index 0000000..196f724 --- /dev/null +++ b/src/lib/shared/stores/prompt.ts @@ -0,0 +1,5 @@ +import { writable } from 'svelte/store'; + +const prompt = writable(JSON.stringify([])); + +export default prompt; diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index b28ae89..2d1931b 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,4 +1,4 @@ -
-
-

Welcome to Skeleton.

- -
-
- +

Please Sumi

+

Select the text file you'd like to have summarized.

+ +
+ - - -
- -
- - Launch Documentation - -
-
-

Try editing the following:

-

/src/routes/+layout.svelte

-

/src/routes/+page.svelte

- - diff --git a/src/routes/+server.ts b/src/routes/+server.ts new file mode 100644 index 0000000..e224903 --- /dev/null +++ b/src/routes/+server.ts @@ -0,0 +1,35 @@ +import { fail } from '@sveltejs/kit'; +import type { RequestHandler } from './$types'; + +const parseFile = async (file: Blob) => { + const fileSize = file.size; + const chunkSize = 4000; + const chunks = Math.ceil(fileSize / chunkSize); + const convoArray: string[] = []; + const decoder = new TextDecoder(); + + for (let i = 0; i < chunks; i++) { + const start = i * chunkSize; + const end = Math.min(start + chunkSize, fileSize); + const buffer = await file.slice(start, end).arrayBuffer(); + const text = decoder.decode(buffer); + convoArray.push(text); + } + return convoArray; +}; + +export const POST = (async ({ request, url }) => { + try { + const data = Object.fromEntries(await request.formData()); + const file = data.file as Blob; + const conversation = await parseFile(file); + + return new Response(JSON.stringify(conversation), { + headers: { + 'Content-Type': 'application/json' + } + }); + } catch (err) { + throw fail(500, { err: err }); + } +}) satisfies RequestHandler; diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte new file mode 100644 index 0000000..9f110e2 --- /dev/null +++ b/src/routes/about/+page.svelte @@ -0,0 +1,13 @@ +
+

what dis?

+

+ ChatGPT has a limit of ~4k characters per prompt, so to ask questions about a large body of text + would require that you split the text in 4k chunks. +

+

+ With Sumi, you can simply upload the entire document as a text file, and it will handle + everything else. +

+
diff --git a/src/routes/chat/+page.svelte b/src/routes/chat/+page.svelte new file mode 100644 index 0000000..4707a17 --- /dev/null +++ b/src/routes/chat/+page.svelte @@ -0,0 +1,10 @@ + + +
{currentPrompt}
diff --git a/tailwind.config.cjs b/tailwind.config.cjs index 837b732..9a38ac9 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -1,9 +1,16 @@ /** @type {import('tailwindcss').Config} */ module.exports = { darkMode: 'class', - content: ['./src/**/*.{html,js,svelte,ts}', require('path').join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}')], + content: [ + './src/**/*.{html,js,svelte,ts}', + require('path').join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}') + ], theme: { - extend: {}, + extend: {} }, - plugins: [require('@tailwindcss/forms'),require('@tailwindcss/typography'),...require('@skeletonlabs/skeleton/tailwind/skeleton.cjs')()], -} + plugins: [ + require('@tailwindcss/forms'), + require('@tailwindcss/typography'), + ...require('@skeletonlabs/skeleton/tailwind/skeleton.cjs')() + ] +};