Initial commit

dify_1.0.1/web/context/app-context.tsx

@@ -0,0 +1,159 @@
+'use client'
+
+import { createRef, useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import useSWR from 'swr'
+import { createContext, useContext, useContextSelector } from 'use-context-selector'
+import type { FC, ReactNode } from 'react'
+import { fetchAppList } from '@/service/apps'
+import Loading from '@/app/components/base/loading'
+import { fetchCurrentWorkspace, fetchLanggeniusVersion, fetchUserProfile, getSystemFeatures } from '@/service/common'
+import type { App } from '@/types/app'
+import type { ICurrentWorkspace, LangGeniusVersionResponse, UserProfileResponse } from '@/models/common'
+import MaintenanceNotice from '@/app/components/header/maintenance-notice'
+import type { SystemFeatures } from '@/types/feature'
+import { defaultSystemFeatures } from '@/types/feature'
+
+export type AppContextValue = {
+  apps: App[]
+  systemFeatures: SystemFeatures
+  mutateApps: VoidFunction
+  userProfile: UserProfileResponse
+  mutateUserProfile: VoidFunction
+  currentWorkspace: ICurrentWorkspace
+  isCurrentWorkspaceManager: boolean
+  isCurrentWorkspaceOwner: boolean
+  isCurrentWorkspaceEditor: boolean
+  isCurrentWorkspaceDatasetOperator: boolean
+  mutateCurrentWorkspace: VoidFunction
+  pageContainerRef: React.RefObject<HTMLDivElement>
+  langeniusVersionInfo: LangGeniusVersionResponse
+  useSelector: typeof useSelector
+  isLoadingCurrentWorkspace: boolean
+}
+
+const initialLangeniusVersionInfo = {
+  current_env: '',
+  current_version: '',
+  latest_version: '',
+  release_date: '',
+  release_notes: '',
+  version: '',
+  can_auto_update: false,
+}
+
+const initialWorkspaceInfo: ICurrentWorkspace = {
+  id: '',
+  name: '',
+  plan: '',
+  status: '',
+  created_at: 0,
+  role: 'normal',
+  providers: [],
+  in_trail: true,
+}
+
+const AppContext = createContext<AppContextValue>({
+  systemFeatures: defaultSystemFeatures,
+  apps: [],
+  mutateApps: () => { },
+  userProfile: {
+    id: '',
+    name: '',
+    email: '',
+    avatar: '',
+    avatar_url: '',
+    is_password_set: false,
+  },
+  currentWorkspace: initialWorkspaceInfo,
+  isCurrentWorkspaceManager: false,
+  isCurrentWorkspaceOwner: false,
+  isCurrentWorkspaceEditor: false,
+  isCurrentWorkspaceDatasetOperator: false,
+  mutateUserProfile: () => { },
+  mutateCurrentWorkspace: () => { },
+  pageContainerRef: createRef(),
+  langeniusVersionInfo: initialLangeniusVersionInfo,
+  useSelector,
+  isLoadingCurrentWorkspace: false,
+})
+
+export function useSelector<T>(selector: (value: AppContextValue) => T): T {
+  return useContextSelector(AppContext, selector)
+}
+
+export type AppContextProviderProps = {
+  children: ReactNode
+}
+
+export const AppContextProvider: FC<AppContextProviderProps> = ({ children }) => {
+  const pageContainerRef = useRef<HTMLDivElement>(null)
+
+  const { data: appList, mutate: mutateApps } = useSWR({ url: '/apps', params: { page: 1, limit: 30, name: '' } }, fetchAppList)
+  const { data: userProfileResponse, mutate: mutateUserProfile } = useSWR({ url: '/account/profile', params: {} }, fetchUserProfile)
+  const { data: currentWorkspaceResponse, mutate: mutateCurrentWorkspace, isLoading: isLoadingCurrentWorkspace } = useSWR({ url: '/workspaces/current', params: {} }, fetchCurrentWorkspace)
+
+  const { data: systemFeatures } = useSWR({ url: '/console/system-features' }, getSystemFeatures, {
+    fallbackData: defaultSystemFeatures,
+  })
+
+  const [userProfile, setUserProfile] = useState<UserProfileResponse>()
+  const [langeniusVersionInfo, setLangeniusVersionInfo] = useState<LangGeniusVersionResponse>(initialLangeniusVersionInfo)
+  const [currentWorkspace, setCurrentWorkspace] = useState<ICurrentWorkspace>(initialWorkspaceInfo)
+  const isCurrentWorkspaceManager = useMemo(() => ['owner', 'admin'].includes(currentWorkspace.role), [currentWorkspace.role])
+  const isCurrentWorkspaceOwner = useMemo(() => currentWorkspace.role === 'owner', [currentWorkspace.role])
+  const isCurrentWorkspaceEditor = useMemo(() => ['owner', 'admin', 'editor'].includes(currentWorkspace.role), [currentWorkspace.role])
+  const isCurrentWorkspaceDatasetOperator = useMemo(() => currentWorkspace.role === 'dataset_operator', [currentWorkspace.role])
+  const updateUserProfileAndVersion = useCallback(async () => {
+    if (userProfileResponse && !userProfileResponse.bodyUsed) {
+      const result = await userProfileResponse.json()
+      setUserProfile(result)
+      const current_version = userProfileResponse.headers.get('x-version')
+      const current_env = process.env.NODE_ENV === 'development' ? 'DEVELOPMENT' : userProfileResponse.headers.get('x-env')
+      const versionData = await fetchLanggeniusVersion({ url: '/version', params: { current_version } })
+      setLangeniusVersionInfo({ ...versionData, current_version, latest_version: versionData.version, current_env })
+    }
+  }, [userProfileResponse])
+
+  useEffect(() => {
+    updateUserProfileAndVersion()
+  }, [updateUserProfileAndVersion, userProfileResponse])
+
+  useEffect(() => {
+    if (currentWorkspaceResponse)
+      setCurrentWorkspace(currentWorkspaceResponse)
+  }, [currentWorkspaceResponse])
+
+  if (!appList || !userProfile)
+    return <Loading type='app' />
+
+  return (
+    <AppContext.Provider value={{
+      apps: appList.data,
+      systemFeatures: { ...defaultSystemFeatures, ...systemFeatures },
+      mutateApps,
+      userProfile,
+      mutateUserProfile,
+      pageContainerRef,
+      langeniusVersionInfo,
+      useSelector,
+      currentWorkspace,
+      isCurrentWorkspaceManager,
+      isCurrentWorkspaceOwner,
+      isCurrentWorkspaceEditor,
+      isCurrentWorkspaceDatasetOperator,
+      mutateCurrentWorkspace,
+      isLoadingCurrentWorkspace,
+    }}>
+      <div className='flex flex-col h-full overflow-y-auto'>
+        {globalThis.document?.body?.getAttribute('data-public-maintenance-notice') && <MaintenanceNotice />}
+        <div ref={pageContainerRef} className='grow relative flex flex-col overflow-y-auto overflow-x-hidden bg-background-body'>
+          {children}
+        </div>
+      </div>
+    </AppContext.Provider>
+  )
+}
+
+export const useAppContext = () => useContext(AppContext)
+
+export default AppContext

dify_1.0.1/web/context/dataset-detail.ts

@@ -0,0 +1,17 @@
+import { createContext, useContext, useContextSelector } from 'use-context-selector'
+import type { DataSet } from '@/models/datasets'
+import type { IndexingType } from '@/app/components/datasets/create/step-two'
+
+type DatasetDetailContextValue = {
+  indexingTechnique?: IndexingType
+  dataset?: DataSet
+  mutateDatasetRes?: () => void
+}
+const DatasetDetailContext = createContext<DatasetDetailContextValue>({})
+
+export const useDatasetDetailContext = () => useContext(DatasetDetailContext)
+
+export const useDatasetDetailContextWithSelector = (selector: (value: DatasetDetailContextValue) => any) => {
+  return useContextSelector(DatasetDetailContext, selector)
+}
+export default DatasetDetailContext

dify_1.0.1/web/context/datasets-context.tsx

@@ -0,0 +1,20 @@
+'use client'
+
+import { createContext, useContext } from 'use-context-selector'
+import type { DataSet } from '@/models/datasets'
+
+export type DatasetsContextValue = {
+  datasets: DataSet[]
+  mutateDatasets: () => void
+  currentDataset?: DataSet
+}
+
+const DatasetsContext = createContext<DatasetsContextValue>({
+  datasets: [],
+  mutateDatasets: () => {},
+  currentDataset: undefined,
+})
+
+export const useDatasetsContext = () => useContext(DatasetsContext)
+
+export default DatasetsContext

dify_1.0.1/web/context/debug-configuration.ts

@@ -0,0 +1,257 @@
+import { createContext, useContext } from 'use-context-selector'
+import { PromptMode } from '@/models/debug'
+import type {
+  AnnotationReplyConfig,
+  BlockStatus,
+  ChatPromptConfig,
+  CitationConfig,
+  CompletionPromptConfig,
+  ConversationHistoriesRole,
+  DatasetConfigs,
+  Inputs,
+  ModelConfig,
+  ModerationConfig,
+  MoreLikeThisConfig,
+  PromptConfig,
+  PromptItem,
+  SpeechToTextConfig,
+  SuggestedQuestionsAfterAnswerConfig,
+  TextToSpeechConfig,
+} from '@/models/debug'
+import type { ExternalDataTool } from '@/models/common'
+import type { DataSet } from '@/models/datasets'
+import type { VisionSettings } from '@/types/app'
+import { ModelModeType, RETRIEVE_TYPE, Resolution, TransferMethod } from '@/types/app'
+import { ANNOTATION_DEFAULT, DEFAULT_AGENT_SETTING, DEFAULT_CHAT_PROMPT_CONFIG, DEFAULT_COMPLETION_PROMPT_CONFIG } from '@/config'
+import type { FormValue } from '@/app/components/header/account-setting/model-provider-page/declarations'
+import type { Collection } from '@/app/components/tools/types'
+
+type IDebugConfiguration = {
+  appId: string
+  isAPIKeySet: boolean
+  isTrailFinished: boolean
+  mode: string
+  modelModeType: ModelModeType
+  promptMode: PromptMode
+  setPromptMode: (promptMode: PromptMode) => void
+  isAdvancedMode: boolean
+  isAgent: boolean
+  isFunctionCall: boolean
+  isOpenAI: boolean
+  collectionList: Collection[]
+  canReturnToSimpleMode: boolean
+  setCanReturnToSimpleMode: (canReturnToSimpleMode: boolean) => void
+  chatPromptConfig: ChatPromptConfig
+  completionPromptConfig: CompletionPromptConfig
+  currentAdvancedPrompt: PromptItem | PromptItem[]
+  setCurrentAdvancedPrompt: (prompt: PromptItem | PromptItem[], isUserChanged?: boolean) => void
+  showHistoryModal: () => void
+  conversationHistoriesRole: ConversationHistoriesRole
+  setConversationHistoriesRole: (conversationHistoriesRole: ConversationHistoriesRole) => void
+  hasSetBlockStatus: BlockStatus
+  conversationId: string | null // after first chat send
+  setConversationId: (conversationId: string | null) => void
+  introduction: string
+  setIntroduction: (introduction: string) => void
+  suggestedQuestions: string[]
+  setSuggestedQuestions: (questions: string[]) => void
+  controlClearChatMessage: number
+  setControlClearChatMessage: (controlClearChatMessage: number) => void
+  prevPromptConfig: PromptConfig
+  setPrevPromptConfig: (prevPromptConfig: PromptConfig) => void
+  moreLikeThisConfig: MoreLikeThisConfig
+  setMoreLikeThisConfig: (moreLikeThisConfig: MoreLikeThisConfig) => void
+  suggestedQuestionsAfterAnswerConfig: SuggestedQuestionsAfterAnswerConfig
+  setSuggestedQuestionsAfterAnswerConfig: (suggestedQuestionsAfterAnswerConfig: SuggestedQuestionsAfterAnswerConfig) => void
+  speechToTextConfig: SpeechToTextConfig
+  setSpeechToTextConfig: (speechToTextConfig: SpeechToTextConfig) => void
+  textToSpeechConfig: TextToSpeechConfig
+  setTextToSpeechConfig: (textToSpeechConfig: TextToSpeechConfig) => void
+  citationConfig: CitationConfig
+  setCitationConfig: (citationConfig: CitationConfig) => void
+  annotationConfig: AnnotationReplyConfig
+  setAnnotationConfig: (annotationConfig: AnnotationReplyConfig) => void
+  moderationConfig: ModerationConfig
+  setModerationConfig: (moderationConfig: ModerationConfig) => void
+  externalDataToolsConfig: ExternalDataTool[]
+  setExternalDataToolsConfig: (externalDataTools: ExternalDataTool[]) => void
+  formattingChanged: boolean
+  setFormattingChanged: (formattingChanged: boolean) => void
+  inputs: Inputs
+  setInputs: (inputs: Inputs) => void
+  query: string // user question
+  setQuery: (query: string) => void
+  // Belows are draft infos
+  completionParams: FormValue
+  setCompletionParams: (completionParams: FormValue) => void
+  // model_config
+  modelConfig: ModelConfig
+  setModelConfig: (modelConfig: ModelConfig) => void
+  dataSets: DataSet[]
+  setDataSets: (dataSet: DataSet[]) => void
+  showSelectDataSet: () => void
+  // dataset config
+  datasetConfigs: DatasetConfigs
+  setDatasetConfigs: (config: DatasetConfigs) => void
+  hasSetContextVar: boolean
+  isShowVisionConfig: boolean
+  visionConfig: VisionSettings
+  setVisionConfig: (visionConfig: VisionSettings, noNotice?: boolean) => void
+  isAllowVideoUpload: boolean
+  isShowDocumentConfig: boolean
+  rerankSettingModalOpen: boolean
+  setRerankSettingModalOpen: (rerankSettingModalOpen: boolean) => void
+}
+
+const DebugConfigurationContext = createContext<IDebugConfiguration>({
+  appId: '',
+  isAPIKeySet: false,
+  isTrailFinished: false,
+  mode: '',
+  modelModeType: ModelModeType.chat,
+  promptMode: PromptMode.simple,
+  setPromptMode: () => { },
+  isAdvancedMode: false,
+  isAgent: false,
+  isFunctionCall: false,
+  isOpenAI: false,
+  collectionList: [],
+  canReturnToSimpleMode: false,
+  setCanReturnToSimpleMode: () => { },
+  chatPromptConfig: DEFAULT_CHAT_PROMPT_CONFIG,
+  completionPromptConfig: DEFAULT_COMPLETION_PROMPT_CONFIG,
+  currentAdvancedPrompt: [],
+  showHistoryModal: () => { },
+  conversationHistoriesRole: {
+    user_prefix: 'user',
+    assistant_prefix: 'assistant',
+  },
+  setConversationHistoriesRole: () => { },
+  setCurrentAdvancedPrompt: () => { },
+  hasSetBlockStatus: {
+    context: false,
+    history: false,
+    query: false,
+  },
+  conversationId: '',
+  setConversationId: () => { },
+  introduction: '',
+  setIntroduction: () => { },
+  suggestedQuestions: [],
+  setSuggestedQuestions: () => { },
+  controlClearChatMessage: 0,
+  setControlClearChatMessage: () => { },
+  prevPromptConfig: {
+    prompt_template: '',
+    prompt_variables: [],
+  },
+  setPrevPromptConfig: () => { },
+  moreLikeThisConfig: {
+    enabled: false,
+  },
+  setMoreLikeThisConfig: () => { },
+  suggestedQuestionsAfterAnswerConfig: {
+    enabled: false,
+  },
+  setSuggestedQuestionsAfterAnswerConfig: () => { },
+  speechToTextConfig: {
+    enabled: false,
+  },
+  setSpeechToTextConfig: () => { },
+  textToSpeechConfig: {
+    enabled: false,
+    voice: '',
+    language: '',
+  },
+  setTextToSpeechConfig: () => { },
+  citationConfig: {
+    enabled: false,
+  },
+  setCitationConfig: () => { },
+  moderationConfig: {
+    enabled: false,
+  },
+  annotationConfig: {
+    id: '',
+    enabled: false,
+    score_threshold: ANNOTATION_DEFAULT.score_threshold,
+    embedding_model: {
+      embedding_model_name: '',
+      embedding_provider_name: '',
+    },
+  },
+  setAnnotationConfig: () => { },
+  setModerationConfig: () => { },
+  externalDataToolsConfig: [],
+  setExternalDataToolsConfig: () => { },
+  formattingChanged: false,
+  setFormattingChanged: () => { },
+  inputs: {},
+  setInputs: () => { },
+  query: '',
+  setQuery: () => { },
+  completionParams: {
+    max_tokens: 16,
+    temperature: 1, // 0-2
+    top_p: 1,
+    presence_penalty: 1, // -2-2
+    frequency_penalty: 1, // -2-2
+  },
+  setCompletionParams: () => { },
+  modelConfig: {
+    provider: 'OPENAI', // 'OPENAI'
+    model_id: 'gpt-3.5-turbo', // 'gpt-3.5-turbo'
+    mode: ModelModeType.unset,
+    configs: {
+      prompt_template: '',
+      prompt_variables: [],
+    },
+    more_like_this: null,
+    opening_statement: '',
+    suggested_questions: [],
+    sensitive_word_avoidance: null,
+    speech_to_text: null,
+    text_to_speech: null,
+    file_upload: null,
+    suggested_questions_after_answer: null,
+    retriever_resource: null,
+    annotation_reply: null,
+    dataSets: [],
+    agentConfig: DEFAULT_AGENT_SETTING,
+  },
+  setModelConfig: () => { },
+  dataSets: [],
+  showSelectDataSet: () => { },
+  setDataSets: () => { },
+  datasetConfigs: {
+    retrieval_model: RETRIEVE_TYPE.multiWay,
+    reranking_model: {
+      reranking_provider_name: '',
+      reranking_model_name: '',
+    },
+    top_k: 2,
+    score_threshold_enabled: false,
+    score_threshold: 0.7,
+    datasets: {
+      datasets: [],
+    },
+  },
+  setDatasetConfigs: () => { },
+  hasSetContextVar: false,
+  isShowVisionConfig: false,
+  visionConfig: {
+    enabled: false,
+    number_limits: 2,
+    detail: Resolution.low,
+    transfer_methods: [TransferMethod.remote_url],
+  },
+  setVisionConfig: () => { },
+  isAllowVideoUpload: false,
+  isShowDocumentConfig: false,
+  rerankSettingModalOpen: false,
+  setRerankSettingModalOpen: () => { },
+})
+
+export const useDebugConfigurationContext = () => useContext(DebugConfigurationContext)
+
+export default DebugConfigurationContext

dify_1.0.1/web/context/event-emitter.tsx

@@ -0,0 +1,28 @@
+'use client'
+
+import { createContext, useContext } from 'use-context-selector'
+import { useEventEmitter } from 'ahooks'
+import type { EventEmitter } from 'ahooks/lib/useEventEmitter'
+
+const EventEmitterContext = createContext<{ eventEmitter: EventEmitter<string> | null }>({
+  eventEmitter: null,
+})
+
+export const useEventEmitterContextContext = () => useContext(EventEmitterContext)
+
+type EventEmitterContextProviderProps = {
+  children: React.ReactNode
+}
+export const EventEmitterContextProvider = ({
+  children,
+}: EventEmitterContextProviderProps) => {
+  const eventEmitter = useEventEmitter<string>()
+
+  return (
+    <EventEmitterContext.Provider value={{ eventEmitter }}>
+      {children}
+    </EventEmitterContext.Provider>
+  )
+}
+
+export default EventEmitterContext

dify_1.0.1/web/context/explore-context.ts

@@ -0,0 +1,20 @@
+import { createContext } from 'use-context-selector'
+import type { InstalledApp } from '@/models/explore'
+
+type IExplore = {
+  controlUpdateInstalledApps: number
+  setControlUpdateInstalledApps: (controlUpdateInstalledApps: number) => void
+  hasEditPermission: boolean
+  installedApps: InstalledApp[]
+  setInstalledApps: (installedApps: InstalledApp[]) => void
+}
+
+const ExploreContext = createContext<IExplore>({
+  controlUpdateInstalledApps: 0,
+  setControlUpdateInstalledApps: () => { },
+  hasEditPermission: false,
+  installedApps: [],
+  setInstalledApps: () => { },
+})
+
+export default ExploreContext

dify_1.0.1/web/context/external-api-panel-context.tsx

@@ -0,0 +1,28 @@
+'use client'
+
+import React, { createContext, useContext, useState } from 'react'
+
+type ExternalApiPanelContextType = {
+  showExternalApiPanel: boolean
+  setShowExternalApiPanel: (show: boolean) => void
+}
+
+const ExternalApiPanelContext = createContext<ExternalApiPanelContextType | undefined>(undefined)
+
+export const ExternalApiPanelProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const [showExternalApiPanel, setShowExternalApiPanel] = useState(false)
+
+  return (
+    <ExternalApiPanelContext.Provider value={{ showExternalApiPanel, setShowExternalApiPanel }}>
+      {children}
+    </ExternalApiPanelContext.Provider>
+  )
+}
+
+export const useExternalApiPanel = () => {
+  const context = useContext(ExternalApiPanelContext)
+  if (context === undefined)
+    throw new Error('useExternalApiPanel must be used within an ExternalApiPanelProvider')
+
+  return context
+}

dify_1.0.1/web/context/external-knowledge-api-context.tsx

@@ -0,0 +1,46 @@
+'use client'
+
+import { createContext, useContext, useMemo } from 'react'
+import type { FC, ReactNode } from 'react'
+import useSWR from 'swr'
+import type { ExternalAPIItem, ExternalAPIListResponse } from '@/models/datasets'
+import { fetchExternalAPIList } from '@/service/datasets'
+
+type ExternalKnowledgeApiContextType = {
+  externalKnowledgeApiList: ExternalAPIItem[]
+  mutateExternalKnowledgeApis: () => Promise<ExternalAPIListResponse | undefined>
+  isLoading: boolean
+}
+
+const ExternalKnowledgeApiContext = createContext<ExternalKnowledgeApiContextType | undefined>(undefined)
+
+export type ExternalKnowledgeApiProviderProps = {
+  children: ReactNode
+}
+
+export const ExternalKnowledgeApiProvider: FC<ExternalKnowledgeApiProviderProps> = ({ children }) => {
+  const { data, mutate: mutateExternalKnowledgeApis, isLoading } = useSWR<ExternalAPIListResponse>(
+    { url: '/datasets/external-knowledge-api' },
+    fetchExternalAPIList,
+  )
+
+  const contextValue = useMemo<ExternalKnowledgeApiContextType>(() => ({
+    externalKnowledgeApiList: data?.data || [],
+    mutateExternalKnowledgeApis,
+    isLoading,
+  }), [data, mutateExternalKnowledgeApis, isLoading])
+
+  return (
+    <ExternalKnowledgeApiContext.Provider value={contextValue}>
+      {children}
+    </ExternalKnowledgeApiContext.Provider>
+  )
+}
+
+export const useExternalKnowledgeApi = () => {
+  const context = useContext(ExternalKnowledgeApiContext)
+  if (context === undefined)
+    throw new Error('useExternalKnowledgeApi must be used within a ExternalKnowledgeApiProvider')
+
+  return context
+}

dify_1.0.1/web/context/i18n.ts

@@ -0,0 +1,27 @@
+import {
+  createContext,
+  useContext,
+} from 'use-context-selector'
+import type { Locale } from '@/i18n'
+import { getLanguage } from '@/i18n/language'
+
+type II18NContext = {
+  locale: Locale
+  i18n: Record<string, any>
+  setLocaleOnClient: (_lang: Locale, _reloadPage?: boolean) => void
+}
+
+const I18NContext = createContext<II18NContext>({
+  locale: 'en-US',
+  i18n: {},
+  setLocaleOnClient: (_lang: Locale, _reloadPage?: boolean) => { },
+})
+
+export const useI18N = () => useContext(I18NContext)
+export const useGetLanguage = () => {
+  const { locale } = useI18N()
+
+  return getLanguage(locale)
+}
+
+export default I18NContext

dify_1.0.1/web/context/modal-context.tsx

@@ -0,0 +1,370 @@
+'use client'
+
+import type { Dispatch, SetStateAction } from 'react'
+import { useCallback, useState } from 'react'
+import { createContext, useContext, useContextSelector } from 'use-context-selector'
+import { useRouter, useSearchParams } from 'next/navigation'
+import AccountSetting from '@/app/components/header/account-setting'
+import ApiBasedExtensionModal from '@/app/components/header/account-setting/api-based-extension-page/modal'
+import ModerationSettingModal from '@/app/components/base/features/new-feature-panel/moderation/moderation-setting-modal'
+import ExternalDataToolModal from '@/app/components/app/configuration/tools/external-data-tool-modal'
+import AnnotationFullModal from '@/app/components/billing/annotation-full/modal'
+import ModelModal from '@/app/components/header/account-setting/model-provider-page/model-modal'
+import ExternalAPIModal from '@/app/components/datasets/external-api/external-api-modal'
+import type {
+  ConfigurationMethodEnum,
+  CustomConfigurationModelFixedFields,
+  ModelLoadBalancingConfigEntry,
+  ModelProvider,
+} from '@/app/components/header/account-setting/model-provider-page/declarations'
+
+import Pricing from '@/app/components/billing/pricing'
+import type { ModerationConfig, PromptVariable } from '@/models/debug'
+import type {
+  ApiBasedExtension,
+  ExternalDataTool,
+} from '@/models/common'
+import type { CreateExternalAPIReq } from '@/app/components/datasets/external-api/declarations'
+import ModelLoadBalancingEntryModal from '@/app/components/header/account-setting/model-provider-page/model-modal/model-load-balancing-entry-modal'
+import type { ModelLoadBalancingModalProps } from '@/app/components/header/account-setting/model-provider-page/provider-added-card/model-load-balancing-modal'
+import ModelLoadBalancingModal from '@/app/components/header/account-setting/model-provider-page/provider-added-card/model-load-balancing-modal'
+import OpeningSettingModal from '@/app/components/base/features/new-feature-panel/conversation-opener/modal'
+import type { OpeningStatement } from '@/app/components/base/features/types'
+import type { InputVar } from '@/app/components/workflow/types'
+import type { UpdatePluginPayload } from '@/app/components/plugins/types'
+import UpdatePlugin from '@/app/components/plugins/update-plugin'
+
+export type ModalState<T> = {
+  payload: T
+  onCancelCallback?: () => void
+  onSaveCallback?: (newPayload: T) => void
+  onRemoveCallback?: (newPayload: T) => void
+  onEditCallback?: (newPayload: T) => void
+  onValidateBeforeSaveCallback?: (newPayload: T) => boolean
+  isEditMode?: boolean
+  datasetBindings?: { id: string; name: string }[]
+}
+
+export type ModelModalType = {
+  currentProvider: ModelProvider
+  currentConfigurationMethod: ConfigurationMethodEnum
+  currentCustomConfigurationModelFixedFields?: CustomConfigurationModelFixedFields
+}
+export type LoadBalancingEntryModalType = ModelModalType & {
+  entry?: ModelLoadBalancingConfigEntry
+  index?: number
+}
+
+export type ModalContextState = {
+  setShowAccountSettingModal: Dispatch<SetStateAction<ModalState<string> | null>>
+  setShowApiBasedExtensionModal: Dispatch<SetStateAction<ModalState<ApiBasedExtension> | null>>
+  setShowModerationSettingModal: Dispatch<SetStateAction<ModalState<ModerationConfig> | null>>
+  setShowExternalDataToolModal: Dispatch<SetStateAction<ModalState<ExternalDataTool> | null>>
+  setShowPricingModal: () => void
+  setShowAnnotationFullModal: () => void
+  setShowModelModal: Dispatch<SetStateAction<ModalState<ModelModalType> | null>>
+  setShowExternalKnowledgeAPIModal: Dispatch<SetStateAction<ModalState<CreateExternalAPIReq> | null>>
+  setShowModelLoadBalancingModal: Dispatch<SetStateAction<ModelLoadBalancingModalProps | null>>
+  setShowModelLoadBalancingEntryModal: Dispatch<SetStateAction<ModalState<LoadBalancingEntryModalType> | null>>
+  setShowOpeningModal: Dispatch<SetStateAction<ModalState<OpeningStatement & {
+    promptVariables?: PromptVariable[]
+    workflowVariables?: InputVar[]
+    onAutoAddPromptVariable?: (variable: PromptVariable[]) => void
+  }> | null>>
+  setShowUpdatePluginModal: Dispatch<SetStateAction<ModalState<UpdatePluginPayload> | null>>
+}
+const ModalContext = createContext<ModalContextState>({
+  setShowAccountSettingModal: () => { },
+  setShowApiBasedExtensionModal: () => { },
+  setShowModerationSettingModal: () => { },
+  setShowExternalDataToolModal: () => { },
+  setShowPricingModal: () => { },
+  setShowAnnotationFullModal: () => { },
+  setShowModelModal: () => { },
+  setShowExternalKnowledgeAPIModal: () => { },
+  setShowModelLoadBalancingModal: () => { },
+  setShowModelLoadBalancingEntryModal: () => { },
+  setShowOpeningModal: () => { },
+  setShowUpdatePluginModal: () => { },
+})
+
+export const useModalContext = () => useContext(ModalContext)
+
+// Adding a dangling comma to avoid the generic parsing issue in tsx, see:
+// https://github.com/microsoft/TypeScript/issues/15713
+export const useModalContextSelector = <T,>(selector: (state: ModalContextState) => T): T =>
+  useContextSelector(ModalContext, selector)
+
+type ModalContextProviderProps = {
+  children: React.ReactNode
+}
+export const ModalContextProvider = ({
+  children,
+}: ModalContextProviderProps) => {
+  const [showAccountSettingModal, setShowAccountSettingModal] = useState<ModalState<string> | null>(null)
+  const [showApiBasedExtensionModal, setShowApiBasedExtensionModal] = useState<ModalState<ApiBasedExtension> | null>(null)
+  const [showModerationSettingModal, setShowModerationSettingModal] = useState<ModalState<ModerationConfig> | null>(null)
+  const [showExternalDataToolModal, setShowExternalDataToolModal] = useState<ModalState<ExternalDataTool> | null>(null)
+  const [showModelModal, setShowModelModal] = useState<ModalState<ModelModalType> | null>(null)
+  const [showExternalKnowledgeAPIModal, setShowExternalKnowledgeAPIModal] = useState<ModalState<CreateExternalAPIReq> | null>(null)
+  const [showModelLoadBalancingModal, setShowModelLoadBalancingModal] = useState<ModelLoadBalancingModalProps | null>(null)
+  const [showModelLoadBalancingEntryModal, setShowModelLoadBalancingEntryModal] = useState<ModalState<LoadBalancingEntryModalType> | null>(null)
+  const [showOpeningModal, setShowOpeningModal] = useState<ModalState<OpeningStatement & {
+    promptVariables?: PromptVariable[]
+    workflowVariables?: InputVar[]
+    onAutoAddPromptVariable?: (variable: PromptVariable[]) => void
+  }> | null>(null)
+  const [showUpdatePluginModal, setShowUpdatePluginModal] = useState<ModalState<UpdatePluginPayload> | null>(null)
+
+  const searchParams = useSearchParams()
+  const router = useRouter()
+  const [showPricingModal, setShowPricingModal] = useState(searchParams.get('show-pricing') === '1')
+  const [showAnnotationFullModal, setShowAnnotationFullModal] = useState(false)
+  const handleCancelAccountSettingModal = () => {
+    setShowAccountSettingModal(null)
+    if (showAccountSettingModal?.onCancelCallback)
+      showAccountSettingModal?.onCancelCallback()
+  }
+
+  const handleCancelModerationSettingModal = () => {
+    setShowModerationSettingModal(null)
+    if (showModerationSettingModal?.onCancelCallback)
+      showModerationSettingModal.onCancelCallback()
+  }
+
+  const handleCancelExternalDataToolModal = () => {
+    setShowExternalDataToolModal(null)
+    if (showExternalDataToolModal?.onCancelCallback)
+      showExternalDataToolModal.onCancelCallback()
+  }
+
+  const handleCancelModelModal = useCallback(() => {
+    setShowModelModal(null)
+    if (showModelModal?.onCancelCallback)
+      showModelModal.onCancelCallback()
+  }, [showModelModal])
+
+  const handleSaveModelModal = useCallback(() => {
+    if (showModelModal?.onSaveCallback)
+      showModelModal.onSaveCallback(showModelModal.payload)
+    setShowModelModal(null)
+  }, [showModelModal])
+
+  const handleCancelExternalApiModal = useCallback(() => {
+    setShowExternalKnowledgeAPIModal(null)
+    if (showExternalKnowledgeAPIModal?.onCancelCallback)
+      showExternalKnowledgeAPIModal.onCancelCallback()
+  }, [showExternalKnowledgeAPIModal])
+
+  const handleSaveExternalApiModal = useCallback(async (updatedFormValue: CreateExternalAPIReq) => {
+    if (showExternalKnowledgeAPIModal?.onSaveCallback)
+      showExternalKnowledgeAPIModal.onSaveCallback(updatedFormValue)
+    setShowExternalKnowledgeAPIModal(null)
+  }, [showExternalKnowledgeAPIModal])
+
+  const handleEditExternalApiModal = useCallback(async (updatedFormValue: CreateExternalAPIReq) => {
+    if (showExternalKnowledgeAPIModal?.onEditCallback)
+      showExternalKnowledgeAPIModal.onEditCallback(updatedFormValue)
+    setShowExternalKnowledgeAPIModal(null)
+  }, [showExternalKnowledgeAPIModal])
+
+  const handleCancelModelLoadBalancingEntryModal = useCallback(() => {
+    showModelLoadBalancingEntryModal?.onCancelCallback?.()
+    setShowModelLoadBalancingEntryModal(null)
+  }, [showModelLoadBalancingEntryModal])
+
+  const handleCancelOpeningModal = useCallback(() => {
+    setShowOpeningModal(null)
+    if (showOpeningModal?.onCancelCallback)
+      showOpeningModal.onCancelCallback()
+  }, [showOpeningModal])
+
+  const handleSaveModelLoadBalancingEntryModal = useCallback((entry: ModelLoadBalancingConfigEntry) => {
+    showModelLoadBalancingEntryModal?.onSaveCallback?.({
+      ...showModelLoadBalancingEntryModal.payload,
+      entry,
+    })
+    setShowModelLoadBalancingEntryModal(null)
+  }, [showModelLoadBalancingEntryModal])
+
+  const handleRemoveModelLoadBalancingEntry = useCallback(() => {
+    showModelLoadBalancingEntryModal?.onRemoveCallback?.(showModelLoadBalancingEntryModal.payload)
+    setShowModelLoadBalancingEntryModal(null)
+  }, [showModelLoadBalancingEntryModal])
+
+  const handleSaveApiBasedExtension = (newApiBasedExtension: ApiBasedExtension) => {
+    if (showApiBasedExtensionModal?.onSaveCallback)
+      showApiBasedExtensionModal.onSaveCallback(newApiBasedExtension)
+    setShowApiBasedExtensionModal(null)
+  }
+
+  const handleSaveModeration = (newModerationConfig: ModerationConfig) => {
+    if (showModerationSettingModal?.onSaveCallback)
+      showModerationSettingModal.onSaveCallback(newModerationConfig)
+    setShowModerationSettingModal(null)
+  }
+
+  const handleSaveExternalDataTool = (newExternalDataTool: ExternalDataTool) => {
+    if (showExternalDataToolModal?.onSaveCallback)
+      showExternalDataToolModal.onSaveCallback(newExternalDataTool)
+    setShowExternalDataToolModal(null)
+  }
+
+  const handleValidateBeforeSaveExternalDataTool = (newExternalDataTool: ExternalDataTool) => {
+    if (showExternalDataToolModal?.onValidateBeforeSaveCallback)
+      return showExternalDataToolModal?.onValidateBeforeSaveCallback(newExternalDataTool)
+    return true
+  }
+
+  const handleSaveOpeningModal = (newOpening: OpeningStatement) => {
+    if (showOpeningModal?.onSaveCallback)
+      showOpeningModal.onSaveCallback(newOpening)
+    setShowOpeningModal(null)
+  }
+
+  return (
+    <ModalContext.Provider value={{
+      setShowAccountSettingModal,
+      setShowApiBasedExtensionModal,
+      setShowModerationSettingModal,
+      setShowExternalDataToolModal,
+      setShowPricingModal: () => setShowPricingModal(true),
+      setShowAnnotationFullModal: () => setShowAnnotationFullModal(true),
+      setShowModelModal,
+      setShowExternalKnowledgeAPIModal,
+      setShowModelLoadBalancingModal,
+      setShowModelLoadBalancingEntryModal,
+      setShowOpeningModal,
+      setShowUpdatePluginModal,
+    }}>
+      <>
+        {children}
+        {
+          !!showAccountSettingModal && (
+            <AccountSetting
+              activeTab={showAccountSettingModal.payload}
+              onCancel={handleCancelAccountSettingModal}
+            />
+          )
+        }
+
+        {
+          !!showApiBasedExtensionModal && (
+            <ApiBasedExtensionModal
+              data={showApiBasedExtensionModal.payload}
+              onCancel={() => setShowApiBasedExtensionModal(null)}
+              onSave={handleSaveApiBasedExtension}
+            />
+          )
+        }
+        {
+          !!showModerationSettingModal && (
+            <ModerationSettingModal
+              data={showModerationSettingModal.payload}
+              onCancel={handleCancelModerationSettingModal}
+              onSave={handleSaveModeration}
+            />
+          )
+        }
+        {
+          !!showExternalDataToolModal && (
+            <ExternalDataToolModal
+              data={showExternalDataToolModal.payload}
+              onCancel={handleCancelExternalDataToolModal}
+              onSave={handleSaveExternalDataTool}
+              onValidateBeforeSave={handleValidateBeforeSaveExternalDataTool}
+            />
+          )
+        }
+
+        {
+          !!showPricingModal && (
+            <Pricing onCancel={() => {
+              if (searchParams.get('show-pricing') === '1')
+                router.push(location.pathname, { forceOptimisticNavigation: true } as any)
+
+              setShowPricingModal(false)
+            }} />
+          )
+        }
+
+        {
+          showAnnotationFullModal && (
+            <AnnotationFullModal
+              show={showAnnotationFullModal}
+              onHide={() => setShowAnnotationFullModal(false)} />
+          )
+        }
+        {
+          !!showModelModal && (
+            <ModelModal
+              provider={showModelModal.payload.currentProvider}
+              configurateMethod={showModelModal.payload.currentConfigurationMethod}
+              currentCustomConfigurationModelFixedFields={showModelModal.payload.currentCustomConfigurationModelFixedFields}
+              onCancel={handleCancelModelModal}
+              onSave={handleSaveModelModal}
+            />
+          )
+        }
+        {
+          !!showExternalKnowledgeAPIModal && (
+            <ExternalAPIModal
+              data={showExternalKnowledgeAPIModal.payload}
+              datasetBindings={showExternalKnowledgeAPIModal.datasetBindings ?? []}
+              onSave={handleSaveExternalApiModal}
+              onCancel={handleCancelExternalApiModal}
+              onEdit={handleEditExternalApiModal}
+              isEditMode={showExternalKnowledgeAPIModal.isEditMode ?? false}
+            />
+          )
+        }
+        {
+          Boolean(showModelLoadBalancingModal) && (
+            <ModelLoadBalancingModal {...showModelLoadBalancingModal!} />
+          )
+        }
+        {
+          !!showModelLoadBalancingEntryModal && (
+            <ModelLoadBalancingEntryModal
+              provider={showModelLoadBalancingEntryModal.payload.currentProvider}
+              configurationMethod={showModelLoadBalancingEntryModal.payload.currentConfigurationMethod}
+              currentCustomConfigurationModelFixedFields={showModelLoadBalancingEntryModal.payload.currentCustomConfigurationModelFixedFields}
+              entry={showModelLoadBalancingEntryModal.payload.entry}
+              onCancel={handleCancelModelLoadBalancingEntryModal}
+              onSave={handleSaveModelLoadBalancingEntryModal}
+              onRemove={handleRemoveModelLoadBalancingEntry}
+            />
+          )
+        }
+        {showOpeningModal && (
+          <OpeningSettingModal
+            data={showOpeningModal.payload}
+            onSave={handleSaveOpeningModal}
+            onCancel={handleCancelOpeningModal}
+            promptVariables={showOpeningModal.payload.promptVariables}
+            workflowVariables={showOpeningModal.payload.workflowVariables}
+            onAutoAddPromptVariable={showOpeningModal.payload.onAutoAddPromptVariable}
+          />
+        )}
+
+        {
+          !!showUpdatePluginModal && (
+            <UpdatePlugin
+              {...showUpdatePluginModal.payload}
+              onCancel={() => {
+                setShowUpdatePluginModal(null)
+                showUpdatePluginModal.onCancelCallback?.()
+              }}
+              onSave={() => {
+                setShowUpdatePluginModal(null)
+                showUpdatePluginModal.onSaveCallback?.({} as any)
+              }}
+            />
+          )
+        }
+      </>
+    </ModalContext.Provider>
+  )
+}
+
+export default ModalContext

dify_1.0.1/web/context/provider-context.tsx

@@ -0,0 +1,164 @@
+'use client'
+
+import { createContext, useContext, useContextSelector } from 'use-context-selector'
+import useSWR from 'swr'
+import { useEffect, useState } from 'react'
+import dayjs from 'dayjs'
+import { useTranslation } from 'react-i18next'
+import {
+  fetchModelList,
+  fetchModelProviders,
+  fetchSupportRetrievalMethods,
+} from '@/service/common'
+import {
+  CurrentSystemQuotaTypeEnum,
+  ModelStatusEnum,
+  ModelTypeEnum,
+} from '@/app/components/header/account-setting/model-provider-page/declarations'
+import type { Model, ModelProvider } from '@/app/components/header/account-setting/model-provider-page/declarations'
+import type { RETRIEVE_METHOD } from '@/types/app'
+import { Plan, type UsagePlanInfo } from '@/app/components/billing/type'
+import { fetchCurrentPlanInfo } from '@/service/billing'
+import { parseCurrentPlan } from '@/app/components/billing/utils'
+import { defaultPlan } from '@/app/components/billing/config'
+import Toast from '@/app/components/base/toast'
+
+type ProviderContextState = {
+  modelProviders: ModelProvider[]
+  refreshModelProviders: () => void
+  textGenerationModelList: Model[]
+  supportRetrievalMethods: RETRIEVE_METHOD[]
+  isAPIKeySet: boolean
+  plan: {
+    type: Plan
+    usage: UsagePlanInfo
+    total: UsagePlanInfo
+  }
+  isFetchedPlan: boolean
+  enableBilling: boolean
+  onPlanInfoChanged: () => void
+  enableReplaceWebAppLogo: boolean
+  modelLoadBalancingEnabled: boolean
+  datasetOperatorEnabled: boolean
+}
+const ProviderContext = createContext<ProviderContextState>({
+  modelProviders: [],
+  refreshModelProviders: () => { },
+  textGenerationModelList: [],
+  supportRetrievalMethods: [],
+  isAPIKeySet: true,
+  plan: {
+    type: Plan.sandbox,
+    usage: {
+      vectorSpace: 32,
+      buildApps: 12,
+      teamMembers: 1,
+      annotatedResponse: 1,
+      documentsUploadQuota: 50,
+    },
+    total: {
+      vectorSpace: 200,
+      buildApps: 50,
+      teamMembers: 1,
+      annotatedResponse: 10,
+      documentsUploadQuota: 500,
+    },
+  },
+  isFetchedPlan: false,
+  enableBilling: false,
+  onPlanInfoChanged: () => { },
+  enableReplaceWebAppLogo: false,
+  modelLoadBalancingEnabled: false,
+  datasetOperatorEnabled: false,
+})
+
+export const useProviderContext = () => useContext(ProviderContext)
+
+// Adding a dangling comma to avoid the generic parsing issue in tsx, see:
+// https://github.com/microsoft/TypeScript/issues/15713
+export const useProviderContextSelector = <T,>(selector: (state: ProviderContextState) => T): T =>
+  useContextSelector(ProviderContext, selector)
+
+type ProviderContextProviderProps = {
+  children: React.ReactNode
+}
+export const ProviderContextProvider = ({
+  children,
+}: ProviderContextProviderProps) => {
+  const { data: providersData, mutate: refreshModelProviders } = useSWR('/workspaces/current/model-providers', fetchModelProviders)
+  const fetchModelListUrlPrefix = '/workspaces/current/models/model-types/'
+  const { data: textGenerationModelList } = useSWR(`${fetchModelListUrlPrefix}${ModelTypeEnum.textGeneration}`, fetchModelList)
+  const { data: supportRetrievalMethods } = useSWR('/datasets/retrieval-setting', fetchSupportRetrievalMethods)
+
+  const [plan, setPlan] = useState(defaultPlan)
+  const [isFetchedPlan, setIsFetchedPlan] = useState(false)
+  const [enableBilling, setEnableBilling] = useState(true)
+  const [enableReplaceWebAppLogo, setEnableReplaceWebAppLogo] = useState(false)
+  const [modelLoadBalancingEnabled, setModelLoadBalancingEnabled] = useState(false)
+  const [datasetOperatorEnabled, setDatasetOperatorEnabled] = useState(false)
+
+  const fetchPlan = async () => {
+    const data = await fetchCurrentPlanInfo()
+    const enabled = data.billing.enabled
+    setEnableBilling(enabled)
+    setEnableReplaceWebAppLogo(data.can_replace_logo)
+    if (enabled) {
+      setPlan(parseCurrentPlan(data))
+      setIsFetchedPlan(true)
+    }
+    if (data.model_load_balancing_enabled)
+      setModelLoadBalancingEnabled(true)
+    if (data.dataset_operator_enabled)
+      setDatasetOperatorEnabled(true)
+  }
+  useEffect(() => {
+    fetchPlan()
+  }, [])
+
+  const { t } = useTranslation()
+  useEffect(() => {
+    if (localStorage.getItem('anthropic_quota_notice') === 'true')
+      return
+
+    if (dayjs().isAfter(dayjs('2025-03-17')))
+      return
+
+    if (providersData?.data && providersData.data.length > 0) {
+      const anthropic = providersData.data.find(provider => provider.provider === 'anthropic')
+      if (anthropic && anthropic.system_configuration.current_quota_type === CurrentSystemQuotaTypeEnum.trial) {
+        const quota = anthropic.system_configuration.quota_configurations.find(item => item.quota_type === anthropic.system_configuration.current_quota_type)
+        if (quota && quota.is_valid && quota.quota_used < quota.quota_limit) {
+          Toast.notify({
+            type: 'info',
+            message: t('common.provider.anthropicHosted.trialQuotaTip'),
+            duration: 60000,
+            onClose: () => {
+              localStorage.setItem('anthropic_quota_notice', 'true')
+            },
+          })
+        }
+      }
+    }
+  }, [providersData, t])
+
+  return (
+    <ProviderContext.Provider value={{
+      modelProviders: providersData?.data || [],
+      refreshModelProviders,
+      textGenerationModelList: textGenerationModelList?.data || [],
+      isAPIKeySet: !!textGenerationModelList?.data.some(model => model.status === ModelStatusEnum.active),
+      supportRetrievalMethods: supportRetrievalMethods?.retrieval_method || [],
+      plan,
+      isFetchedPlan,
+      enableBilling,
+      onPlanInfoChanged: fetchPlan,
+      enableReplaceWebAppLogo,
+      modelLoadBalancingEnabled,
+      datasetOperatorEnabled,
+    }}>
+      {children}
+    </ProviderContext.Provider>
+  )
+}
+
+export default ProviderContext

dify_1.0.1/web/context/query-client.tsx

@@ -0,0 +1,23 @@
+'use client'
+
+import type { FC, PropsWithChildren } from 'react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
+
+const STALE_TIME = 1000 * 60 * 30 // 30 minutes
+
+const client = new QueryClient({
+  defaultOptions: {
+    queries: {
+      staleTime: STALE_TIME,
+    },
+  },
+})
+
+export const TanstackQueryIniter: FC<PropsWithChildren> = (props) => {
+  const { children } = props
+  return <QueryClientProvider client={client}>
+    {children}
+    <ReactQueryDevtools initialIsOpen={false} />
+  </QueryClientProvider>
+}

dify_1.0.1/web/context/workspace-context.tsx

@@ -0,0 +1,36 @@
+'use client'
+
+import { createContext, useContext } from 'use-context-selector'
+import useSWR from 'swr'
+import { fetchWorkspaces } from '@/service/common'
+import type { IWorkspace } from '@/models/common'
+
+export type WorkspacesContextValue = {
+  workspaces: IWorkspace[]
+}
+
+const WorkspacesContext = createContext<WorkspacesContextValue>({
+  workspaces: [],
+})
+
+type IWorkspaceProviderProps = {
+  children: React.ReactNode
+}
+
+export const WorkspaceProvider = ({
+  children,
+}: IWorkspaceProviderProps) => {
+  const { data } = useSWR({ url: '/workspaces' }, fetchWorkspaces)
+
+  return (
+    <WorkspacesContext.Provider value={{
+      workspaces: data?.workspaces || [],
+    }}>
+      {children}
+    </WorkspacesContext.Provider>
+  )
+}
+
+export const useWorkspacesContext = () => useContext(WorkspacesContext)
+
+export default WorkspacesContext