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

Better API key saving and checks

This commit is contained in:
Niek van der Maas 2023-03-03 11:18:28 +01:00
parent e9990ae9f7
commit 5993c832ea
1 changed files with 25 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/App.svelte
View File

@ -30,12 +30,13 @@
<div class="column is-one-fifth"> <div class="column is-one-fifth">
<article class="panel is-link"> <article class="panel is-link">
<p class="panel-heading">Chats</p> <p class="panel-heading">Chats</p>
{#if sortedChats.length === 0 || !apiKey} {#if sortedChats.length === 0}
<a class="panel-block">No chats...</a> <a class="panel-block">No chats...</a>
{:else} {:else}
{#each sortedChats as chat} {#each sortedChats as chat}
<a class="panel-block" on:click={() => (activeChatId = chat.id)} <a
>Chat {chat.id}</a class="panel-block {!apiKey ? 'is-disabled' : ''}"
on:click={() => (activeChatId = chat.id)}>Chat {chat.id}</a
> >
{/each} {/each}
{/if} {/if}
@ -73,8 +74,8 @@
><a href="https://github.com/Niek/chatgpt-web">ChatGPT-web</a ><a href="https://github.com/Niek/chatgpt-web">ChatGPT-web</a
></strong ></strong
> >
is a simple one-page web interface to the OpenAI ChatGPT API. To is a simple one-page web interface to the OpenAI ChatGPT API. To use
use it, you need to register for it, you need to register for
<a <a
href="https://platform.openai.com/account/api-key" href="https://platform.openai.com/account/api-key"
target="_blank" target="_blank"
@ -88,15 +89,25 @@
<article class="message {!apiKey ? 'is-danger' : 'is-warning'}"> <article class="message {!apiKey ? 'is-danger' : 'is-warning'}">
<div class="message-body"> <div class="message-body">
Set your OpenAI API key below: Set your OpenAI API key below:
<input
type="text" <form
class="input {!apiKey ? 'is-danger' : ''}" class="field has-addons has-addons-right"
value={apiKey} on:submit|preventDefault={(event) => {
on:change={(event) => { apiKeyStorage.set(event.target[0].value);
// @ts-ignore
apiKeyStorage.set(event.target.value);
}} }}
/> >
<p class="control is-expanded">
<input
type="text"
class="input {!apiKey ? 'is-danger' : ''}"
value={apiKey}
/>
</p>
<p class="control">
<button class="button is-info" type="submit">Save</button>
</p>
</form>
{#if !apiKey} {#if !apiKey}
<p class="help is-danger"> <p class="help is-danger">
Please enter your OpenAI API key above to use ChatGPT-web Please enter your OpenAI API key above to use ChatGPT-web
@ -107,6 +118,7 @@
<article class="message is-info"> <article class="message is-info">
<div class="message-body"> <div class="message-body">
Select an existing chat on the sidebar, or <a Select an existing chat on the sidebar, or <a
class={!apiKey ? "is-disabled" : ""}
on:click={() => { on:click={() => {
activeChatId = addChat(); activeChatId = addChat();
}}>create a new chat</a }}>create a new chat</a