From 555f8bbf08ae3eb33c3dd4a6ccde1e76576f4048 Mon Sep 17 00:00:00 2001 From: Weves Date: Wed, 26 Jul 2023 21:32:49 -0700 Subject: [PATCH] Allow shared files for drive connector --- .../google-drive/ConnectorEditPopup.tsx | 22 +- .../GoogleDriveConnectorsTable.tsx | 14 ++ .../admin/connectors/google-drive/page.tsx | 193 +++++++++++------- web/src/components/admin/connectors/Field.tsx | 32 +++ web/src/lib/types.ts | 1 + 5 files changed, 179 insertions(+), 83 deletions(-) diff --git a/web/src/app/admin/connectors/google-drive/ConnectorEditPopup.tsx b/web/src/app/admin/connectors/google-drive/ConnectorEditPopup.tsx index 1fc6a16b3..cfd27ce5d 100644 --- a/web/src/app/admin/connectors/google-drive/ConnectorEditPopup.tsx +++ b/web/src/app/admin/connectors/google-drive/ConnectorEditPopup.tsx @@ -1,5 +1,8 @@ import { UpdateConnectorForm } from "@/components/admin/connectors/ConnectorForm"; -import { TextArrayFieldBuilder } from "@/components/admin/connectors/Field"; +import { + BooleanFormField, + TextArrayFieldBuilder, +} from "@/components/admin/connectors/Field"; import { XIcon } from "@/components/icons/icons"; import { Connector, GoogleDriveConfig } from "@/lib/types"; import * as Yup from "yup"; @@ -34,10 +37,18 @@ export const ConnectorEditPopup = ({ existingConnector, onSubmit }: Props) => { nameBuilder={googleDriveConnectorNameBuilder} existingConnector={existingConnector} - formBodyBuilder={TextArrayFieldBuilder({ - name: "folder_paths", - label: "Folder Paths", - })} + formBodyBuilder={(values) => ( +
+ {TextArrayFieldBuilder({ + name: "folder_paths", + label: "Folder Paths", + })(values)} + +
+ )} validationSchema={Yup.object().shape({ folder_paths: Yup.array() .of( @@ -46,6 +57,7 @@ export const ConnectorEditPopup = ({ existingConnector, onSubmit }: Props) => { ) ) .required(), + include_shared: Yup.boolean().required(), })} onSubmit={onSubmit} /> diff --git a/web/src/app/admin/connectors/google-drive/GoogleDriveConnectorsTable.tsx b/web/src/app/admin/connectors/google-drive/GoogleDriveConnectorsTable.tsx index eb5568945..6c6c58bd7 100644 --- a/web/src/app/admin/connectors/google-drive/GoogleDriveConnectorsTable.tsx +++ b/web/src/app/admin/connectors/google-drive/GoogleDriveConnectorsTable.tsx @@ -75,6 +75,10 @@ export const GoogleDriveConnectorsTable = ({ header: "Folder Paths", key: "folder_paths", }, + { + header: "Include Shared", + key: "include_shared", + }, { header: "Status", key: "status", @@ -107,6 +111,16 @@ export const GoogleDriveConnectorsTable = ({ ) : ( All Folders ), + include_shared: ( +
+ {connectorIndexingStatus.connector.connector_specific_config + .include_shared ? ( + Yes + ) : ( + No + )} +
+ ), status: ( -

- Fill out the form below to create a connector. We will refresh the - latest documents from Google Drive every 10 minutes. -

-
-

Add Connector

- - nameBuilder={googleDriveConnectorNameBuilder} - source="google_drive" - inputType="poll" - formBodyBuilder={TextArrayFieldBuilder({ - name: "folder_paths", - label: "Folder paths:", - subtext: - "Specify 0 or more folder paths to index! For example, specifying the path " + - "'Engineering/Materials' will cause us to only index all files contained " + - "within the 'Materials' folder within the 'Engineering' folder. " + - "If no folder paths are specified, we will index all documents in your drive.", - })} - validationSchema={Yup.object().shape({ - folder_paths: Yup.array() - .of( - Yup.string().required( - "Please specify a folder path for your google drive e.g. 'Engineering/Materials'" - ) - ) - .required(), - })} - initialValues={{ - folder_paths: [], - }} - refreshFreq={10 * 60} // 10 minutes - onSubmit={async (isSuccess, responseJson) => { - if (isSuccess && responseJson) { - await linkCredential( - responseJson.id, - googleDrivePublicCredential.id - ); - mutate("/api/manage/admin/connector/indexing-status"); - } - }} - /> -
- - ); - } + // if (!googleDriveConnectorIndexingStatus) { + // return ( + // <> + //

+ // Fill out the form below to create a connector. We will refresh the + // latest documents from Google Drive every 10 minutes. + //

+ //
+ //

Add Connector

+ // + // nameBuilder={googleDriveConnectorNameBuilder} + // source="google_drive" + // inputType="poll" + // formBodyBuilder={(values) => ( + //
+ // {TextArrayFieldBuilder({ + // name: "folder_paths", + // label: "Folder Paths", + // subtext: + // "Specify 0 or more folder paths to index! For example, specifying the path " + + // "'Engineering/Materials' will cause us to only index all files contained " + + // "within the 'Materials' folder within the 'Engineering' folder. " + + // "If no folder paths are specified, we will index all documents in your drive.", + // })(values)} + // + //
+ // )} + // validationSchema={Yup.object().shape({ + // folder_paths: Yup.array() + // .of( + // Yup.string().required( + // "Please specify a folder path for your google drive e.g. 'Engineering/Materials'" + // ) + // ) + // .required(), + // include_shared: Yup.boolean().required(), + // })} + // initialValues={{ + // folder_paths: [], + // }} + // refreshFreq={10 * 60} // 10 minutes + // onSubmit={async (isSuccess, responseJson) => { + // if (isSuccess && responseJson) { + // await linkCredential( + // responseJson.id, + // googleDrivePublicCredential.id + // ); + // mutate("/api/manage/admin/connector/indexing-status"); + // } + // }} + // /> + //
+ // + // ); + // } // If the connector has no credential, we will just hit the ^ section. // Leaving this in for now in case we want to change this behavior later @@ -206,42 +218,65 @@ const GoogleDriveConnectorManagement = ({

- Checkout the{" "} - - status page - {" "} - for the latest indexing status. We fetch the latest documents from - Google Drive every 10 minutes. + {googleDriveConnectorIndexingStatuses.length > 0 ? ( + <> + Checkout the{" "} + + status page + {" "} + for the latest indexing status. We fetch the latest documents from + Google Drive every 10 minutes. + + ) : ( +

+ Fill out the form below to create a connector. We will refresh the + latest documents from Google Drive every 10 minutes. +

+ )}

{googleDriveConnectorIndexingStatuses.length > 0 && ( -
Existing Connectors:
+ <> +
Existing Connectors:
+ + + )} + + {googleDriveConnectorIndexingStatuses.length > 0 && ( +

Add New Connector:

)} - -

Add New Connector:

- nameBuilder={(values) => - `GoogleDriveConnector-${ - values.folder_paths && values.folder_paths.join("_") - }` - } + nameBuilder={googleDriveConnectorNameBuilder} source="google_drive" inputType="poll" - formBodyBuilder={TextArrayFieldBuilder({ - name: "folder_paths", - label: "Folder Paths", - subtext: - "Specify 0 or more folder paths to index! For example, specifying the path " + - "'Engineering/Materials' will cause us to only index all files contained " + - "within the 'Materials' folder within the 'Engineering' folder. " + - "If no folder paths are specified, we will index all documents in your drive.", - })} + formBodyBuilder={(values) => ( + <> + {TextArrayFieldBuilder({ + name: "folder_paths", + label: "Folder Paths", + subtext: + "Specify 0 or more folder paths to index! For example, specifying the path " + + "'Engineering/Materials' will cause us to only index all files contained " + + "within the 'Materials' folder within the 'Engineering' folder. " + + "If no folder paths are specified, we will index all documents in your drive.", + })(values)} + + + )} validationSchema={Yup.object().shape({ folder_paths: Yup.array() .of( @@ -250,9 +285,11 @@ const GoogleDriveConnectorManagement = ({ ) ) .required(), + include_shared: Yup.boolean().required(), })} initialValues={{ folder_paths: [], + include_shared: false, }} refreshFreq={10 * 60} // 10 minutes onSubmit={async (isSuccess, responseJson) => { diff --git a/web/src/components/admin/connectors/Field.tsx b/web/src/components/admin/connectors/Field.tsx index a4ddd32bc..5722a9c77 100644 --- a/web/src/components/admin/connectors/Field.tsx +++ b/web/src/components/admin/connectors/Field.tsx @@ -37,6 +37,36 @@ export const TextFormField = ({ ); }; +interface BooleanFormFieldProps { + name: string; + label: string; + subtext?: string; +} + +export const BooleanFormField = ({ + name, + label, + subtext, +}: BooleanFormFieldProps) => { + return ( +
+ + + +
+ ); +}; + interface TextArrayFieldProps { name: string; label: string; @@ -71,6 +101,8 @@ export function TextArrayFieldBuilder({ name={`${name}.${index}`} id={name} className="border bg-slate-700 text-gray-200 border-gray-300 rounded w-full py-2 px-3 mr-2" + // Disable autocomplete since the browser doesn't know how to handle an array of text fields + autoComplete="off" />