Adopt shared WebUI layout primitives
This commit is contained in:
@@ -3,6 +3,7 @@ import { useEffect, useMemo, useState } from "react";
|
|||||||
import {
|
import {
|
||||||
Button,
|
Button,
|
||||||
DismissibleAlert,
|
DismissibleAlert,
|
||||||
|
FormSection,
|
||||||
IconButton,
|
IconButton,
|
||||||
i18nMessage,
|
i18nMessage,
|
||||||
LoadingFrame,
|
LoadingFrame,
|
||||||
@@ -208,9 +209,7 @@ export default function QuickAccessSettingsPanel({
|
|||||||
) : null}
|
) : null}
|
||||||
|
|
||||||
<LoadingFrame loading={loading} label="i18n:govoplan-quick-access.loading">
|
<LoadingFrame loading={loading} label="i18n:govoplan-quick-access.loading">
|
||||||
<section className="quick-access-settings-section">
|
<FormSection className="quick-access-settings-section" title="i18n:govoplan-quick-access.categories" contentClassName="quick-access-preference-list">
|
||||||
<h3>i18n:govoplan-quick-access.categories</h3>
|
|
||||||
<div className="quick-access-preference-list">
|
|
||||||
{categories.map((category, index) => (
|
{categories.map((category, index) => (
|
||||||
<PreferenceRow
|
<PreferenceRow
|
||||||
key={category.id}
|
key={category.id}
|
||||||
@@ -228,12 +227,9 @@ export default function QuickAccessSettingsPanel({
|
|||||||
last={index === categories.length - 1}
|
last={index === categories.length - 1}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</FormSection>
|
||||||
</section>
|
|
||||||
|
|
||||||
<section className="quick-access-settings-section">
|
<FormSection className="quick-access-settings-section" title="i18n:govoplan-quick-access.registered_tools" contentClassName="quick-access-preference-list">
|
||||||
<h3>i18n:govoplan-quick-access.registered_tools</h3>
|
|
||||||
<div className="quick-access-preference-list">
|
|
||||||
{categories.flatMap((category) => {
|
{categories.flatMap((category) => {
|
||||||
const categoryTools = tools.filter((tool) => tool.category_id === category.id);
|
const categoryTools = tools.filter((tool) => tool.category_id === category.id);
|
||||||
const toolIds = categoryTools.map((tool) => tool.id);
|
const toolIds = categoryTools.map((tool) => tool.id);
|
||||||
@@ -257,8 +253,7 @@ export default function QuickAccessSettingsPanel({
|
|||||||
));
|
));
|
||||||
})}
|
})}
|
||||||
{!tools.length ? <p className="quick-access-empty">i18n:govoplan-quick-access.no_registered_tools</p> : null}
|
{!tools.length ? <p className="quick-access-empty">i18n:govoplan-quick-access.no_registered_tools</p> : null}
|
||||||
</div>
|
</FormSection>
|
||||||
</section>
|
|
||||||
</LoadingFrame>
|
</LoadingFrame>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user