1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
lens/src/features/preferences/renderer/preferences.tsx
Janne Savolainen 515ec34c87
Introduce competition for preferences navigation
Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>
2022-10-21 08:23:14 +03:00

108 lines
3.4 KiB
TypeScript

/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import "../../../renderer/components/+preferences/preferences.scss";
import React from "react";
import { SettingLayout } from "../../../renderer/components/layout/setting-layout";
import { withInjectables } from "@ogre-tools/injectable-react";
import closePreferencesInjectable from "../../../renderer/components/+preferences/close-preferences.injectable";
import currentPreferenceTabCompositeInjectable from "./preference-items/current-preference-tab-composite.injectable";
import type { Composite } from "../../application-menu/main/menu-items/get-composite/get-composite";
import type { PreferenceTypes, PreferenceTab } from "./preference-items/preference-item-injection-token";
import type { IComputedValue } from "mobx";
import { Map } from "../../../renderer/components/map/map";
import { observer } from "mobx-react";
import { PreferencesNavigation } from "./preference-navigation/preferences-navigation";
interface Dependencies {
closePreferences: () => void;
pageComposite: IComputedValue<Composite<PreferenceTab>>;
}
const NonInjectedPreferences = observer(({
closePreferences,
pageComposite,
}: Dependencies) => {
const composite = pageComposite.get();
return (
<SettingLayout
navigation={<PreferencesNavigation />}
className="Preferences"
contentGaps={false}
closeButtonProps={{ "data-testid": "close-preferences" }}
back={closePreferences}
data-testid={composite.value.testId}
>
{toPreferenceItemHierarchy(composite)}
</SettingLayout>
);
});
const toPreferenceItemHierarchy = (composite: Composite<PreferenceTypes>) => {
switch (composite.value.kind) {
case "group": {
return (
<section id={composite.value.id}>
<Map items={composite.children} getSeparator={composite.value.childrenSeparator}>
{toPreferenceItemHierarchy}
</Map>
</section>
);
}
case "item":
// eslint-disable-next-line no-fallthrough
case "page": {
const Component = composite.value.Component;
return (
<Component>
<Map items={composite.children} getSeparator={composite.value.childrenSeparator}>
{toPreferenceItemHierarchy}
</Map>
</Component>
);
}
case "tab-group":
// eslint-disable-next-line no-fallthrough
case "tab": {
return (
<Map items={composite.children}>
{toPreferenceItemHierarchy}
</Map>
);
}
default: {
// Note: this will fail at transpilation time, if all kinds
// are not handled in switch/case.
const _exhaustiveCheck: never = composite.value;
// Note: this code is unreachable, it is here to make ts not complain about
// _exhaustiveCheck not being used.
// See: https://www.typescriptlang.org/docs/handbook/2/narrowing.html#exhaustiveness-checking
throw new Error(`Tried to create preferences, but foreign item was encountered: ${_exhaustiveCheck} ${composite.value}`);
}
}
};
export const Preferences = withInjectables<Dependencies>(
NonInjectedPreferences,
{
getProps: (di, props) => ({
closePreferences: di.inject(closePreferencesInjectable),
pageComposite: di.inject(currentPreferenceTabCompositeInjectable),
...props,
}),
},
);