diff --git a/apps/client/src/common/hooks-query/useProjectList.ts b/apps/client/src/common/hooks-query/useProjectList.ts
index b79324c9b..fd5b4e616 100644
--- a/apps/client/src/common/hooks-query/useProjectList.ts
+++ b/apps/client/src/common/hooks-query/useProjectList.ts
@@ -1,24 +1,18 @@
-import { useQuery } from '@tanstack/react-query';
-import { ProjectFile, ProjectFileList, ProjectFileListResponse } from 'ontime-types';
+import { useSuspenseQuery } from '@tanstack/react-query';
+import { ProjectFile, ProjectFileList } from 'ontime-types';
+import { MILLIS_PER_HOUR } from 'ontime-utils';
import { useMemo } from 'react';
-import { queryRefetchIntervalSlow } from '../../ontimeConfig';
import { PROJECT_LIST } from '../api/constants';
import { getProjects } from '../api/db';
-const placeholderProjectList: ProjectFileListResponse = {
- files: [],
- lastLoadedProject: '',
-};
-
-function useProjectList() {
- const { data, status, refetch } = useQuery({
+export function useProjectList() {
+ const { data, status, refetch } = useSuspenseQuery({
queryKey: PROJECT_LIST,
queryFn: ({ signal }) => getProjects({ signal }),
- placeholderData: (previousData, _previousQuery) => previousData,
- refetchInterval: queryRefetchIntervalSlow,
+ staleTime: MILLIS_PER_HOUR,
});
- return { data: data ?? placeholderProjectList, status, refetch };
+ return { data, status, refetch };
}
export type ProjectSortMode = 'alphabetical-asc' | 'alphabetical-desc' | 'modified-asc' | 'modified-desc';
diff --git a/apps/client/src/common/utils/socket.ts b/apps/client/src/common/utils/socket.ts
index a9366cc36..93ee3b3ae 100644
--- a/apps/client/src/common/utils/socket.ts
+++ b/apps/client/src/common/utils/socket.ts
@@ -216,6 +216,9 @@ export const connectSocket = () => {
case RefetchKey.ProjectRundowns:
ontimeQueryClient.invalidateQueries({ queryKey: PROJECT_RUNDOWNS });
break;
+ case RefetchKey.ProjectFiles:
+ ontimeQueryClient.invalidateQueries({ queryKey: PROJECT_RUNDOWNS });
+ break;
default: {
target satisfies never;
break;
diff --git a/apps/client/src/features/app-settings/panel/project-panel/ProjectList.tsx b/apps/client/src/features/app-settings/panel/project-panel/ProjectList.tsx
index ad4feb8d6..20ad55ce2 100644
--- a/apps/client/src/features/app-settings/panel/project-panel/ProjectList.tsx
+++ b/apps/client/src/features/app-settings/panel/project-panel/ProjectList.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { Suspense, useState } from 'react';
import { IoArrowDown, IoArrowUp } from 'react-icons/io5';
import Info from '../../../../common/components/info/Info';
@@ -11,11 +11,25 @@ import style from './ProjectPanel.module.scss';
type SortParameter = 'alphabetical' | 'modified';
export default function ProjectList() {
+ return (
+
+
+
+ }
+ >
+
+
+ );
+}
+
+function ProjectListSuspend() {
const [editingMode, setEditingMode] = useState(null);
const [editingFilename, setEditingFilename] = useState(null);
const [sortMode, setSortMode] = useState('modified-desc');
- const { data, refetch, status } = useOrderedProjectList(sortMode);
+ const { data, refetch } = useOrderedProjectList(sortMode);
const handleToggleEditMode = (editMode: EditMode, filename: string | null) => {
setEditingMode((prev) => (prev === editMode && filename === editingFilename ? null : editMode));
@@ -38,14 +52,6 @@ export default function ProjectList() {
});
};
- if (status === 'pending') {
- return (
-
- );
- }
-
const numProjects = data.reorderedProjectFiles.length;
return (
diff --git a/apps/server/src/services/project-service/ProjectService.ts b/apps/server/src/services/project-service/ProjectService.ts
index 3cad948c3..ce71bb886 100644
--- a/apps/server/src/services/project-service/ProjectService.ts
+++ b/apps/server/src/services/project-service/ProjectService.ts
@@ -1,9 +1,10 @@
import { copyFile } from 'fs/promises';
import { join } from 'path';
-import { DatabaseModel, LogOrigin, ProjectFileListResponse } from 'ontime-types';
+import { DatabaseModel, LogOrigin, ProjectFileListResponse, RefetchKey } from 'ontime-types';
import { getErrorMessage, getFirstRundown } from 'ontime-utils';
+import { sendRefetch } from '../../adapters/WebsocketAdapter.js';
import { parseCustomFields } from '../../api-data/custom-fields/customFields.parser.js';
import { parseDatabaseModel } from '../../api-data/db/db.parser.js';
import { getCurrentRundown } from '../../api-data/rundown/rundown.dao.js';
@@ -72,6 +73,9 @@ export async function getCurrentProject(): Promise<{ filename: string; pathToFil
// we know the project is loaded since we force initialisation above
const pathToFile = getPathToProject(currentProjectState.currentProjectName as string);
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return { filename: currentProjectState.currentProjectName as string, pathToFile };
}
@@ -105,6 +109,9 @@ async function loadProject(projectData: DatabaseModel, fileName: string, rundown
currentProjectName: fileName,
};
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return fileName;
}
@@ -113,6 +120,9 @@ async function loadProject(projectData: DatabaseModel, fileName: string, rundown
*/
export async function loadDemoProject(): Promise {
populateOntimeLogo();
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return createProject(config.demoProject, demoDb);
}
@@ -122,6 +132,9 @@ export async function loadDemoProject(): Promise {
*/
async function loadNewProject(): Promise {
const emptyProject = makeNewProject();
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return createProject(config.newProject, emptyProject);
}
@@ -142,6 +155,9 @@ async function handleCorruptedFile(filePath: string, fileName: string): Promise<
// and make a new file with the recovered data
const newPath = appendToName(filePath, '(recovered)');
await dockerSafeRename(filePath, newPath);
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return getFileNameFromPath(newPath);
}
@@ -162,6 +178,9 @@ async function handleMigratedFile(filePath: string, fileName: string): Promise {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return getFileNameFromPath(newPath);
}
@@ -200,6 +219,9 @@ export async function initialiseProject(): Promise {
}
}
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return loadNewProject();
}
@@ -231,6 +253,10 @@ export async function loadProjectFile(
}
const projectName = await loadProject(result.data, parsedFileName, options?.rundownId);
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return projectName;
}
@@ -241,6 +267,9 @@ export async function getProjectList(): Promise {
const files = await getProjectFiles();
const lastLoaded = await getLastLoaded();
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return {
files,
lastLoadedProject: lastLoaded?.projectName ? removeFileExtension(lastLoaded?.projectName) : '',
@@ -263,6 +292,10 @@ export async function duplicateProjectFile(originalFile: string, newFilename: st
const pathToDuplicate = getPathToProject(newFilename);
await copyFile(projectFilePath, pathToDuplicate);
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return;
}
@@ -291,8 +324,16 @@ export async function renameProjectFile(originalFile: string, newFilename: strin
const projectData = parseDatabaseModel(fileData);
const newFileName = await loadProject(projectData.data, newFilename);
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return newFileName;
}
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return newFilename;
}
@@ -304,6 +345,10 @@ export async function renameProjectFile(originalFile: string, newFilename: strin
export async function createProject(fileName: string, initialData: DatabaseModel): Promise {
const fileNameWithExtension = generateUniqueFileName(publicDir.projectsDir, ensureJsonExtension(fileName));
await loadProject(initialData, fileNameWithExtension);
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return fileNameWithExtension;
}
@@ -315,6 +360,10 @@ export async function createProject(fileName: string, initialData: DatabaseModel
export async function createProjectWithPatch(fileName: string, initialData: Partial): Promise {
const newProject = makeNewProject();
const sanitisedData = safeMerge(newProject, initialData);
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return createProject(fileName, sanitisedData);
}
@@ -331,6 +380,9 @@ export async function deleteProjectFile(filename: string) {
throw new Error('Project file not found');
}
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
await deleteFile(projectFilePath);
}
@@ -375,5 +427,9 @@ export async function patchCurrentProject(data: Partial) {
}
const updatedData = await getDataProvider().getData();
+
+ setImmediate(() => {
+ sendRefetch(RefetchKey.ProjectFiles);
+ });
return updatedData;
}
diff --git a/packages/types/src/api/websocket/refetch.type.ts b/packages/types/src/api/websocket/refetch.type.ts
index 1f7fe2d31..9ef5ff29a 100644
--- a/packages/types/src/api/websocket/refetch.type.ts
+++ b/packages/types/src/api/websocket/refetch.type.ts
@@ -1,6 +1,7 @@
export enum RefetchKey {
All = 'all',
CustomFields = 'custom-fields',
+ ProjectFiles = 'project-files',
ProjectData = 'project-data',
ProjectRundowns = 'project-rundowns',
Report = 'report',