diff --git a/src/assets/images/icons/Pin/Active.svg b/src/assets/images/icons/Pin/Active.svg index 6444d4135..95ed20dd1 100644 --- a/src/assets/images/icons/Pin/Active.svg +++ b/src/assets/images/icons/Pin/Active.svg @@ -1,16 +1,12 @@ - - - Pinned - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + diff --git a/src/common/HelpData.tsx b/src/common/HelpData.tsx index feed84a86..c6a90a4d8 100644 --- a/src/common/HelpData.tsx +++ b/src/common/HelpData.tsx @@ -24,8 +24,7 @@ export const triggerInfo: HelpDataProps = { }; export const searchInfo: HelpDataProps = { - heading: - 'Glific provides search functionality to NGO staff to find contacts from a large set of contacts list.', + heading: 'Glific provides search functionality to NGO staff to find contacts from a large set of contacts list.', link: 'https://glific.github.io/docs/docs/Product%20Features/Searches', }; @@ -105,5 +104,5 @@ export const blockedContactsInfo: HelpDataProps = { export const assistantsInfo: HelpDataProps = { heading: 'Assistants can call OpenAI’s models with specific instructions to tune their personality and capabilities. Assistants can access multiple tools in parallel. Assistants can access files in several formats as part of their creation. When using tools, Assistants can also create files (e.g., images, spreadsheets, etc) and cite files they reference in the Messages they create.', - link: 'https://glific.github.io/docs/docs/Product%20Features/Flows/Flow%20Variables/Flow%20variables%20vs%20Contact%20variables', // Replace with the actual Glific documentation link + link: 'https://glific.github.io/docs/docs/Integrations/RAG%20using%20OpenAI%20file%20search%20assistant', // Replace with the actual Glific documentation link }; diff --git a/src/containers/Assistants/AssistantOptions/AssistantOptions.tsx b/src/containers/Assistants/AssistantOptions/AssistantOptions.tsx index 297cf10ef..a0b085377 100644 --- a/src/containers/Assistants/AssistantOptions/AssistantOptions.tsx +++ b/src/containers/Assistants/AssistantOptions/AssistantOptions.tsx @@ -30,7 +30,8 @@ interface AssistantOptionsProps { const temperatureInfo = 'Controls randomness: Lowering results in less random completions. As the temperature approaches zero, the model will become deterministic and repetitive.'; - +const filesInfo = + 'Enables the assistant with knowledge from files that you or your users upload. Once a file is uploaded, the assistant automatically decides when to retrieve content based on user requests.'; export const AssistantOptions = ({ currentId, options, setOptions }: AssistantOptionsProps) => { const [showUploadDialog, setShowUploadDialog] = useState(false); const [files, setFiles] = useState([]); @@ -171,6 +172,11 @@ export const AssistantOptions = ({ currentId, options, setOptions }: AssistantOp
Files +
); }; const getDate = (date: string, fallback: string = '') => ( -
- {date ? dayjs(date).format(STANDARD_DATE_TIME_FORMAT) : fallback} -
+
{date ? dayjs(date).format(STANDARD_DATE_TIME_FORMAT) : fallback}
); const getLastPublished = (date: string, fallback: string = '') => @@ -55,21 +53,7 @@ const getLastPublished = (date: string, fallback: string = '') => ); const getLabel = (tag: any) =>
{tag.label}
; -const displayPinned = (isPinned: boolean) => { - if (isPinned) { - return ; - } - return ''; -}; - -const columnStyles = [ - styles.Pinned, - styles.Name, - styles.DateColumn, - styles.Label, - styles.DateColumn, - styles.Actions, -]; +const columnStyles = [styles.Pinned, styles.Name, styles.DateColumn, styles.Label, styles.DateColumn, styles.Actions]; const flowIcon = ; const queries = { @@ -91,6 +75,7 @@ export const FlowList = () => { const [importing, setImporting] = useState(false); const [importStatus, setImportStatus] = useState([]); const [showDialog, setShowDialog] = useState(false); + const [refreshList, setRefreshList] = useState(false); const [releaseFlow] = useLazyQuery(RELEASE_FLOW); @@ -122,6 +107,8 @@ export const FlowList = () => { }, }); + const [updatePinned] = useMutation(PIN_FLOW); + const handleCopy = (id: any) => { navigate(`/flow/${id}/edit`, { state: 'copy' }); }; @@ -130,8 +117,58 @@ export const FlowList = () => { setFlowName(item.name); exportFlowMutation({ variables: { id } }); }; + + const handlePin = (updateFlowId: any, pin: boolean = false) => { + if (pin) { + updatePinned({ + variables: { + updateFlowId, + input: { + isPinned: true, + }, + }, + onCompleted: () => { + setRefreshList(!refreshList); + setNotification('Flow pinned successfully'); + }, + }); + } else { + updatePinned({ + variables: { + updateFlowId, + input: { + isPinned: false, + }, + }, + onCompleted: () => { + setRefreshList(!refreshList); + setNotification('Flow unpinned successfully'); + }, + }); + } + }; + let dialog; + const displayPinned = (isPinned: boolean, id: any) => { + if (isPinned) { + return ( + + handlePin(id)}> + + + + ); + } + return ( + + handlePin(id, true)}> + + + + ); + }; + if (importStatus.length > 0) { dialog = ( { const additionalAction = () => (filter === 'isTemplate' ? templateFlowActions : actions); - const getColumns = ({ - name, - keywords, - lastChangedAt, - lastPublishedAt, - tag, - roles, - isPinned, - }: any) => ({ - pin: displayPinned(isPinned), + const getColumns = ({ name, keywords, lastChangedAt, lastPublishedAt, tag, roles, isPinned, id }: any) => ({ + pin: displayPinned(isPinned, id), name: getName(name, keywords, roles), lastPublishedAt: getLastPublished(lastPublishedAt, t('Not published yet')), label: tag ? getLabel(tag) : '', @@ -360,6 +389,7 @@ export const FlowList = () => { filterList={activeFilter} loadingList={importing} restrictedAction={restrictedAction} + refreshList={refreshList} /> ); diff --git a/src/graphql/mutations/Flow.ts b/src/graphql/mutations/Flow.ts index 7465c8fc8..aad737027 100644 --- a/src/graphql/mutations/Flow.ts +++ b/src/graphql/mutations/Flow.ts @@ -167,3 +167,18 @@ export const TERMINATE_FLOW = gql` } } `; + +export const PIN_FLOW = gql` + mutation UpdateFlow($updateFlowId: ID!, $input: FlowInput) { + updateFlow(id: $updateFlowId, input: $input) { + errors { + key + message + } + flow { + id + isPinned + } + } + } +`; diff --git a/src/mocks/Flow.tsx b/src/mocks/Flow.tsx index 64d370f16..36ba8d61e 100644 --- a/src/mocks/Flow.tsx +++ b/src/mocks/Flow.tsx @@ -21,6 +21,7 @@ import { IMPORT_FLOW_LOCALIZATIONS, ADD_FLOW_TO_WA_GROUP, CREATE_FLOW, + PIN_FLOW, } from 'graphql/mutations/Flow'; import { GET_ORGANIZATION_SERVICES } from 'graphql/queries/Organization'; import json from './ImportFlow.json'; @@ -753,3 +754,26 @@ export const createTagQuery = { }, }, }; + +export const pinFlowQuery = (updateFlowId: string, pin: boolean = false) => ({ + request: { + query: PIN_FLOW, + variables: { + updateFlowId, + input: { + isPinned: pin, + }, + }, + }, + result: { + data: { + updateFlow: { + errors: null, + flow: { + id: '2', + isPinned: pin, + }, + }, + }, + }, +});