';
-
- for (let i = 0, length = task.Triggers.length; i < length; i++) {
- const trigger = task.Triggers[i];
-
- html += '
';
- html += '
';
- if (trigger.MaxRuntimeTicks) {
- html += '
';
- } else {
- html += '
';
- }
- html += "
" + ScheduledTaskPage.getTriggerFriendlyName(trigger) + '
';
- if (trigger.MaxRuntimeTicks) {
- html += '
';
- const hours = trigger.MaxRuntimeTicks / 36e9;
- if (hours == 1) {
- html += globalize.translate('ValueTimeLimitSingleHour');
- } else {
- html += globalize.translate('ValueTimeLimitMultiHour', hours);
- }
- html += '
';
- }
-
- html += '
';
- html += '
';
- html += '
';
- }
-
- html += '
';
- context.querySelector('.taskTriggers').innerHTML = html;
- },
- // TODO: Replace this mess with date-fns and remove datetime completely
- getTriggerFriendlyName: function (trigger) {
- if (trigger.Type == 'DailyTrigger') {
- return globalize.translate('DailyAt', ScheduledTaskPage.getDisplayTime(trigger.TimeOfDayTicks));
- }
-
- if (trigger.Type == 'WeeklyTrigger') {
- // TODO: The day of week isn't localised as well
- return globalize.translate('WeeklyAt', trigger.DayOfWeek, ScheduledTaskPage.getDisplayTime(trigger.TimeOfDayTicks));
- }
-
- if (trigger.Type == 'SystemEventTrigger' && trigger.SystemEvent == 'WakeFromSleep') {
- return globalize.translate('OnWakeFromSleep');
- }
-
- if (trigger.Type == 'IntervalTrigger') {
- const hours = trigger.IntervalTicks / 36e9;
-
- if (hours == 0.25) {
- return globalize.translate('EveryXMinutes', '15');
- }
- if (hours == 0.5) {
- return globalize.translate('EveryXMinutes', '30');
- }
- if (hours == 0.75) {
- return globalize.translate('EveryXMinutes', '45');
- }
- if (hours == 1) {
- return globalize.translate('EveryHour');
- }
-
- return globalize.translate('EveryXHours', hours);
- }
-
- if (trigger.Type == 'StartupTrigger') {
- return globalize.translate('OnApplicationStartup');
- }
-
- return trigger.Type;
- },
- getDisplayTime: function (ticks) {
- const ms = ticks / 1e4;
- const now = new Date();
- now.setHours(0, 0, 0, 0);
- now.setTime(now.getTime() + ms);
- return datetime.getDisplayTime(now);
- },
- showAddTriggerPopup: function (view) {
- view.querySelector('#selectTriggerType').value = 'DailyTrigger';
- view.querySelector('#selectTriggerType').dispatchEvent(new CustomEvent('change', {}));
- view.querySelector('#popupAddTrigger').classList.remove('hide');
- },
- confirmDeleteTrigger: function (view, index) {
- confirm(globalize.translate('MessageDeleteTaskTrigger'), globalize.translate('HeaderDeleteTaskTrigger')).then(function () {
- ScheduledTaskPage.deleteTrigger(view, index);
- });
- },
- deleteTrigger: function (view, index) {
- loading.show();
- const id = getParameterByName('id');
- ApiClient.getScheduledTask(id).then(function (task) {
- task.Triggers.splice(index, 1);
- ApiClient.updateScheduledTaskTriggers(task.Id, task.Triggers).then(function () {
- ScheduledTaskPage.refreshScheduledTask(view);
- });
- });
- },
- refreshTriggerFields: function (page, triggerType) {
- if (triggerType == 'DailyTrigger') {
- page.querySelector('#fldTimeOfDay').classList.remove('hide');
- page.querySelector('#fldDayOfWeek').classList.add('hide');
- page.querySelector('#fldSelectSystemEvent').classList.add('hide');
- page.querySelector('#fldSelectInterval').classList.add('hide');
- page.querySelector('#selectTimeOfDay').setAttribute('required', 'required');
- } else if (triggerType == 'WeeklyTrigger') {
- page.querySelector('#fldTimeOfDay').classList.remove('hide');
- page.querySelector('#fldDayOfWeek').classList.remove('hide');
- page.querySelector('#fldSelectSystemEvent').classList.add('hide');
- page.querySelector('#fldSelectInterval').classList.add('hide');
- page.querySelector('#selectTimeOfDay').setAttribute('required', 'required');
- } else if (triggerType == 'SystemEventTrigger') {
- page.querySelector('#fldTimeOfDay').classList.add('hide');
- page.querySelector('#fldDayOfWeek').classList.add('hide');
- page.querySelector('#fldSelectSystemEvent').classList.remove('hide');
- page.querySelector('#fldSelectInterval').classList.add('hide');
- page.querySelector('#selectTimeOfDay').removeAttribute('required');
- } else if (triggerType == 'IntervalTrigger') {
- page.querySelector('#fldTimeOfDay').classList.add('hide');
- page.querySelector('#fldDayOfWeek').classList.add('hide');
- page.querySelector('#fldSelectSystemEvent').classList.add('hide');
- page.querySelector('#fldSelectInterval').classList.remove('hide');
- page.querySelector('#selectTimeOfDay').removeAttribute('required');
- } else if (triggerType == 'StartupTrigger') {
- page.querySelector('#fldTimeOfDay').classList.add('hide');
- page.querySelector('#fldDayOfWeek').classList.add('hide');
- page.querySelector('#fldSelectSystemEvent').classList.add('hide');
- page.querySelector('#fldSelectInterval').classList.add('hide');
- page.querySelector('#selectTimeOfDay').removeAttribute('required');
- }
- },
- getTriggerToAdd: function (page) {
- const trigger = {
- Type: page.querySelector('#selectTriggerType').value
- };
-
- if (trigger.Type == 'DailyTrigger') {
- trigger.TimeOfDayTicks = page.querySelector('#selectTimeOfDay').value;
- } else if (trigger.Type == 'WeeklyTrigger') {
- trigger.DayOfWeek = page.querySelector('#selectDayOfWeek').value;
- trigger.TimeOfDayTicks = page.querySelector('#selectTimeOfDay').value;
- } else if (trigger.Type == 'SystemEventTrigger') {
- trigger.SystemEvent = page.querySelector('#selectSystemEvent').value;
- } else if (trigger.Type == 'IntervalTrigger') {
- trigger.IntervalTicks = page.querySelector('#selectInterval').value;
- }
-
- let timeLimit = page.querySelector('#txtTimeLimit').value || '0';
- timeLimit = parseFloat(timeLimit) * 3600000;
-
- trigger.MaxRuntimeTicks = timeLimit * 1e4 || null;
-
- return trigger;
- }
-};
-export default function (view) {
- function onSubmit(e) {
- loading.show();
- const id = getParameterByName('id');
- ApiClient.getScheduledTask(id).then(function (task) {
- task.Triggers.push(ScheduledTaskPage.getTriggerToAdd(view));
- ApiClient.updateScheduledTaskTriggers(task.Id, task.Triggers).then(function () {
- document.querySelector('#popupAddTrigger').classList.add('hide');
- ScheduledTaskPage.refreshScheduledTask(view);
- });
- });
- e.preventDefault();
- }
-
- view.querySelector('.addTriggerForm').addEventListener('submit', onSubmit);
- fillTimeOfDay(view.querySelector('#selectTimeOfDay'));
- view.querySelector('#popupAddTrigger').parentNode.trigger(new Event('create'));
- view.querySelector('.selectTriggerType').addEventListener('change', function () {
- ScheduledTaskPage.refreshTriggerFields(view, this.value);
- });
- view.querySelector('.btnAddTrigger').addEventListener('click', function () {
- ScheduledTaskPage.showAddTriggerPopup(view);
- });
- view.addEventListener('click', function (e) {
- const btnDeleteTrigger = dom.parentWithClass(e.target, 'btnDeleteTrigger');
-
- if (btnDeleteTrigger) {
- ScheduledTaskPage.confirmDeleteTrigger(view, parseInt(btnDeleteTrigger.getAttribute('data-index'), 10));
- }
- });
- view.addEventListener('viewshow', function () {
- ScheduledTaskPage.refreshScheduledTask(view);
- });
-}
-
diff --git a/src/apps/dashboard/features/scheduledtasks/api/useStartTask.ts b/src/apps/dashboard/features/tasks/api/useStartTask.ts
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/api/useStartTask.ts
rename to src/apps/dashboard/features/tasks/api/useStartTask.ts
diff --git a/src/apps/dashboard/features/scheduledtasks/api/useStopTask.ts b/src/apps/dashboard/features/tasks/api/useStopTask.ts
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/api/useStopTask.ts
rename to src/apps/dashboard/features/tasks/api/useStopTask.ts
diff --git a/src/apps/dashboard/features/tasks/api/useTask.ts b/src/apps/dashboard/features/tasks/api/useTask.ts
new file mode 100644
index 0000000000..98800420b4
--- /dev/null
+++ b/src/apps/dashboard/features/tasks/api/useTask.ts
@@ -0,0 +1,35 @@
+import type { ScheduledTasksApiGetTaskRequest } from '@jellyfin/sdk/lib/generated-client/api/scheduled-tasks-api';
+import type { AxiosRequestConfig } from 'axios';
+import type { Api } from '@jellyfin/sdk';
+import { getScheduledTasksApi } from '@jellyfin/sdk/lib/utils/api/scheduled-tasks-api';
+import { useQuery } from '@tanstack/react-query';
+
+import { useApi } from 'hooks/useApi';
+
+export const QUERY_KEY = 'Task';
+
+const fetchTask = async (
+ api: Api,
+ params: ScheduledTasksApiGetTaskRequest,
+ options?: AxiosRequestConfig
+) => {
+ if (!api) {
+ console.warn('[fetchTasks] No API instance available');
+ return;
+ }
+
+ const response = await getScheduledTasksApi(api).getTask(params, options);
+
+ return response.data;
+};
+
+export const useTask = (params: ScheduledTasksApiGetTaskRequest) => {
+ const { api } = useApi();
+
+ return useQuery({
+ queryKey: [ QUERY_KEY, params.taskId ],
+ queryFn: ({ signal }) =>
+ fetchTask(api!, params, { signal }),
+ enabled: !!api
+ });
+};
diff --git a/src/apps/dashboard/features/scheduledtasks/api/useTasks.ts b/src/apps/dashboard/features/tasks/api/useTasks.ts
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/api/useTasks.ts
rename to src/apps/dashboard/features/tasks/api/useTasks.ts
diff --git a/src/apps/dashboard/features/tasks/api/useUpdateTask.ts b/src/apps/dashboard/features/tasks/api/useUpdateTask.ts
new file mode 100644
index 0000000000..8f34c0df38
--- /dev/null
+++ b/src/apps/dashboard/features/tasks/api/useUpdateTask.ts
@@ -0,0 +1,22 @@
+import { ScheduledTasksApiUpdateTaskRequest } from '@jellyfin/sdk/lib/generated-client/api/scheduled-tasks-api';
+import { getScheduledTasksApi } from '@jellyfin/sdk/lib/utils/api/scheduled-tasks-api';
+import { useMutation } from '@tanstack/react-query';
+import { useApi } from 'hooks/useApi';
+import { queryClient } from 'utils/query/queryClient';
+import { QUERY_KEY } from './useTasks';
+
+export const useUpdateTask = () => {
+ const { api } = useApi();
+
+ return useMutation({
+ mutationFn: (params: ScheduledTasksApiUpdateTaskRequest) => (
+ getScheduledTasksApi(api!)
+ .updateTask(params)
+ ),
+ onSuccess: () => {
+ void queryClient.invalidateQueries({
+ queryKey: [ QUERY_KEY ]
+ });
+ }
+ });
+};
diff --git a/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx b/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
new file mode 100644
index 0000000000..53404885fc
--- /dev/null
+++ b/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
@@ -0,0 +1,169 @@
+import React, { FunctionComponent, useCallback, useMemo, useState } from 'react';
+import Dialog from '@mui/material/Dialog';
+import Button from '@mui/material/Button';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import MenuItem from '@mui/material/MenuItem';
+import Stack from '@mui/material/Stack';
+import TextField from '@mui/material/TextField';
+import type { TaskTriggerInfo } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info';
+import { TaskTriggerInfoType } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info-type';
+import { DayOfWeek } from '@jellyfin/sdk/lib/generated-client/models/day-of-week';
+import globalize from 'lib/globalize';
+import { getTimeOfDayOptions } from '../utils/edit';
+import { useLocale } from 'hooks/useLocale';
+
+type IProps = {
+ open: boolean,
+ title: string,
+ onClose?: () => void,
+ onSubmit?: (trigger: TaskTriggerInfo) => void
+};
+
+const NewTriggerForm: FunctionComponent
= ({ open, title, onClose, onSubmit }: IProps) => {
+ const { dateFnsLocale } = useLocale();
+ const [triggerType, setTriggerType] = useState('DailyTrigger');
+
+ const timeOfDayOptions = useMemo(() => getTimeOfDayOptions(dateFnsLocale), [dateFnsLocale]);
+
+ const onTriggerTypeChange = useCallback((e: React.ChangeEvent) => {
+ setTriggerType(e.target.value);
+ }, []);
+
+ return (
+
+ );
+};
+
+export default NewTriggerForm;
diff --git a/src/apps/dashboard/features/scheduledtasks/components/Task.tsx b/src/apps/dashboard/features/tasks/components/Task.tsx
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/components/Task.tsx
rename to src/apps/dashboard/features/tasks/components/Task.tsx
diff --git a/src/apps/dashboard/features/scheduledtasks/components/TaskLastRan.tsx b/src/apps/dashboard/features/tasks/components/TaskLastRan.tsx
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/components/TaskLastRan.tsx
rename to src/apps/dashboard/features/tasks/components/TaskLastRan.tsx
diff --git a/src/apps/dashboard/features/scheduledtasks/components/TaskProgress.tsx b/src/apps/dashboard/features/tasks/components/TaskProgress.tsx
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/components/TaskProgress.tsx
rename to src/apps/dashboard/features/tasks/components/TaskProgress.tsx
diff --git a/src/apps/dashboard/features/tasks/components/TaskTriggerCell.tsx b/src/apps/dashboard/features/tasks/components/TaskTriggerCell.tsx
new file mode 100644
index 0000000000..9f4f8502c9
--- /dev/null
+++ b/src/apps/dashboard/features/tasks/components/TaskTriggerCell.tsx
@@ -0,0 +1,34 @@
+import React, { FC } from 'react';
+import type { MRT_Cell, MRT_RowData } from 'material-react-table';
+import { useLocale } from 'hooks/useLocale';
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+import { getTriggerFriendlyName } from '../utils/edit';
+import type { TaskTriggerInfo } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info';
+import globalize from 'lib/globalize';
+
+interface CellProps {
+ cell: MRT_Cell
+}
+
+const TaskTriggerCell: FC = ({ cell }) => {
+ const { dateFnsLocale } = useLocale();
+ const trigger = cell.getValue();
+
+ const timeLimitHours = trigger.MaxRuntimeTicks ? trigger.MaxRuntimeTicks / 36e9 : false;
+
+ return (
+
+ {getTriggerFriendlyName(trigger, dateFnsLocale)}
+ {timeLimitHours && (
+
+ {timeLimitHours == 1 ?
+ globalize.translate('ValueTimeLimitSingleHour') :
+ globalize.translate('ValueTimeLimitMultiHour', timeLimitHours)}
+
+ )}
+
+ );
+};
+
+export default TaskTriggerCell;
diff --git a/src/apps/dashboard/features/scheduledtasks/components/Tasks.tsx b/src/apps/dashboard/features/tasks/components/Tasks.tsx
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/components/Tasks.tsx
rename to src/apps/dashboard/features/tasks/components/Tasks.tsx
diff --git a/src/apps/dashboard/features/scheduledtasks/types/taskProps.ts b/src/apps/dashboard/features/tasks/types/taskProps.ts
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/types/taskProps.ts
rename to src/apps/dashboard/features/tasks/types/taskProps.ts
diff --git a/src/apps/dashboard/features/tasks/utils/edit.ts b/src/apps/dashboard/features/tasks/utils/edit.ts
new file mode 100644
index 0000000000..2637465710
--- /dev/null
+++ b/src/apps/dashboard/features/tasks/utils/edit.ts
@@ -0,0 +1,64 @@
+import type { TaskTriggerInfo } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info';
+import { format, Locale, parse } from 'date-fns';
+import globalize from 'lib/globalize';
+
+function getDisplayTime(ticks: number, locale: Locale) {
+ const ms = ticks / 1e4;
+ const now = new Date();
+ now.setHours(0, 0, 0, 0);
+ now.setTime(now.getTime() + ms);
+ return format(now, 'p', { locale: locale });
+}
+
+export function getTimeOfDayOptions(locale: Locale) {
+ const options = [];
+
+ for (let i = 0; i < 86400000; i += 900000) {
+ options.push({
+ name: getDisplayTime(i * 10000, locale),
+ value: i * 10000
+ });
+ }
+
+ return options;
+}
+
+function getIntervalTriggerTime(ticks: number) {
+ const hours = ticks / 36e9;
+
+ switch (hours) {
+ case 0.25:
+ return globalize.translate('EveryXMinutes', '15');
+ case 0.5:
+ return globalize.translate('EveryXMinutes', '30');
+ case 0.75:
+ return globalize.translate('EveryXMinutes', '45');
+ case 1:
+ return globalize.translate('EveryHour');
+ default:
+ return globalize.translate('EveryXHours', hours);
+ }
+}
+
+function localizeDayOfWeek(dayOfWeek: string | null | undefined, locale: Locale) {
+ if (!dayOfWeek) return '';
+
+ const parsedDayOfWeek = parse(dayOfWeek, 'cccc', new Date());
+
+ return format(parsedDayOfWeek, 'cccc', { locale: locale });
+}
+
+export function getTriggerFriendlyName(trigger: TaskTriggerInfo, locale: Locale) {
+ switch (trigger.Type) {
+ case 'DailyTrigger':
+ return globalize.translate('DailyAt', getDisplayTime(trigger.TimeOfDayTicks || 0, locale));
+ case 'WeeklyTrigger':
+ return globalize.translate('WeeklyAt', localizeDayOfWeek(trigger.DayOfWeek, locale), getDisplayTime(trigger.TimeOfDayTicks || 0, locale));
+ case 'IntervalTrigger':
+ return getIntervalTriggerTime(trigger.IntervalTicks || 0);
+ case 'StartupTrigger':
+ return globalize.translate('OnApplicationStartup');
+ default:
+ return trigger.Type;
+ }
+}
diff --git a/src/apps/dashboard/features/scheduledtasks/utils/tasks.ts b/src/apps/dashboard/features/tasks/utils/tasks.ts
similarity index 100%
rename from src/apps/dashboard/features/scheduledtasks/utils/tasks.ts
rename to src/apps/dashboard/features/tasks/utils/tasks.ts
diff --git a/src/apps/dashboard/routes/_asyncRoutes.ts b/src/apps/dashboard/routes/_asyncRoutes.ts
index 5a7398da39..d66c4ed13d 100644
--- a/src/apps/dashboard/routes/_asyncRoutes.ts
+++ b/src/apps/dashboard/routes/_asyncRoutes.ts
@@ -15,6 +15,7 @@ export const ASYNC_ADMIN_ROUTES: AsyncRoute[] = [
{ path: 'playback/trickplay', type: AppType.Dashboard },
{ path: 'plugins/:pluginId', page: 'plugins/plugin', type: AppType.Dashboard },
{ path: 'tasks', type: AppType.Dashboard },
+ { path: 'tasks/edit', type: AppType.Dashboard },
{ path: 'users', type: AppType.Dashboard },
{ path: 'users/access', type: AppType.Dashboard },
{ path: 'users/add', type: AppType.Dashboard },
diff --git a/src/apps/dashboard/routes/_legacyRoutes.ts b/src/apps/dashboard/routes/_legacyRoutes.ts
index b690b45440..6cd162d88d 100644
--- a/src/apps/dashboard/routes/_legacyRoutes.ts
+++ b/src/apps/dashboard/routes/_legacyRoutes.ts
@@ -93,12 +93,5 @@ export const LEGACY_ADMIN_ROUTES: LegacyRoute[] = [
controller: 'plugins/installed/index',
view: 'plugins/installed/index.html'
}
- }, {
- path: 'tasks/edit',
- pageProps: {
- appType: AppType.Dashboard,
- controller: 'scheduledtasks/scheduledtask',
- view: 'scheduledtasks/scheduledtask.html'
- }
}
];
diff --git a/src/apps/dashboard/routes/tasks/edit.tsx b/src/apps/dashboard/routes/tasks/edit.tsx
new file mode 100644
index 0000000000..5120f80f05
--- /dev/null
+++ b/src/apps/dashboard/routes/tasks/edit.tsx
@@ -0,0 +1,173 @@
+import React, { useCallback, useMemo, useState } from 'react';
+import Page from 'components/Page';
+import { useSearchParams } from 'react-router-dom';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import AddIcon from '@mui/icons-material/Add';
+import IconButton from '@mui/material/IconButton';
+import Tooltip from '@mui/material/Tooltip';
+import RemoveCircleIcon from '@mui/icons-material/RemoveCircle';
+import Loading from 'components/loading/LoadingComponent';
+import { MRT_ColumnDef, MRT_Table, useMaterialReactTable } from 'material-react-table';
+import type { TaskTriggerInfo } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info';
+import globalize from '../../../../lib/globalize';
+import { useTask } from 'apps/dashboard/features/tasks/api/useTask';
+import { useUpdateTask } from 'apps/dashboard/features/tasks/api/useUpdateTask';
+import ConfirmDialog from 'components/ConfirmDialog';
+import TaskTriggerCell from 'apps/dashboard/features/tasks/components/TaskTriggerCell';
+import NewTriggerForm from 'apps/dashboard/features/tasks/components/NewTriggerForm';
+
+const TaskEdit = () => {
+ const [ searchParams ] = useSearchParams();
+ const updateTask = useUpdateTask();
+ const taskId = searchParams.get('id');
+ const { data: task, isLoading } = useTask({ taskId: taskId || '' });
+ const [ isAddTriggerDialogOpen, setIsAddTriggerDialogOpen ] = useState(false);
+ const [ isRemoveConfirmOpen, setIsRemoveConfirmOpen ] = useState(false);
+ const [ pendingDeleteTrigger, setPendingDeleteTrigger ] = useState(null);
+
+ const onCloseRemoveConfirmDialog = useCallback(() => {
+ setPendingDeleteTrigger(null);
+ setIsRemoveConfirmOpen(false);
+ }, []);
+
+ const onDeleteTrigger = useCallback((trigger: TaskTriggerInfo | null | undefined) => {
+ if (trigger) {
+ setPendingDeleteTrigger(trigger);
+ setIsRemoveConfirmOpen(true);
+ }
+ }, []);
+
+ const onConfirmDelete = useCallback(() => {
+ const triggersRemaining = task?.Triggers?.filter(trigger => trigger != pendingDeleteTrigger);
+
+ if (task?.Id && triggersRemaining) {
+ updateTask.mutate({
+ taskId: task.Id,
+ taskTriggerInfo: triggersRemaining
+ });
+ setIsRemoveConfirmOpen(false);
+ }
+ }, [task, pendingDeleteTrigger, updateTask]);
+
+ const showAddTriggerDialog = useCallback(() => {
+ setIsAddTriggerDialogOpen(true);
+ }, []);
+
+ const handleNewTriggerDialogClose = useCallback(() => {
+ setIsAddTriggerDialogOpen(false);
+ }, []);
+
+ const onNewTriggerSubmit = useCallback((trigger: TaskTriggerInfo) => {
+ if (task?.Triggers && task?.Id) {
+ const triggers = [...task.Triggers, trigger];
+
+ updateTask.mutate({
+ taskId: task.Id,
+ taskTriggerInfo: triggers
+ });
+ setIsAddTriggerDialogOpen(false);
+ }
+ }, [task, updateTask]);
+
+ const columns = useMemo[]>(() => [
+ {
+ id: 'TriggerTime',
+ accessorFn: row => row,
+ Cell: TaskTriggerCell,
+ header: globalize.translate('LabelTime')
+ }
+ ], []);
+
+ const table = useMaterialReactTable({
+ columns,
+ data: task?.Triggers || [],
+
+ enableSorting: false,
+ enableFilters: false,
+ enableColumnActions: false,
+ enablePagination: false,
+
+ state: {
+ isLoading
+ },
+
+ muiTableContainerProps: {
+ sx: {
+ maxHeight: 'calc(100% - 7rem)' // 2 x 3.5rem for header and footer
+ }
+ },
+
+ // Custom actions
+ enableRowActions: true,
+ positionActionsColumn: 'last',
+ displayColumnDefOptions: {
+ 'mrt-row-actions': {
+ header: ''
+ }
+ },
+ renderRowActions: ({ row }) => {
+ return (
+
+
+ onDeleteTrigger(row.original)}
+ >
+
+
+
+
+ );
+ }
+ });
+
+ if (isLoading || !task) {
+ return ;
+ }
+
+ return (
+
+
+
+
+
+
+ {task.Name}
+ {task.Description}
+ }
+ onClick={showAddTriggerDialog}
+ >{globalize.translate('ButtonAddScheduledTaskTrigger')}
+
+
+
+
+
+ );
+};
+
+export default TaskEdit;
diff --git a/src/apps/dashboard/routes/tasks/index.tsx b/src/apps/dashboard/routes/tasks/index.tsx
index f742ef8ede..232fb34950 100644
--- a/src/apps/dashboard/routes/tasks/index.tsx
+++ b/src/apps/dashboard/routes/tasks/index.tsx
@@ -3,10 +3,10 @@ import Page from 'components/Page';
import globalize from 'lib/globalize';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
-import { QUERY_KEY, useTasks } from '../../features/scheduledtasks/api/useTasks';
-import { getCategories, getTasksByCategory } from '../../features/scheduledtasks/utils/tasks';
+import { QUERY_KEY, useTasks } from '../../features/tasks/api/useTasks';
+import { getCategories, getTasksByCategory } from '../../features/tasks/utils/tasks';
import Loading from 'components/loading/LoadingComponent';
-import Tasks from '../../features/scheduledtasks/components/Tasks';
+import Tasks from '../../features/tasks/components/Tasks';
import type { TaskInfo } from '@jellyfin/sdk/lib/generated-client/models/task-info';
import { SessionMessageType } from '@jellyfin/sdk/lib/generated-client/models/session-message-type';
import serverNotifications from 'scripts/serverNotifications';
From 934a05cffa4bb141126459091e8f1afb69892f64 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Sun, 23 Feb 2025 14:39:15 +0300
Subject: [PATCH 02/10] Localize interval
---
.../tasks/components/NewTriggerForm.tsx | 20 +++++++------------
.../tasks/constants/intervalDuration.ts | 13 ++++++++++++
.../dashboard/features/tasks/utils/edit.ts | 18 ++++++++++++++++-
3 files changed, 37 insertions(+), 14 deletions(-)
create mode 100644 src/apps/dashboard/features/tasks/constants/intervalDuration.ts
diff --git a/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx b/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
index 53404885fc..53d7663f3b 100644
--- a/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
+++ b/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
@@ -11,7 +11,7 @@ import type { TaskTriggerInfo } from '@jellyfin/sdk/lib/generated-client/models/
import { TaskTriggerInfoType } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info-type';
import { DayOfWeek } from '@jellyfin/sdk/lib/generated-client/models/day-of-week';
import globalize from 'lib/globalize';
-import { getTimeOfDayOptions } from '../utils/edit';
+import { getIntervalOptions, getTimeOfDayOptions } from '../utils/edit';
import { useLocale } from 'hooks/useLocale';
type IProps = {
@@ -27,6 +27,8 @@ const NewTriggerForm: FunctionComponent = ({ open, title, onClose, onSub
const timeOfDayOptions = useMemo(() => getTimeOfDayOptions(dateFnsLocale), [dateFnsLocale]);
+ const intervalOptions = useMemo(() => getIntervalOptions(dateFnsLocale), [dateFnsLocale]);
+
const onTriggerTypeChange = useCallback((e: React.ChangeEvent) => {
setTriggerType(e.target.value);
}, []);
@@ -124,20 +126,12 @@ const NewTriggerForm: FunctionComponent = ({ open, title, onClose, onSub
name='Interval'
select
fullWidth
- defaultValue={'9000000000'}
+ defaultValue={intervalOptions[0].value}
label={globalize.translate('LabelEveryXMinutes')}
>
-
-
-
-
-
-
-
-
-
-
-
+ {intervalOptions.map((option) => {
+ return ;
+ })}
)}
diff --git a/src/apps/dashboard/features/tasks/constants/intervalDuration.ts b/src/apps/dashboard/features/tasks/constants/intervalDuration.ts
new file mode 100644
index 0000000000..01bd6ca7f5
--- /dev/null
+++ b/src/apps/dashboard/features/tasks/constants/intervalDuration.ts
@@ -0,0 +1,13 @@
+export const INTERVAL_DURATION: number[] = [
+ 9000000000, // 15 minutes
+ 18000000000, // 30 minutes
+ 27000000000, // 45 minutes
+ 36000000000, // 1 hour
+ 72000000000, // 2 hours
+ 108000000000, // 3 hours
+ 144000000000, // 4 hours
+ 216000000000, // 6 hours
+ 288000000000, // 8 hours
+ 432000000000, // 12 hours
+ 864000000000 // 24 hours
+];
diff --git a/src/apps/dashboard/features/tasks/utils/edit.ts b/src/apps/dashboard/features/tasks/utils/edit.ts
index 2637465710..e71f563a71 100644
--- a/src/apps/dashboard/features/tasks/utils/edit.ts
+++ b/src/apps/dashboard/features/tasks/utils/edit.ts
@@ -1,6 +1,7 @@
import type { TaskTriggerInfo } from '@jellyfin/sdk/lib/generated-client/models/task-trigger-info';
-import { format, Locale, parse } from 'date-fns';
+import { format, formatDistanceStrict, Locale, parse } from 'date-fns';
import globalize from 'lib/globalize';
+import { INTERVAL_DURATION } from '../constants/intervalDuration';
function getDisplayTime(ticks: number, locale: Locale) {
const ms = ticks / 1e4;
@@ -23,6 +24,21 @@ export function getTimeOfDayOptions(locale: Locale) {
return options;
}
+export function getIntervalOptions(locale: Locale) {
+ const options = [];
+
+ for (const ticksDuration of INTERVAL_DURATION) {
+ const durationMs = Math.floor(ticksDuration / 1e4);
+ const unit = durationMs < 36e5 ? 'minute' : 'hour';
+ options.push({
+ name: formatDistanceStrict(0, durationMs, { locale: locale, unit: unit }),
+ value: ticksDuration
+ });
+ }
+
+ return options;
+}
+
function getIntervalTriggerTime(ticks: number) {
const hours = ticks / 36e9;
From 145c0700b13133d57590cc74308a2a08bccfdb67 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Sun, 23 Feb 2025 14:54:25 +0300
Subject: [PATCH 03/10] Cleanup
---
.../dashboard/features/tasks/api/useTask.ts | 5 --
.../dashboard/features/tasks/api/useTasks.ts | 2 +-
.../features/tasks/api/useUpdateTask.ts | 2 +-
.../tasks/components/NewTriggerForm.tsx | 75 ++++++++++---------
...tervalDuration.ts => intervalDurations.ts} | 2 +-
.../dashboard/features/tasks/utils/edit.ts | 4 +-
src/apps/dashboard/routes/tasks/edit.tsx | 4 +-
7 files changed, 48 insertions(+), 46 deletions(-)
rename src/apps/dashboard/features/tasks/constants/{intervalDuration.ts => intervalDurations.ts} (87%)
diff --git a/src/apps/dashboard/features/tasks/api/useTask.ts b/src/apps/dashboard/features/tasks/api/useTask.ts
index 98800420b4..78a430cb57 100644
--- a/src/apps/dashboard/features/tasks/api/useTask.ts
+++ b/src/apps/dashboard/features/tasks/api/useTask.ts
@@ -13,11 +13,6 @@ const fetchTask = async (
params: ScheduledTasksApiGetTaskRequest,
options?: AxiosRequestConfig
) => {
- if (!api) {
- console.warn('[fetchTasks] No API instance available');
- return;
- }
-
const response = await getScheduledTasksApi(api).getTask(params, options);
return response.data;
diff --git a/src/apps/dashboard/features/tasks/api/useTasks.ts b/src/apps/dashboard/features/tasks/api/useTasks.ts
index 928ec4d639..7a4b6e1c4d 100644
--- a/src/apps/dashboard/features/tasks/api/useTasks.ts
+++ b/src/apps/dashboard/features/tasks/api/useTasks.ts
@@ -22,7 +22,7 @@ export const useTasks = (params?: ScheduledTasksApiGetTasksRequest) => {
const { api } = useApi();
return useQuery({
- queryKey: [QUERY_KEY],
+ queryKey: [ QUERY_KEY ],
queryFn: ({ signal }) =>
fetchTasks(api!, params, { signal }),
enabled: !!api
diff --git a/src/apps/dashboard/features/tasks/api/useUpdateTask.ts b/src/apps/dashboard/features/tasks/api/useUpdateTask.ts
index 8f34c0df38..47de050a7b 100644
--- a/src/apps/dashboard/features/tasks/api/useUpdateTask.ts
+++ b/src/apps/dashboard/features/tasks/api/useUpdateTask.ts
@@ -3,7 +3,7 @@ import { getScheduledTasksApi } from '@jellyfin/sdk/lib/utils/api/scheduled-task
import { useMutation } from '@tanstack/react-query';
import { useApi } from 'hooks/useApi';
import { queryClient } from 'utils/query/queryClient';
-import { QUERY_KEY } from './useTasks';
+import { QUERY_KEY } from './useTask';
export const useUpdateTask = () => {
const { api } = useApi();
diff --git a/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx b/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
index 53d7663f3b..7819335669 100644
--- a/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
+++ b/src/apps/dashboard/features/tasks/components/NewTriggerForm.tsx
@@ -18,21 +18,50 @@ type IProps = {
open: boolean,
title: string,
onClose?: () => void,
- onSubmit?: (trigger: TaskTriggerInfo) => void
+ onAdd?: (trigger: TaskTriggerInfo) => void
};
-const NewTriggerForm: FunctionComponent = ({ open, title, onClose, onSubmit }: IProps) => {
+const NewTriggerForm: FunctionComponent = ({ open, title, onClose, onAdd }: IProps) => {
const { dateFnsLocale } = useLocale();
const [triggerType, setTriggerType] = useState('DailyTrigger');
const timeOfDayOptions = useMemo(() => getTimeOfDayOptions(dateFnsLocale), [dateFnsLocale]);
-
const intervalOptions = useMemo(() => getIntervalOptions(dateFnsLocale), [dateFnsLocale]);
const onTriggerTypeChange = useCallback((e: React.ChangeEvent) => {
setTriggerType(e.target.value);
}, []);
+ const onSubmit = useCallback((e: React.FormEvent) => {
+ e.preventDefault();
+
+ const formData = new FormData(e.currentTarget);
+ const data = Object.fromEntries(formData.entries());
+ const trigger: TaskTriggerInfo = {
+ Type: data.TriggerType.toString() as TaskTriggerInfoType
+ };
+
+ if (trigger.Type == TaskTriggerInfoType.WeeklyTrigger) {
+ trigger.DayOfWeek = data.DayOfWeek.toString() as DayOfWeek;
+ }
+
+ if (trigger.Type == TaskTriggerInfoType.DailyTrigger || trigger.Type == TaskTriggerInfoType.WeeklyTrigger) {
+ trigger.TimeOfDayTicks = parseInt(data.TimeOfDay.toString(), 10);
+ }
+
+ if (trigger.Type == TaskTriggerInfoType.IntervalTrigger) {
+ trigger.IntervalTicks = parseInt(data.Interval.toString(), 10);
+ }
+
+ if (data.TimeLimit.toString()) {
+ trigger.MaxRuntimeTicks = parseFloat(data.TimeLimit.toString()) * 3600000 * 1e4;
+ }
+
+ if (onAdd) {
+ onAdd(trigger);
+ }
+ }, [onAdd]);
+
return (