chore(menu): hide platform-specific options, hide empty/consecutive headings

This commit is contained in:
dragonwocky 2023-01-13 00:30:14 +11:00
parent d406f99d7e
commit d738801dc1
Signed by: dragonwocky
GPG Key ID: 7998D08F7D7BD7A8
2 changed files with 24 additions and 19 deletions

View File

@ -330,7 +330,7 @@ function FileInput({ filename, extensions, onupload, onchange, ...props }) {
.join(",")} .join(",")}
...${props} ...${props}
/> />
<i class="i-file-up w-[16px] h-[16px] mr-[8px]"></i> <i class="i-file-up w-[16px] h-[16px] mr-[6px]"></i>
${$filename} ${$filename}
</label> </label>
${$clear} ${$clear}

View File

@ -16,31 +16,36 @@ import {
const renderOptions = async (mod) => { const renderOptions = async (mod) => {
const { html, platform, getProfile } = globalThis.__enhancerApi, const { html, platform, getProfile } = globalThis.__enhancerApi,
{ optionDefaults, initDatabase } = globalThis.__enhancerApi, { optionDefaults, initDatabase } = globalThis.__enhancerApi,
options = await optionDefaults(mod.id), profile = await getProfile();
db = initDatabase([await getProfile(), mod.id], options); const db = initDatabase([profile, mod.id], await optionDefaults(mod.id)),
options = mod.options.reduce((options, opt, i) => {
if (!opt.key && (opt.type !== "heading" || !opt.label)) return options;
if (opt.targets && !opt.targets.includes(platform)) return options;
const prevOpt = options[options.length - 1];
// no consective headings
if (opt.type === "heading" && prevOpt?.type === opt.type) {
options[options.length - 1] = opt;
} else options.push(opt);
return options;
}, []);
// no empty/end headings e.g. if section is platform-specific
if (options[options.length - 1]?.type === "heading") options.pop();
return Promise.all( return Promise.all(
mod.options options.map(async (opt) => {
.map(async (opt) => { if (opt.type === "heading") return html`<${Option} ...${opt} />`;
if (!opt.key && (opt.type !== "heading" || !opt.label)) return; const value = await db.get(opt.key),
// if (opt.targets && !opt.targets.includes(platform)) return; _update = (value) => db.set(opt.key, value);
if (opt.type === "heading") return html`<${Option} ...${opt} />`; return html`<${Option} ...${{ ...opt, value, _update }} />`;
const value = await db.get(opt.key), })
_update = (value) => db.set(opt.key, value);
return html`<${Option} ...${{ ...opt, value, _update }} />`;
})
.filter((opt) => opt)
); );
}; };
let renderStarted; let renderStarted;
const render = async (iconStyle) => { const render = async (iconStyle) => {
const { html, getProfile } = globalThis.__enhancerApi, const { html, getCore, getThemes } = globalThis.__enhancerApi,
{ optionDefaults, initDatabase } = globalThis.__enhancerApi;
if (!html || !getProfile || renderStarted) return;
renderStarted = true;
const { getCore, getThemes } = globalThis.__enhancerApi,
{ getExtensions, getIntegrations } = globalThis.__enhancerApi; { getExtensions, getIntegrations } = globalThis.__enhancerApi;
if (!html || !getCore || renderStarted) return;
renderStarted = true;
const $sidebar = html`<${Sidebar}> const $sidebar = html`<${Sidebar}>
${[ ${[