Move all dayjs plugin extensions to util.ts

src/components/Collection/ListViewItem.tsx

@@ -13,7 +13,6 @@ import {
 import { Icon } from '@mdi/react';
 import cx from 'classnames';
 import dayjs from 'dayjs';
-import advancedFormat from 'dayjs/plugin/advancedFormat';
 import { forEach, reduce } from 'lodash';
 
 import BackgroundImagePlaceholderDiv from '@/components/BackgroundImagePlaceholderDiv';
@@ -30,8 +29,6 @@ import type { CollectionGroupType } from '@/core/types/api/collection';
 import type { SeriesSizesFileSourcesType, SeriesType } from '@/core/types/api/series';
 import type { WebuiGroupExtra } from '@/core/types/api/webui';
 
-dayjs.extend(advancedFormat);
-
 const renderFileSources = (sources: SeriesSizesFileSourcesType): string => {
   const output: string[] = [];
   forEach(sources, (source, type) => {

src/components/Collection/Series/EpisodeDetails.tsx

@@ -2,17 +2,12 @@ import React from 'react';
 import { mdiCalendarMonthOutline, mdiClockOutline, mdiStarHalfFull } from '@mdi/js';
 import { Icon } from '@mdi/react';
 import dayjs from 'dayjs';
-import advancedFormat from 'dayjs/plugin/advancedFormat';
-import durationPlugin from 'dayjs/plugin/duration';
 import { toNumber } from 'lodash';
 
 import { convertTimeSpanToMs } from '@/core/util';
 
 import type { EpisodeType } from '@/core/types/api/episode';
 
-dayjs.extend(advancedFormat);
-dayjs.extend(durationPlugin);
-
 const getDuration = (duration: string) => {
   const minutes = dayjs.duration(convertTimeSpanToMs(duration)).asMinutes();
   const intMinutes = Math.round(toNumber(minutes));

src/core/util.ts

@@ -2,13 +2,21 @@
 import { compareItems, rankItem } from '@tanstack/match-sorter-utils';
 import { sortingFns } from '@tanstack/react-table';
 import copy from 'copy-to-clipboard';
+import dayjs from 'dayjs';
+import advancedFormat from 'dayjs/plugin/advancedFormat';
+import calendar from 'dayjs/plugin/calendar';
+import durationPlugin from 'dayjs/plugin/duration';
 import formatThousands from 'format-thousands';
 import { isObject, toNumber } from 'lodash';
 
 import type { FetchBaseQueryError } from '@reduxjs/toolkit/query';
 import type { RankingInfo } from '@tanstack/match-sorter-utils';
 import type { FilterFn, SortingFn } from '@tanstack/react-table';
 
+dayjs.extend(advancedFormat);
+dayjs.extend(calendar);
+dayjs.extend(durationPlugin);
+
 const { DEV, VITE_APPVERSION, VITE_GITHASH } = import.meta.env;
 
 export function uiVersion() {

src/pages/collection/Series.tsx

@@ -17,7 +17,6 @@ import {
 import { Icon } from '@mdi/react';
 import cx from 'classnames';
 import dayjs from 'dayjs';
-import advancedFormat from 'dayjs/plugin/advancedFormat';
 import { get, isArray, random } from 'lodash';
 
 import BackgroundImagePlaceholderDiv from '@/components/BackgroundImagePlaceholderDiv';
@@ -31,8 +30,6 @@ import type { CollectionGroupType } from '@/core/types/api/collection';
 import type { SeriesDetailsType } from '@/core/types/api/series';
 import type { TagType } from '@/core/types/api/tags';
 
-dayjs.extend(advancedFormat);
-
 const IconNotification = ({ text }) => (
   <div className="flex items-center gap-x-2 font-semibold">
     <Icon path={mdiInformationOutline} size={1} className="text-panel-text-important" />

src/pages/dashboard/components/EpisodeDetails.tsx

@@ -2,20 +2,13 @@ import React, { useMemo } from 'react';
 import { Link } from 'react-router-dom';
 import cx from 'classnames';
 import dayjs from 'dayjs';
-import advancedFormat from 'dayjs/plugin/advancedFormat';
-import calendar from 'dayjs/plugin/calendar';
-import durationPlugin from 'dayjs/plugin/duration';
 
 import BackgroundImagePlaceholderDiv from '@/components/BackgroundImagePlaceholderDiv';
 import { EpisodeTypeEnum } from '@/core/types/api/episode';
 import { convertTimeSpanToMs } from '@/core/util';
 
 import type { DashboardEpisodeDetailsType } from '@/core/types/api/dashboard';
 
-dayjs.extend(advancedFormat);
-dayjs.extend(calendar);
-dayjs.extend(durationPlugin);
-
 type Props = {
   episode: DashboardEpisodeDetailsType;
   showDate?: boolean;

src/pages/settings/tabs/MetadataSitesSettings.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import cx from 'classnames';
 import dayjs from 'dayjs';
-import advancedFormat from 'dayjs/plugin/advancedFormat';
 import { toNumber } from 'lodash';
 
 import Button from '@/components/Input/Button';
@@ -12,8 +11,6 @@ import toast from '@/components/Toast';
 import { useLazyGetTraktCodeQuery } from '@/core/rtkQuery/splitApi/traktApi';
 import { useSettingsContext } from '@/pages/settings/SettingsPage';
 
-dayjs.extend(advancedFormat);
-
 export const tvdbLanguages = [
   ['en', 'English'],
   ['sv', 'Swedish'],