mirror of
https://github.com/SteamDeckHomebrew/decky-loader.git
synced 2026-07-11 03:42:01 +00:00
f6144f9634
* fix: useDeckyState proper type and safety * refactor: plugin list Avoids unneeded re-renders. See https://react.dev/learn/you-might-not-need-an-effect#caching-expensive-calculations * feat: sync with local plugin status in store Adds some QoL changes to the plugin store browser: - Add ✓ icon to currently installed plugin version in version selector - Change install button label depending on the install type that the button would trigger - Adds icon to install button for clarity The goal is to make it clear to the user what the current state of the installed plugin is, and what would be the impact of installing the selected version. Resolves #360 * lint: prettier * fix: add missing translations * refactor: safer translation strings on install Prefer using `t(...)` instead of `TranslationHelper` since it ensures that the translation keys are not missing in the locale files when running the `extractext` task. By adding comments with `t(...)` calls, `i18next-parser` will generate the strings as if they were present as literals in the code (see https://github.com/i18next/i18next-parser#caveats). This does _not_ suppress the warnings (since `i18next-parser` does not have access to TS types, so it cannot infer template literals) but it at least makes it less likely that a translation will be missed by mistake, have typos, etc.
182 lines
4.9 KiB
TypeScript
182 lines
4.9 KiB
TypeScript
import { FC, ReactNode, createContext, useContext, useEffect, useState } from 'react';
|
|
|
|
import { DEFAULT_NOTIFICATION_SETTINGS, NotificationSettings } from '../notification-service';
|
|
import { Plugin } from '../plugin';
|
|
import { PluginUpdateMapping } from '../store';
|
|
import { VerInfo } from '../updater';
|
|
|
|
interface PublicDeckyState {
|
|
plugins: Plugin[];
|
|
pluginOrder: string[];
|
|
frozenPlugins: string[];
|
|
hiddenPlugins: string[];
|
|
activePlugin: Plugin | null;
|
|
updates: PluginUpdateMapping | null;
|
|
hasLoaderUpdate?: boolean;
|
|
isLoaderUpdating: boolean;
|
|
versionInfo: VerInfo | null;
|
|
notificationSettings: NotificationSettings;
|
|
userInfo: UserInfo | null;
|
|
}
|
|
|
|
export interface UserInfo {
|
|
username: string;
|
|
path: string;
|
|
}
|
|
|
|
export class DeckyState {
|
|
private _plugins: Plugin[] = [];
|
|
private _pluginOrder: string[] = [];
|
|
private _frozenPlugins: string[] = [];
|
|
private _hiddenPlugins: string[] = [];
|
|
private _activePlugin: Plugin | null = null;
|
|
private _updates: PluginUpdateMapping | null = null;
|
|
private _hasLoaderUpdate: boolean = false;
|
|
private _isLoaderUpdating: boolean = false;
|
|
private _versionInfo: VerInfo | null = null;
|
|
private _notificationSettings = DEFAULT_NOTIFICATION_SETTINGS;
|
|
private _userInfo: UserInfo | null = null;
|
|
|
|
public eventBus = new EventTarget();
|
|
|
|
publicState(): PublicDeckyState {
|
|
return {
|
|
plugins: this._plugins,
|
|
pluginOrder: this._pluginOrder,
|
|
frozenPlugins: this._frozenPlugins,
|
|
hiddenPlugins: this._hiddenPlugins,
|
|
activePlugin: this._activePlugin,
|
|
updates: this._updates,
|
|
hasLoaderUpdate: this._hasLoaderUpdate,
|
|
isLoaderUpdating: this._isLoaderUpdating,
|
|
versionInfo: this._versionInfo,
|
|
notificationSettings: this._notificationSettings,
|
|
userInfo: this._userInfo,
|
|
};
|
|
}
|
|
|
|
setVersionInfo(versionInfo: VerInfo) {
|
|
this._versionInfo = versionInfo;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setPlugins(plugins: Plugin[]) {
|
|
this._plugins = plugins;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setPluginOrder(pluginOrder: string[]) {
|
|
this._pluginOrder = pluginOrder;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setFrozenPlugins(frozenPlugins: string[]) {
|
|
this._frozenPlugins = frozenPlugins;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setHiddenPlugins(hiddenPlugins: string[]) {
|
|
this._hiddenPlugins = hiddenPlugins;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setActivePlugin(name: string) {
|
|
this._activePlugin = this._plugins.find((plugin) => plugin.name === name) ?? null;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
closeActivePlugin() {
|
|
this._activePlugin = null;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setUpdates(updates: PluginUpdateMapping) {
|
|
this._updates = updates;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setHasLoaderUpdate(hasUpdate: boolean) {
|
|
this._hasLoaderUpdate = hasUpdate;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setIsLoaderUpdating(isUpdating: boolean) {
|
|
this._isLoaderUpdating = isUpdating;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setNotificationSettings(notificationSettings: NotificationSettings) {
|
|
this._notificationSettings = notificationSettings;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
setUserInfo(userInfo: UserInfo) {
|
|
this._userInfo = userInfo;
|
|
this.notifyUpdate();
|
|
}
|
|
|
|
private notifyUpdate() {
|
|
this.eventBus.dispatchEvent(new Event('update'));
|
|
}
|
|
}
|
|
|
|
interface DeckyStateContext extends PublicDeckyState {
|
|
setVersionInfo(versionInfo: VerInfo): void;
|
|
setIsLoaderUpdating(hasUpdate: boolean): void;
|
|
setActivePlugin(name: string): void;
|
|
setPluginOrder(pluginOrder: string[]): void;
|
|
closeActivePlugin(): void;
|
|
}
|
|
|
|
const DeckyStateContext = createContext<DeckyStateContext | null>(null);
|
|
|
|
export const useDeckyState = () => {
|
|
const deckyState = useContext(DeckyStateContext);
|
|
|
|
if (deckyState === null) {
|
|
throw new Error('useDeckyState needs a parent DeckyStateContext');
|
|
}
|
|
|
|
return deckyState;
|
|
};
|
|
|
|
interface Props {
|
|
deckyState: DeckyState;
|
|
children?: ReactNode;
|
|
}
|
|
|
|
export const DeckyStateContextProvider: FC<Props> = ({ children, deckyState }) => {
|
|
const [publicDeckyState, setPublicDeckyState] = useState<PublicDeckyState>({ ...deckyState.publicState() });
|
|
|
|
useEffect(() => {
|
|
function onUpdate() {
|
|
setPublicDeckyState({ ...deckyState.publicState() });
|
|
}
|
|
|
|
deckyState.eventBus.addEventListener('update', onUpdate);
|
|
|
|
return () => deckyState.eventBus.removeEventListener('update', onUpdate);
|
|
}, []);
|
|
|
|
const setIsLoaderUpdating = deckyState.setIsLoaderUpdating.bind(deckyState);
|
|
const setVersionInfo = deckyState.setVersionInfo.bind(deckyState);
|
|
const setActivePlugin = deckyState.setActivePlugin.bind(deckyState);
|
|
const closeActivePlugin = deckyState.closeActivePlugin.bind(deckyState);
|
|
const setPluginOrder = deckyState.setPluginOrder.bind(deckyState);
|
|
|
|
return (
|
|
<DeckyStateContext.Provider
|
|
value={{
|
|
...publicDeckyState,
|
|
setIsLoaderUpdating,
|
|
setVersionInfo,
|
|
setActivePlugin,
|
|
closeActivePlugin,
|
|
setPluginOrder,
|
|
}}
|
|
>
|
|
{children}
|
|
</DeckyStateContext.Provider>
|
|
);
|
|
};
|