fix(theme): christmas theme should only run on dec 24 and 25

that's how 4chan does it, it makes sense since the theme is distracting especially on desktop
This commit is contained in:
Tom (plebeius.eth)
2025-01-26 23:35:50 +01:00
parent 65ed3dffd5
commit cbed83cd10
5 changed files with 16 additions and 19 deletions
@@ -9,6 +9,7 @@ import useInterfaceSettingsStore from '../../../stores/use-interface-settings-st
import useCatalogFiltersStore from '../../../stores/use-catalog-filters-store';
import useExpandedMediaStore from '../../../stores/use-expanded-media-store';
import useSpecialThemeStore from '../../../stores/use-special-theme-store';
import { isChristmas } from '../../../lib/utils/time-utils';
const commitRef = process.env.REACT_APP_COMMIT_REF;
const isElectron = window.isElectron === true;
@@ -71,10 +72,7 @@ const CheckForUpdates = () => {
const Style = () => {
const [theme, setTheme] = useTheme();
const { isEnabled, setIsEnabled } = useSpecialThemeStore();
const today = new Date();
const month = today.getMonth();
const day = today.getDate();
const isChristmas = (month === 11 && day >= 24) || (month === 0 && day <= 5);
const isChristmasTime = isChristmas();
const handleThemeChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
const newTheme = e.target.value;
@@ -96,7 +94,7 @@ const Style = () => {
<option value='burichan'>Burichan</option>
<option value='tomorrow'>Tomorrow</option>
<option value='photon'>Photon</option>
{isChristmas && <option value='special'>Special</option>}
{isChristmasTime && <option value='special'>Special</option>}
</select>
);
};
+4 -6
View File
@@ -7,6 +7,7 @@ import useInitialTheme from './use-initial-theme';
import { nsfwTags } from '../views/home/home';
import { useAccountComment } from '@plebbit/plebbit-react-hooks';
import useSpecialThemeStore from '../stores/use-special-theme-store';
import { isChristmas } from '../lib/utils/time-utils';
const themeClasses = ['yotsuba', 'yotsuba-b', 'futaba', 'burichan', 'tomorrow', 'photon'];
@@ -39,17 +40,14 @@ const useTheme = (): [string, (theme: string) => void] => {
// Check for Christmas and initialize special theme if needed
useEffect(() => {
const today = new Date();
const month = today.getMonth();
const day = today.getDate();
const isChristmas = (month === 11 && day >= 24) || (month === 0 && day <= 5);
const isChristmasTime = isChristmas();
const subplebbitAddress = params?.subplebbitAddress || pendingPostSubplebbitAddress;
if (isChristmas && isEnabled === null && subplebbitAddress && !isInAllView && !isInSubscriptionsView) {
if (isChristmasTime && isEnabled === null && subplebbitAddress && !isInAllView && !isInSubscriptionsView) {
setIsEnabled(true);
setCurrentTheme('tomorrow');
updateThemeClass('tomorrow');
} else if (!isChristmas && isEnabled) {
} else if (!isChristmasTime && isEnabled) {
setIsEnabled(false);
}
}, [isEnabled, setIsEnabled, params, pendingPostSubplebbitAddress, location.pathname, isInAllView, isInSubscriptionsView]);
+1 -1
View File
@@ -102,5 +102,5 @@ export const shouldShowSnow = (): boolean => {
const today = new Date();
const month = today.getMonth();
const day = today.getDate();
return (month === 11 && day >= 24) || (month === 0 && day <= 5);
return month === 11 && (day === 24 || day === 25);
};
+7
View File
@@ -68,3 +68,10 @@ export const getFormattedTimeAgo = (unixTimestamp: number): string => {
}
return t('time_x_years_ago', { count: Math.floor(timeDifference / 31104000) });
};
export const isChristmas = (): boolean => {
const today = new Date();
const month = today.getMonth();
const day = today.getDate();
return month === 11 && (day === 24 || day === 25);
};
+1 -7
View File
@@ -1,18 +1,12 @@
import { create } from 'zustand';
import { persist } from 'zustand/middleware';
import { isChristmas } from '../lib/utils/time-utils';
interface SpecialThemeStore {
isEnabled: boolean | null;
setIsEnabled: (value: boolean) => void;
}
const isChristmas = () => {
const today = new Date();
const month = today.getMonth();
const day = today.getDate();
return (month === 11 && day >= 24) || (month === 0 && day <= 5);
};
const useSpecialThemeStore = create(
persist<SpecialThemeStore>(
(set) => ({