Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ginetta themed frontend and Danswer sync #12

Open
wants to merge 10 commits into
base: ginetta
Choose a base branch
from
Open

Ginetta themed frontend and Danswer sync #12

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
b4ff84c
feat: ask ginetta and logo
brunnolou Apr 16, 2024
9aa892e
feat: add ginetta logo
brunnolou Apr 16, 2024
89fb48e
updates font family
RafaelaMG Apr 16, 2024
23ff864
add dark theme configs
RafaelaMG Apr 17, 2024
06bff94
fix ginetta icon and adds new favicon
RafaelaMG Apr 17, 2024
d0ef849
Merge pull request #4 from ginetta/feat/theming
RafaelaMG Apr 19, 2024
39ff243
Merge branch 'main' into ginetta-frontend
brunnolou May 6, 2024
c80d9cf
feat: use theme colors fix dark mode
brunnolou Apr 22, 2024
fa971b4
feat: adjust colors
brunnolou May 6, 2024
b331d7c
Merge pull request #6 from ginetta/feat/improve-dark-colors
brunnolou May 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified web/public/logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions web/src/app/admin/add-connector/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,10 @@ function SourceTile({ sourceMetadata }: { sourceMetadata: SourceMetadata }) {
w-40
cursor-pointer
bg-hover-light
dark:bg-hover-light-dark
shadow-md
hover:bg-hover
dark:hover:bg-hover-dark
`}
href={sourceMetadata.adminUrl}
>
Expand Down
68 changes: 38 additions & 30 deletions web/src/app/admin/assistants/AssistantEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,9 @@ const DEFAULT_LLM_PROVIDER_TO_DISPLAY_NAME: Record<string, string> = {

function Label({ children }: { children: string | JSX.Element }) {
return (
<div className="block font-medium text-base text-emphasis">{children}</div>
<div className="block font-medium text-base text-emphasis dark:text-emphasis-dark">
{children}
</div>
);
}

Expand Down Expand Up @@ -313,8 +315,8 @@ export function AssistantEditor({
name="task_prompt"
label="Task Prompt (Optional)"
isTextArea={true}
subtext={`Give specific instructions as to what to do with the user query.
For example, "Find any relevant sections from the provided documents that can
subtext={`Give specific instructions as to what to do with the user query.
For example, "Find any relevant sections from the provided documents that can
help the user resolve their issue and explain how they are relevant."`}
onChange={(e) => {
setFieldValue("task_prompt", e.target.value);
Expand Down Expand Up @@ -352,8 +354,8 @@ export function AssistantEditor({
name="disable_retrieval"
label="Disable Retrieval"
subtext={`
If set, the Assistant will not fetch any context documents to aid in the response.
Instead, it will only use the supplied system and task prompts plus the user
If set, the Assistant will not fetch any context documents to aid in the response.
Instead, it will only use the supplied system and task prompts plus the user
query in order to generate a response`}
onChange={(e) => {
setFieldValue("disable_retrieval", e.target.checked);
Expand Down Expand Up @@ -453,9 +455,9 @@ export function AssistantEditor({
name="include_citations"
label="Include Citations"
subtext={`
If set, the response will include bracket citations ([1], [2], etc.)
for each document used by the LLM to help inform the response. This is
the same technique used by the default Assistants. In general, we recommend
If set, the response will include bracket citations ([1], [2], etc.)
for each document used by the LLM to help inform the response. This is
the same technique used by the default Assistants. In general, we recommend
to leave this enabled in order to increase trust in the LLM answer.`}
/>
</>
Expand Down Expand Up @@ -611,7 +613,7 @@ export function AssistantEditor({
className={index === 0 ? "mt-2" : "mt-6"}
>
<div className="flex">
<div className="w-full mr-6 border border-border p-3 rounded">
<div className="w-full mr-6 border border-border dark:border-border-dark p-3 rounded">
<div>
<Label>Name</Label>
<SubLabel>
Expand All @@ -622,13 +624,15 @@ export function AssistantEditor({
<Field
name={`starter_messages[${index}].name`}
className={`
border
border-border
bg-background
rounded
w-full
py-2
px-3
border
border-border
dark:border-border-dark
bg-background
dark:bg-background-dark
rounded
w-full
py-2
px-3
mr-4
`}
autoComplete="off"
Expand All @@ -651,13 +655,15 @@ export function AssistantEditor({
<Field
name={`starter_messages.${index}.description`}
className={`
border
border-border
bg-background
rounded
w-full
py-2
px-3
border
border-border
dark:border-border-dark
bg-background
dark:bg-background-dark
rounded
w-full
py-2
px-3
mr-4
`}
autoComplete="off"
Expand All @@ -682,13 +688,15 @@ export function AssistantEditor({
<Field
name={`starter_messages[${index}].message`}
className={`
border
border-border
bg-background
rounded
w-full
py-2
px-3
border
border-border
dark:border-border-dark
bg-background
dark:bg-background-dark
rounded
w-full
py-2
px-3
mr-4
`}
as="textarea"
Expand Down
4 changes: 2 additions & 2 deletions web/src/app/admin/bot/SlackBotConfigCreationForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -341,8 +341,8 @@ export const SlackBotCreationForm = ({
flex
cursor-pointer ` +
(isSelected
? " bg-hover"
: " bg-background hover:bg-hover-light")
? "bg-hover dark:bg-hover-dark"
: " bg-background hover:bg-hover-light dark:bg-background-dark dark:hover:bg-hover-light-dark")
}
onClick={() => {
if (isSelected) {
Expand Down
8 changes: 6 additions & 2 deletions web/src/app/admin/connector/[ccPairId]/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,9 @@ function Main({ ccPairId }: { ccPairId: number }) {
<>
<BackButton />
<div className="pb-1 flex mt-1">
<h1 className="text-3xl text-emphasis font-bold">{ccPair.name}</h1>
<h1 className="text-3xl text-emphasis dark:text-emphasis-dark font-bold">
{ccPair.name}
</h1>

<div className="ml-auto">
<ModifyStatusButtonCluster ccPair={ccPair} />
Expand All @@ -80,7 +82,9 @@ function Main({ ccPairId }: { ccPairId: number }) {

<div className="text-sm mt-1">
Total Documents Indexed:{" "}
<b className="text-emphasis">{totalDocsIndexed}</b>
<b className="text-emphasis dark:text-emphasis-dark">
{totalDocsIndexed}
</b>
</div>

<Divider />
Expand Down
6 changes: 4 additions & 2 deletions web/src/app/admin/connectors/file/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -195,7 +195,7 @@ const Main = () => {
>
{({ values, isSubmitting }) => (
<Form>
<h2 className="font-bold text-emphasis text-xl mb-2">
<h2 className="font-bold text-emphasis dark:text-emphasis-dark text-xl mb-2">
Upload Files
</h2>
<TextFormField
Expand All @@ -205,7 +205,9 @@ const Main = () => {
autoCompleteDisabled={true}
/>

<p className="mb-1 font-medium text-emphasis">Files:</p>
<p className="mb-1 font-medium text-emphasis dark:text-emphasis-dark">
Files:
</p>
<FileUpload
selectedFiles={selectedFiles}
setSelectedFiles={setSelectedFiles}
Expand Down
4 changes: 2 additions & 2 deletions web/src/app/admin/connectors/google-drive/ConnectorEditPopup.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,12 @@ interface Props {
export const ConnectorEditPopup = ({ existingConnector, onSubmit }: Props) => {
return (
<Modal onOutsideClick={onSubmit}>
<div className="bg-background">
<div className="bg-background dark:bg-background-dark">
<h2 className="text-xl font-bold flex">
Update Google Drive Connector
<div
onClick={onSubmit}
className="ml-auto hover:bg-hover p-1.5 rounded"
className="ml-auto hover:bg-hover dark:hover:bg-hover-dark p-1.5 rounded"
>
<XIcon
size={20}
Expand Down
12 changes: 6 additions & 6 deletions web/src/app/admin/documents/explorer/Explorer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const DocumentDisplay = ({
return (
<div
key={document.document_id}
className="text-sm border-b border-border mb-3"
className="text-sm border-b border-border dark:border-border-dark mb-3"
>
<div className="flex relative">
<a
Expand All @@ -49,7 +49,7 @@ const DocumentDisplay = ({
</a>
</div>
<div className="flex flex-wrap gap-x-2 mt-1 text-xs">
<div className="px-1 py-0.5 bg-hover rounded flex">
<div className="px-1 py-0.5 bg-hover dark:bg-hover:dark rounded flex">
<p className="mr-1 my-auto">Boost:</p>
<ScoreSection
documentId={document.document_id}
Expand All @@ -76,7 +76,7 @@ const DocumentDisplay = ({
});
}
}}
className="px-1 py-0.5 bg-hover hover:bg-hover-light rounded flex cursor-pointer select-none"
className="px-1 py-0.5 bg-hover dark:bg-hover-dark hover:bg-hover-light dark:hover:bg-hover-light-dark rounded flex cursor-pointer select-none"
>
<div className="my-auto">
{document.hidden ? (
Expand Down Expand Up @@ -160,7 +160,7 @@ export function Explorer({
<div>
{popup}
<div className="justify-center py-2">
<div className="flex items-center w-full border-2 border-border rounded-lg px-4 py-2 focus-within:border-accent">
<div className="flex items-center w-full border-2 border-border dark:border-border-dark rounded-lg px-4 py-2 focus-within:border-accent">
<MagnifyingGlass />
<textarea
autoFocus
Expand All @@ -181,7 +181,7 @@ export function Explorer({
suppressContentEditableWarning={true}
/>
</div>
<div className="mt-4 border-b border-border">
<div className="mt-4 border-b border-border dark:border-border-dark">
<HorizontalFilters
{...filterManager}
availableDocumentSets={documentSets}
Expand All @@ -205,7 +205,7 @@ export function Explorer({
</div>
)}
{!query && (
<div className="flex text-emphasis mt-3">
<div className="flex text-emphasis dark:text-emphasis-dark mt-3">
Search for a document above to modify it&apos;s boost or hide it from
searches.
</div>
Expand Down
12 changes: 7 additions & 5 deletions web/src/app/admin/documents/sets/DocumentSetCreationForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -136,12 +136,13 @@ export const DocumentSetCreationForm = ({
rounded-lg
border
border-border
dark:border-border-dark
w-fit
flex
cursor-pointer ` +
(isSelected
? " bg-background-strong"
: " hover:bg-hover")
? " bg-background-strong dark:bg-background-strong-dark"
: " hover:bg-hover dark:hover:bg-hover-dark")
}
onClick={() => {
if (isSelected) {
Expand Down Expand Up @@ -211,13 +212,14 @@ export const DocumentSetCreationForm = ({
py-1
rounded-lg
border
border-border
border-border
dark:border-border-dark
w-fit
flex
cursor-pointer ` +
(isSelected
? " bg-background-strong"
: " hover:bg-hover")
? " bg-background-strong dark:bg-background-strong-dark"
: " hover:bg-hover dark:hover:bg-hover-dark")
}
onClick={() => {
if (isSelected) {
Expand Down
8 changes: 4 additions & 4 deletions web/src/app/admin/documents/sets/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,14 +42,14 @@ const EditRow = ({ documentSet }: { documentSet: DocumentSet }) => {
return (
<div className="relative flex">
{isSyncingTooltipOpen && (
<div className="flex flex-nowrap absolute w-72 top-0 left-0 mt-8 border border-border bg-background px-3 py-2 rounded shadow-lg z-40">
<div className="flex flex-nowrap absolute w-72 top-0 left-0 mt-8 border border-border dark:border-border-dark bg-background dark:bg-background-dark px-3 py-2 rounded shadow-lg z-40">
<InfoIcon className="mt-1 flex flex-shrink-0 mr-2" /> Cannot update
while syncing! Wait for the sync to finish, then try again.
</div>
)}
<div
className={
"text-emphasis font-medium my-auto p-1 hover:bg-hover-light flex cursor-pointer select-none" +
"text-emphasis dark:text-emphasis-dark font-medium my-auto p-1 hover:bg-hover-light dark:hover:bg-hover-dark flex cursor-pointer select-none" +
(documentSet.is_up_to_date ? " cursor-pointer" : " cursor-default")
}
onClick={() => {
Expand All @@ -68,7 +68,7 @@ const EditRow = ({ documentSet }: { documentSet: DocumentSet }) => {
}
}}
>
<FiEdit className="text-emphasis mr-1 my-auto" />
<FiEdit className="text-emphasis dark:text-emphasis-dark mr-1 my-auto" />
{documentSet.name}
</div>
</div>
Expand Down Expand Up @@ -119,7 +119,7 @@ const DocumentSetTable = ({
return (
<TableRow key={documentSet.id}>
<TableCell className="whitespace-normal break-all">
<div className="flex gap-x-1 text-emphasis">
<div className="flex gap-x-1 text-emphasis dark:text-emphasis-dark">
<EditRow documentSet={documentSet} />
</div>
</TableCell>
Expand Down
2 changes: 1 addition & 1 deletion web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ export function CCPairIndexingStatusTable({
<TableRow
key={ccPairsIndexingStatus.cc_pair_id}
className={
"hover:bg-hover-light bg-background cursor-pointer relative"
"hover:bg-hover-light dark:hover:bg-hover-light-dark bg-background dark:bg-background-dark cursor-pointer relative"
}
>
<TableCell>
Expand Down
5 changes: 4 additions & 1 deletion web/src/app/admin/models/embedding/ModelSelector.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export function ModelOption({
return (
<div
className={
"p-2 border border-border rounded shadow-md bg-hover-light w-96 flex flex-col"
"p-2 border border-border dark:border-border-dark rounded shadow-md bg-hover-light dark:bg-hover-light-dark w-96 flex flex-col"
}
>
<div className="font-bold text-lg flex">
Expand Down Expand Up @@ -49,10 +49,13 @@ export function ModelOption({
p-2
rounded-lg
bg-background
dark:bg-background-dark
border
border-border
dark:border-border-dark
cursor-pointer
hover:bg-hover
dark:hover:bg-hover-dark
text-sm
mt-auto`}
onClick={() => onSelect(model)}
Expand Down
15 changes: 12 additions & 3 deletions web/src/app/auth/login/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,12 +69,21 @@ const Page = async ({
</div>
<div className="min-h-screen flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
<div>
<div className="h-16 w-16 mx-auto">
<Image src="/logo.png" alt="Logo" width="1419" height="1520" />
<div className="h-16 w-16 mx-auto text-inverted-dark dark:text-inverted">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 400 400"
width="100%"
>
<path
d="M200 216.2c-35.9 0-65-29.1-65-65s29.1-65 65-65 65 29.1 65 65-29.1 65-65 65m0 97.6c-35.9 0-65-29.1-65-65h130c0 35.8-29.1 65-65 65"
fill="currentColor"
/>
</svg>
</div>
{authUrl && authTypeMetadata && (
<>
<h2 className="text-center text-xl text-strong font-bold mt-6">
<h2 className="text-center text-xl text-strong dark:text-strong-dark font-bold mt-6">
Log In to Danswer
</h2>

Expand Down
Loading