Skip to content

Commit

Permalink
Addressing craig's UX feedback
Browse files Browse the repository at this point in the history 
Signed-off-by: Daishan Peng <[email protected]>
  • Loading branch information
@StrongMonkey
StrongMonkey committed Sep 13, 2024
1 parent 24915cf commit 5254c8f
Show file tree
Hide file tree
Showing 4 changed files with 106 additions and 91 deletions.
11 changes: 11 additions & 0 deletions actions/knowledge/onedrive.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,17 @@ export async function syncSharedLink(link: string): Promise<void> {
return;
}

export async function clearOneDriveFiles(): Promise<void> {
const dir = path.join(
WORKSPACE_DIR(),
'knowledge',
'integrations',
'onedrive'
);
const externalLinkFile = path.join(dir, 'externalLinks.json');
fs.rmSync(externalLinkFile, { recursive: true, force: true });
}

export async function runOneDriveSync(authed: boolean): Promise<void> {
return runSyncTool(authed, 'onedrive');
}
48 changes: 47 additions & 1 deletion components/edit/configure.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import {
useDisclosure,
} from '@nextui-org/react';
import { useRouter } from 'next/navigation';
import { useCallback, useContext } from 'react';
import { useCallback, useContext, useState } from 'react';
import { GoLightBulb, GoTrash } from 'react-icons/go';
import { HiCog } from 'react-icons/hi2';
import { IoMdAdd, IoMdRefresh } from 'react-icons/io';
Expand All @@ -32,6 +32,8 @@ import FileModal from '@/components/knowledge/FileModal';
import { gatewayTool } from '@/actions/knowledge/util';
import { importFiles } from '@/actions/knowledge/filehelper';
import { DiOnedrive } from 'react-icons/di';
import { FileDetail } from '@/model/knowledge';
import { runSyncTool } from '@/actions/knowledge/tool';

interface ConfigureProps {
collapsed?: boolean;
Expand Down Expand Up @@ -61,6 +63,7 @@ const Configure: React.FC<ConfigureProps> = ({ collapsed }) => {
ingestionError,
} = useContext(EditContext);
const { restartScript } = useContext(ChatContext);
const [syncing, setSyncing] = useState(false);
const fileSettingModal = useDisclosure();
const addFileModal = useDisclosure();

Expand Down Expand Up @@ -101,6 +104,34 @@ const Configure: React.FC<ConfigureProps> = ({ collapsed }) => {
return root.name && root.name.length > 0 ? root.name : 'your assistant';
};

const hasUpstreamFiles = (droppedFiles: Map<string, FileDetail>): boolean => {
return Array.from(droppedFiles.values()).some(
(file) => file.type === 'notion' || file.type === 'onedrive'
);
};

const syncUpstreamFiles = async () => {
setSyncing(true);
const hasNotion = Array.from(droppedFiles.values()).some(
(file) => file.type === 'notion'
);
const hasOnedrive = Array.from(droppedFiles.values()).some(
(file) => file.type === 'onedrive'
);
try {
if (hasNotion) {
await runSyncTool(true, 'notion');
}
if (hasOnedrive) {
await runSyncTool(true, 'onedrive');
}
} catch (error) {
console.error(error);
} finally {
setSyncing(false);
}
};

if (loading)
return <Loading>{`Loading your assistant's details...`}</Loading>;

Expand Down Expand Up @@ -282,6 +313,20 @@ const Configure: React.FC<ConfigureProps> = ({ collapsed }) => {
>
Add Files
</Button>
{hasUpstreamFiles(droppedFiles) && (
<Button
className="w-full"
variant="flat"
color="primary"
isIconOnly
size="sm"
isLoading={syncing}
startContent={!syncing && <IoMdRefresh className="mr-2" />}
onPress={syncUpstreamFiles}
>
Sync Files
</Button>
)}
</div>
</AccordionItem>
<AccordionItem
Expand Down Expand Up @@ -338,6 +383,7 @@ const Configure: React.FC<ConfigureProps> = ({ collapsed }) => {
</AccordionItem>
</Accordion>
</div>

<div className="w-full justify-end items-center px-2 flex gap-2 mb-6">
<Button
color="primary"
Expand Down
20 changes: 2 additions & 18 deletions components/knowledge/Notion.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ import {
TableRow,
} from '@nextui-org/react';
import React, { useContext, useEffect, useState } from 'react';
import { IoMdRefresh } from 'react-icons/io';
import {
getNotionFiles,
isNotionConfigured,
Expand Down Expand Up @@ -139,15 +138,6 @@ export const NotionFileModal = ({
</div>

<div className="flex items-center justify-end p-2">
<Button
isLoading={isSyncing}
size="sm"
color="primary"
startContent={!isSyncing && <IoMdRefresh />}
onClick={syncNotion}
>
{!isSyncing && 'Sync'}
</Button>
{syncError && (
<p className="text-sm text-red-500 ml-2">{syncError}</p>
)}
Expand All @@ -165,7 +155,7 @@ export const NotionFileModal = ({
}}
startContent={<CiSearch />}
/>
{notionConfigured && notionFiles.size > 0 ? (
{notionConfigured && notionFiles.size > 0 && (
<div className="flex flex-col gap-1">
<Table
selectionMode="multiple"
Expand Down Expand Up @@ -223,12 +213,6 @@ export const NotionFileModal = ({
</TableBody>
</Table>
</div>
) : (
<div className="flex items-center justify-center h-full">
<p className="text-sm text-zinc-500">
{`Click the "Sync" button to sync your Notion files`}
</p>
</div>
)}
</ModalBody>
<ModalFooter>
Expand All @@ -238,7 +222,7 @@ export const NotionFileModal = ({
size="sm"
onClick={onClickImport}
>
Import
Add to Knowledge
</Button>
</ModalFooter>
</ModalContent>
Expand Down
118 changes: 46 additions & 72 deletions components/knowledge/OneDrive.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ import {
useDisclosure,
} from '@nextui-org/react';
import React, { useContext, useEffect, useState } from 'react';
import { IoMdRefresh } from 'react-icons/io';
import {
clearOneDriveFiles,
getOneDriveFiles,
isOneDriveConfigured,
runOneDriveSync,
Expand All @@ -28,7 +28,6 @@ import { EditContext } from '@/contexts/edit';
import { importFiles } from '@/actions/knowledge/filehelper';
import { Link } from '@nextui-org/react';
import { syncFiles } from '@/actions/knowledge/tool';
import { BiPlus } from 'react-icons/bi';

interface OnedriveFileModalProps {
isOpen: boolean;
Expand All @@ -54,8 +53,8 @@ export const OnedriveFileModal = ({
const { droppedFiles, ensureImportedFiles } = useContext(EditContext);
const [searchQuery, setSearchQuery] = useState<string>('');
const [importing, setImporting] = useState(false);
const externalLinkModal = useDisclosure();
const [sharedLink, setSharedLink] = useState<string>('');
const [isClearing, setIsClearing] = useState(false);

const [onedriveFiles, setOnedriveFiles] = useState<
Map<string, { url: string; fileName: string; displayName: string }>
Expand Down Expand Up @@ -99,7 +98,6 @@ export const OnedriveFileModal = ({
};

const syncOnedrive = async () => {
setIsSyncing(true);
try {
const isConfigured = await isOneDriveConfigured();
await runOneDriveSync(isConfigured);
Expand All @@ -108,8 +106,6 @@ export const OnedriveFileModal = ({
setSyncError('');
} catch (e) {
setSyncError((e as Error).toString());
} finally {
setIsSyncing(false);
}
};

Expand All @@ -121,9 +117,8 @@ export const OnedriveFileModal = ({
}
};

const addSharedLink = async () => {
const load = async () => {
setIsSyncing(true);
externalLinkModal.onClose();
try {
await syncSharedLink(sharedLink);
setOnedriveFiles(await getOneDriveFiles());
Expand All @@ -135,6 +130,18 @@ export const OnedriveFileModal = ({
}
};

const clear = async () => {
setIsClearing(true);
try {
await clearOneDriveFiles();
syncOnedrive();
} catch (e) {
setSyncError((e as Error).toString());
} finally {
setIsClearing(false);
}
};

return (
<>
<Modal
Expand All @@ -158,46 +165,46 @@ export const OnedriveFileModal = ({
<p className="ml-2">Onedrive</p>
</div>

<div className="flex items-center justify-end p-2">
<div className="justify-end flex">
<Input
className="w-[40vh] flex justify-end ml-2"
size="sm"
placeholder="Enter your document link"
value={sharedLink}
onChange={(e) => {
setSharedLink(e.target.value);
}}
/>
<Button
className="ml-2"
size="sm"
variant="flat"
color="primary"
isLoading={isSyncing}
startContent={!isSyncing && <IoMdRefresh />}
onClick={syncOnedrive}
onClick={load}
>
Load
</Button>
<Button
className="ml-2"
size="sm"
color="primary"
variant="flat"
isLoading={isClearing}
onClick={clear}
>
{!isSyncing && 'Sync'}
Clear
</Button>
{syncError && (
<p className="text-sm text-red-500 ml-2">{syncError}</p>
)}
</div>
</div>
<div className="flex items-center justify-end p-2">
{syncError && (
<p className="text-sm text-red-500 ml-2">{syncError}</p>
)}
</div>
</ModalHeader>
<ModalBody>
<div className="justify-between flex">
<Input
className="w-[20%] flex justify-end"
placeholder="Search"
size="sm"
value={searchQuery}
onChange={(e) => {
setSearchQuery(e.target.value);
}}
startContent={<CiSearch />}
/>
<Button
isIconOnly
size="sm"
color="primary"
startContent={<BiPlus />}
onClick={() => {
externalLinkModal.onOpen();
}}
/>
</div>

{onedriveConfigured && onedriveFiles.size > 0 ? (
{onedriveConfigured && onedriveFiles.size > 0 && (
<div className="flex flex-col gap-1">
<Table
selectionMode="multiple"
Expand Down Expand Up @@ -255,12 +262,6 @@ export const OnedriveFileModal = ({
</TableBody>
</Table>
</div>
) : (
<div className="flex items-center justify-center h-full">
<p className="text-sm text-zinc-500">
{`Click the "Sync" button to sync your Onedrive files`}
</p>
</div>
)}
</ModalBody>
<ModalFooter>
Expand All @@ -270,34 +271,7 @@ export const OnedriveFileModal = ({
size="sm"
onClick={onClickImport}
>
Import
</Button>
</ModalFooter>
</ModalContent>
</Modal>
<Modal
isOpen={externalLinkModal.isOpen}
onClose={externalLinkModal.onClose}
>
<ModalContent>
<ModalHeader>Shared Link</ModalHeader>
<ModalBody>
<Input
placeholder={'Add shared link for documents'}
value={sharedLink}
onChange={(e) => setSharedLink(e.target.value)}
/>
</ModalBody>
<ModalFooter>
<Button
color="primary"
disabled={isSyncing}
size="sm"
onClick={() => {
addSharedLink();
}}
>
Add
Add to Knowledge
</Button>
</ModalFooter>
</ModalContent>
Expand Down

0 comments on commit 5254c8f

Please sign in to comment.