morgan
/
chatgpt-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Cleaner code in main app

This commit is contained in:
Niek van der Maas 2023-03-23 16:13:55 +01:00
parent 7668c53744
commit f12bfc2b8c
2 changed files with 10 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/App.svelte
View File

@ -6,10 +6,7 @@
import Sidebar from './lib/Sidebar.svelte'
import Footer from './lib/Footer.svelte'
import { apiKeyStorage, chatsStorage } from './lib/Storage.svelte'
$: sortedChats = $chatsStorage.sort((a, b) => b.id - a.id)
$: apiKey = $apiKeyStorage
import { apiKeyStorage } from './lib/Storage.svelte'
// Check if the API key is passed in as a "key" query parameter - if so, save it
const urlParams: URLSearchParams = new URLSearchParams(window.location.search)
@ -24,7 +21,7 @@
<div class="container is-fullhd">
<div class="columns">
<div class="column is-one-fifth">
<Sidebar bind:apiKey bind:sortedChats />
<Sidebar />
</div>
<div class="column is-four-fifths" id="content">
{#key $location}

18
src/lib/Sidebar.svelte
View File

@ -1,12 +1,10 @@
<script lang="ts">
import { params, replace } from 'svelte-spa-router'
import { clearChats } from './Storage.svelte'
import { apiKeyStorage, chatsStorage, clearChats } from './Storage.svelte'
import { exportAsMarkdown } from './Export.svelte'
import type { Chat } from './Types.svelte'
export let sortedChats: Chat[]
export let apiKey: string
$: sortedChats = $chatsStorage.sort((a, b) => b.id - a.id)
$: activeChatId = $params && $params.chatId ? parseInt($params.chatId) : undefined
</script>
@ -15,13 +13,13 @@
<p class="menu-label">Chats</p>
<ul class="menu-list">
{#if sortedChats.length === 0}
<li><a href={'#'}>No chats yet...</a></li>
<li><a href={'#'} class="is-disabled">No chats yet...</a></li>
{:else}
<li>
<ul>
{#each sortedChats as chat}
<li>
<a href={`#/chat/${chat.id}`} class:is-disabled={!apiKey} class:is-active={activeChatId === chat.id}
<a href={`#/chat/${chat.id}`} class:is-disabled={!$apiKeyStorage} class:is-active={activeChatId === chat.id}
>{chat.name || `Chat ${chat.id}`}</a
>
</li>
@ -33,12 +31,12 @@
<p class="menu-label">Actions</p>
<ul class="menu-list">
<li>
<a href={'#/'} class="panel-block" class:is-disabled={!apiKey} class:is-active={!activeChatId}
<a href={'#/'} class="panel-block" class:is-disabled={!$apiKeyStorage} class:is-active={!activeChatId}
><span class="greyscale mr-2">🔑</span> API key</a
>
</li>
<li>
<a href={'#/chat/new'} class="panel-block" class:is-disabled={!apiKey}
<a href={'#/chat/new'} class="panel-block" class:is-disabled={!$apiKeyStorage}
><span class="greyscale mr-2">➕</span> New chat</a
>
</li>
@ -46,7 +44,7 @@
<a
href={'#/'}
class="panel-block"
class:is-disabled={!apiKey}
class:is-disabled={!$apiKeyStorage}
on:click={() => {
replace('#/').then(() => {
clearChats()
@ -59,7 +57,7 @@
<a
href={'#/'}
class="panel-block"
class:is-disabled={!apiKey}
class:is-disabled={!apiKeyStorage}
on:click|preventDefault={() => {
if (activeChatId) {
exportAsMarkdown(activeChatId)