Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-02-27 21:04:08 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Feat/startup config api (#518)

Browse source 
* feat: add api for config

* feat: add data service to client

* feat: update client pages with values from config endpoint

* test: update tests

* Update configurations and documentation to remove VITE_SHOW_GOOGLE_LOGIN_OPTION and change VITE_APP_TITLE to APP_TITLE

* include APP_TITLE with startup config

* Add test for new route

* update backend-review pipeline

* comment out test until we can figure out testing routes in CI

* update: .env.example

---------

Co-authored-by: fuegovic <32828263+fuegovic@users.noreply.github.com>
This commit is contained in:
Dan Orlando 2023-06-15 09:36:34 -07:00 • committed by GitHub
parent 2da81db440
commit 3634d8691a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
25 changed files with 419 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

113
client/src/components/ui/Landing.tsx Normal file
View file

@ -0,0 +1,113 @@
import React from 'react';
import { useRecoilValue, useSetRecoilState } from 'recoil';
import useDocumentTitle from '~/hooks/useDocumentTitle';
import SunIcon from '../svg/SunIcon';
import LightningIcon from '../svg/LightningIcon';
import CautionIcon from '../svg/CautionIcon';
import store from '~/store';
import { useGetStartupConfig } from '~/data-provider';
export default function Landing() {
const { data: config } = useGetStartupConfig();
const setText = useSetRecoilState(store.text);
const conversation = useRecoilValue(store.conversation);
// @ts-ignore TODO: Fix anti-pattern - requires refactoring conversation store
const { title = 'New Chat' } = conversation || {};
useDocumentTitle(title);
const clickHandler = (e: React.MouseEvent<HTMLButtonElement>) => {
e.preventDefault();
const { innerText } = e.target as HTMLButtonElement;
const quote = innerText.split('"')[1].trim();
setText(quote);
};
return (
<div className="flex h-full flex-col items-center overflow-y-auto pt-0 text-sm dark:bg-gray-800">
<div className="w-full px-6 text-gray-800 dark:text-gray-100 md:flex md:max-w-2xl md:flex-col lg:max-w-3xl">
<h1
id="landing-title"
className="mb-10 ml-auto mr-auto mt-6 flex items-center justify-center gap-2 text-center text-4xl font-semibold sm:mb-16 md:mt-[10vh]"
>
{config?.appTitle || 'LibreChat'}
</h1>
<div className="items-start gap-3.5 text-center md:flex">
<div className="mb-8 flex flex-1 flex-col gap-3.5 md:mb-auto">
<h2 className="m-auto flex items-center gap-3 text-lg font-normal md:flex-col md:gap-2">
<SunIcon />
Examples
</h2>
<ul className="m-auto flex w-full flex-col gap-3.5 sm:max-w-md">
<button
onClick={clickHandler}
className="w-full rounded-md bg-gray-50 p-3 hover:bg-gray-200 dark:bg-white/5 dark:hover:bg-gray-900"
>
&quot;Explain quantum computing in simple terms&quot; →
</button>
<button
onClick={clickHandler}
className="w-full rounded-md bg-gray-50 p-3 hover:bg-gray-200 dark:bg-white/5 dark:hover:bg-gray-900"
>
&quot;Got any creative ideas for a 10 year old&apos;s birthday?&quot; →
</button>
<button
onClick={clickHandler}
className="w-full rounded-md bg-gray-50 p-3 hover:bg-gray-200 dark:bg-white/5 dark:hover:bg-gray-900"
>
&quot;How do I make an HTTP request in Javascript?&quot; →
</button>
</ul>
</div>
<div className="mb-8 flex flex-1 flex-col gap-3.5 md:mb-auto">
<h2 className="m-auto flex items-center gap-3 text-lg font-normal md:flex-col md:gap-2">
<LightningIcon />
Capabilities
</h2>
<ul className="m-auto flex w-full flex-col gap-3.5 sm:max-w-md">
<li className="w-full rounded-md bg-gray-50 p-3 dark:bg-white/5">
Remembers what user said earlier in the conversation
</li>
<li className="w-full rounded-md bg-gray-50 p-3 dark:bg-white/5">
Allows user to provide follow-up corrections
</li>
<li className="w-full rounded-md bg-gray-50 p-3 dark:bg-white/5">
Trained to decline inappropriate requests
</li>
</ul>
</div>
<div className="mb-8 flex flex-1 flex-col gap-3.5 md:mb-auto">
<h2 className="m-auto flex items-center gap-3 text-lg font-normal md:flex-col md:gap-2">
<CautionIcon />
Limitations
</h2>
<ul className="m-auto flex w-full flex-col gap-3.5 sm:max-w-md">
<li className="w-full rounded-md bg-gray-50 p-3 dark:bg-white/5">
May occasionally generate incorrect information
</li>
<li className="w-full rounded-md bg-gray-50 p-3 dark:bg-white/5">
May occasionally produce harmful instructions or biased content
</li>
<li className="w-full rounded-md bg-gray-50 p-3 dark:bg-white/5">
Limited knowledge of world and events after 2021
</li>
</ul>
</div>
</div>
{/* {!showingTemplates && (
<div className="mt-8 mb-4 flex flex-col items-center gap-3.5 md:mt-16">
<button
onClick={showTemplates}
className="btn btn-neutral justify-center gap-2 border-0 md:border"
>
<ChatIcon />
Show Prompt Templates
</button>
</div>
)}
{!!showingTemplates && <Templates showTemplates={showTemplates}/>} */}
{/* <div className="group h-32 w-full flex-shrink-0 dark:border-gray-900/50 dark:bg-gray-800 md:h-48" /> */}
</div>
</div>
);
}