mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Fix overly aggressive view caching

Browse source
This commit is contained in:
Bill Thornton 2024-07-25 10:59:15 -04:00
parent 7acdb66e14
commit 4de2a05264
1 changed files with 42 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

56
src/components/viewManager/ViewManagerPage.tsx
View file

@ -1,5 +1,6 @@
import { Action } from 'history';
import { FunctionComponent, useEffect } from 'react'; import { FunctionComponent, useEffect } from 'react';
import { useLocation } from 'react-router-dom'; import { useLocation, useNavigationType } from 'react-router-dom';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
import type { RestoreViewFailResponse } from '../../types/viewManager'; import type { RestoreViewFailResponse } from '../../types/viewManager';
@ -15,6 +16,34 @@ export interface ViewManagerPageProps {
transition?: string transition?: string
} }
interface ViewOptions {
url: string
type?: string
// eslint-disable-next-line @typescript-eslint/no-explicit-any
state: any
autoFocus: boolean
fullscreen?: boolean
transition?: string
options: {
supportsThemeMedia?: boolean
enableMediaControl?: boolean
}
}
const loadView = async (controller: string, view: string, viewOptions: ViewOptions) => {
const [ controllerFactory, viewHtml ] = await Promise.all([
import(/* webpackChunkName: "[request]" */ `../../controllers/${controller}`),
import(/* webpackChunkName: "[request]" */ `../../controllers/${view}`)
.then(html => globalize.translateHtml(html))
]);
viewManager.loadView({
...viewOptions,
controllerFactory,
view: viewHtml
});
};
/** /**
* Page component that renders legacy views via the ViewManager. * Page component that renders legacy views via the ViewManager.
* NOTE: Any new pages should use the generic Page component instead. * NOTE: Any new pages should use the generic Page component instead.
@ -29,6 +58,7 @@ const ViewManagerPage: FunctionComponent<ViewManagerPageProps> = ({
transition transition
}) => { }) => {
const location = useLocation(); const location = useLocation();
const navigationType = useNavigationType();
useEffect(() => { useEffect(() => {
const loadPage = () => { const loadPage = () => {
@ -45,20 +75,17 @@ const ViewManagerPage: FunctionComponent<ViewManagerPageProps> = ({
} }
}; };
viewManager.tryRestoreView(viewOptions) if (navigationType !== Action.Pop) {
console.debug('[ViewManagerPage] loading view [%s]', view);
return loadView(controller, view, viewOptions);
}
console.debug('[ViewManagerPage] restoring view [%s]', view);
return viewManager.tryRestoreView(viewOptions)
.catch(async (result?: RestoreViewFailResponse) => { .catch(async (result?: RestoreViewFailResponse) => {
if (!result?.cancelled) { if (!result?.cancelled) {
const [ controllerFactory, viewHtml ] = await Promise.all([ console.debug('[ViewManagerPage] restore failed; loading view [%s]', view);
import(/* webpackChunkName: "[request]" */ `../../controllers/${controller}`), return loadView(controller, view, viewOptions);
import(/* webpackChunkName: "[request]" */ `../../controllers/${view}`)
.then(html => globalize.translateHtml(html))
]);
viewManager.loadView({
...viewOptions,
controllerFactory,
view: viewHtml
});
} }
}); });
}; };
@ -76,7 +103,8 @@ const ViewManagerPage: FunctionComponent<ViewManagerPageProps> = ({
isThemeMediaSupported, isThemeMediaSupported,
transition, transition,
location.pathname, location.pathname,
location.search location.search,
navigationType
]); ]);
return null; return null;