mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-20 06:29:07 +00:00
refactor: improve the amount of GET requests for translation assets (#2058)
* refactor: replace traslation hook refetch time with stale time * refactor: make it the service responsebillety to send refetch keys for asset changes
This commit is contained in:
committed by
GitHub
parent
2d3c8e7eb2
commit
23a44b2f04
@@ -1,16 +1,16 @@
|
|||||||
import { useQuery } from '@tanstack/react-query';
|
import { useQuery } from '@tanstack/react-query';
|
||||||
import { langEn } from 'ontime-types';
|
import { langEn } from 'ontime-types';
|
||||||
|
import { MILLIS_PER_HOUR } from 'ontime-utils';
|
||||||
|
|
||||||
import { getUserTranslation } from '../../common/api/assets';
|
import { getUserTranslation } from '../../common/api/assets';
|
||||||
import { TRANSLATION } from '../../common/api/constants';
|
import { TRANSLATION } from '../../common/api/constants';
|
||||||
import { queryRefetchIntervalSlow } from '../../ontimeConfig';
|
|
||||||
|
|
||||||
export function useCustomTranslation() {
|
export function useCustomTranslation() {
|
||||||
const { data, status, refetch } = useQuery({
|
const { data, status, refetch } = useQuery({
|
||||||
queryKey: TRANSLATION,
|
queryKey: TRANSLATION,
|
||||||
queryFn: ({ signal }) => getUserTranslation({ signal }),
|
queryFn: ({ signal }) => getUserTranslation({ signal }),
|
||||||
placeholderData: (previousData, _previousQuery) => previousData,
|
placeholderData: (previousData, _previousQuery) => previousData,
|
||||||
refetchInterval: queryRefetchIntervalSlow,
|
staleTime: MILLIS_PER_HOUR,
|
||||||
});
|
});
|
||||||
return { data: data ?? langEn, status, refetch };
|
return { data: data ?? langEn, status, refetch };
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import express from 'express';
|
import express from 'express';
|
||||||
import type { Request, Response } from 'express';
|
import type { Request, Response, Router } from 'express';
|
||||||
import { type ErrorResponse, RefetchKey } from 'ontime-types';
|
import { type ErrorResponse, RefetchKey } from 'ontime-types';
|
||||||
import { getErrorMessage } from 'ontime-utils';
|
import { getErrorMessage } from 'ontime-utils';
|
||||||
|
|
||||||
@@ -8,7 +8,7 @@ import { defaultCss } from '../../bundle/bundledCss.js';
|
|||||||
import { readCssFile, writeCssFile, writeUserTranslation } from './assets.service.js';
|
import { readCssFile, writeCssFile, writeUserTranslation } from './assets.service.js';
|
||||||
import { validatePostCss, validatePostTranslation } from './assets.validation.js';
|
import { validatePostCss, validatePostTranslation } from './assets.validation.js';
|
||||||
|
|
||||||
export const router = express.Router();
|
export const router: Router = express.Router();
|
||||||
|
|
||||||
router.get('/css', async (_req: Request, res: Response<string | ErrorResponse>) => {
|
router.get('/css', async (_req: Request, res: Response<string | ErrorResponse>) => {
|
||||||
try {
|
try {
|
||||||
@@ -24,7 +24,6 @@ router.post('/css', validatePostCss, async (req: Request, res: Response<never |
|
|||||||
const { css } = req.body;
|
const { css } = req.body;
|
||||||
try {
|
try {
|
||||||
await writeCssFile(css);
|
await writeCssFile(css);
|
||||||
sendRefetch(RefetchKey.CssOverride);
|
|
||||||
res.status(204).send();
|
res.status(204).send();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
const message = getErrorMessage(error);
|
const message = getErrorMessage(error);
|
||||||
@@ -53,7 +52,6 @@ router.post('/translations', validatePostTranslation, async (req: Request, res:
|
|||||||
|
|
||||||
try {
|
try {
|
||||||
await writeUserTranslation(translation);
|
await writeUserTranslation(translation);
|
||||||
sendRefetch(RefetchKey.Translation);
|
|
||||||
res.status(204).send();
|
res.status(204).send();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
const message = getErrorMessage(error);
|
const message = getErrorMessage(error);
|
||||||
|
|||||||
@@ -1,8 +1,9 @@
|
|||||||
import { existsSync } from 'node:fs';
|
import { existsSync } from 'node:fs';
|
||||||
import { readFile, writeFile } from 'node:fs/promises';
|
import { readFile, writeFile } from 'node:fs/promises';
|
||||||
|
|
||||||
import type { TranslationObject } from 'ontime-types';
|
import { RefetchKey, type TranslationObject } from 'ontime-types';
|
||||||
|
|
||||||
|
import { sendRefetch } from '../../adapters/WebsocketAdapter.js';
|
||||||
import { defaultCss } from '../../bundle/bundledCss.js';
|
import { defaultCss } from '../../bundle/bundledCss.js';
|
||||||
import { publicFiles } from '../../setup/index.js';
|
import { publicFiles } from '../../setup/index.js';
|
||||||
|
|
||||||
@@ -33,6 +34,9 @@ export async function writeCssFile(css: string) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
await writeFile(path, css, { encoding: 'utf8' });
|
await writeFile(path, css, { encoding: 'utf8' });
|
||||||
|
setImmediate(() => {
|
||||||
|
sendRefetch(RefetchKey.CssOverride);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -43,4 +47,7 @@ export async function writeUserTranslation(translations: TranslationObject) {
|
|||||||
const path = publicFiles.translationsFile;
|
const path = publicFiles.translationsFile;
|
||||||
const translationsString = JSON.stringify(translations, null, 2);
|
const translationsString = JSON.stringify(translations, null, 2);
|
||||||
await writeFile(path, translationsString, { encoding: 'utf8' });
|
await writeFile(path, translationsString, { encoding: 'utf8' });
|
||||||
|
setImmediate(() => {
|
||||||
|
sendRefetch(RefetchKey.Translation);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user