show/hide details via CSS rather than Javascript (#5396)

This commit is contained in:
CJ
2024-10-28 17:35:58 -07:00
committed by GitHub
parent c6bcdd89be
commit 069a4b1f80
6 changed files with 81 additions and 93 deletions

View File

@@ -13,7 +13,6 @@ interface IStudioDetailsPanel {
export const StudioDetailsPanel: React.FC<IStudioDetailsPanel> = ({
studio,
collapsed,
fullWidth,
}) => {
function renderTagsField() {
@@ -47,25 +46,6 @@ export const StudioDetailsPanel: React.FC<IStudioDetailsPanel> = ({
);
}
function maybeRenderExtraDetails() {
if (!collapsed) {
return (
<>
<DetailItem
id="tags"
value={renderTagsField()}
fullWidth={fullWidth}
/>
<DetailItem
id="stash_ids"
value={renderStashIDs()}
fullWidth={fullWidth}
/>
</>
);
}
}
return (
<div className="detail-group">
<DetailItem id="details" value={studio.details} fullWidth={fullWidth} />
@@ -82,7 +62,12 @@ export const StudioDetailsPanel: React.FC<IStudioDetailsPanel> = ({
}
fullWidth={fullWidth}
/>
{maybeRenderExtraDetails()}
<DetailItem id="tags" value={renderTagsField()} fullWidth={fullWidth} />
<DetailItem
id="stash_ids"
value={renderStashIDs()}
fullWidth={fullWidth}
/>
</div>
);
};