Accords-Library-Archive/accords-library.com
1
0
Fork 0
Code Issues Pull Requests 5 Packages Projects Releases Wiki Activity

Filtering primary and secondary items

Browse Source
This commit is contained in:
DrMint 2022-03-05 21:05:20 +01:00
parent 444842e570
commit c7f23674f9
3 changed files with 42 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/graphql/operation.graphql
View File

@ -148,6 +148,7 @@ query getLibraryItemsPreview($language_code: String) {
subtitle
slug
root_item
primary
thumbnail {
data {
attributes {

1
src/graphql/operations-types.ts
View File

@ -252,6 +252,7 @@ export type GetLibraryItemsPreviewQuery = {
subtitle: string;
slug: string;
root_item: boolean;
primary: boolean;
thumbnail: {
__typename: "UploadFileEntityResponse";
data: {

47
src/pages/library/index.tsx
View File

@ -33,12 +33,21 @@ export default function Library(props: LibraryProps): JSX.Element {
const langui = props.langui.websiteInterfaces.data[0].attributes;
const [showSubitems, setShowSubitems] = useState<boolean>(false);
const [showPrimaryItems, setShowPrimaryItems] = useState<boolean>(true);
const [showSecondaryItems, setShowSecondaryItems] = useState<boolean>(false);
const [sortingMethod, setSortingMethod] = useState<number>(0);
const [groupingMethod, setGroupingMethod] = useState<number>(-1);
const [filteredItems, setFilteredItems] = useState<
LibraryProps["libraryItems"]["libraryItems"]["data"]
>(filterItems(showSubitems, props.libraryItems.libraryItems.data));
>(
filterItems(
showSubitems,
showPrimaryItems,
showSecondaryItems,
props.libraryItems.libraryItems.data
)
);
const [sortedItems, setSortedItem] = useState<
LibraryProps["libraryItems"]["libraryItems"]["data"]
@ -50,9 +59,19 @@ export default function Library(props: LibraryProps): JSX.Element {
useEffect(() => {
setFilteredItems(
filterItems(showSubitems, props.libraryItems.libraryItems.data)
filterItems(
showSubitems,
showPrimaryItems,
showSecondaryItems,
props.libraryItems.libraryItems.data
)
);
}, [showSubitems, props.libraryItems.libraryItems.data]);
}, [
showSubitems,
props.libraryItems.libraryItems.data,
showPrimaryItems,
showSecondaryItems,
]);
useEffect(() => {
setSortedItem(sortBy(sortingMethod, filteredItems));
@ -95,6 +114,16 @@ export default function Library(props: LibraryProps): JSX.Element {
<p className="flex-shrink-0">{langui.show_subitems}:</p>
<Switch state={showSubitems} setState={setShowSubitems} />
</div>
<div className="flex flex-row gap-2 place-items-center">
<p className="flex-shrink-0">{langui.show_primary_items}:</p>
<Switch state={showPrimaryItems} setState={setShowPrimaryItems} />
</div>
<div className="flex flex-row gap-2 place-items-center">
<p className="flex-shrink-0">{langui.show_secondary_items}:</p>
<Switch state={showSecondaryItems} setState={setShowSecondaryItems} />
</div>
</SubPanel>
);
const contentPanel = (
@ -242,12 +271,14 @@ function getGroups(
function filterItems(
showSubitems: boolean,
showPrimaryItems: boolean,
showSecondaryItems: boolean,
items: LibraryProps["libraryItems"]["libraryItems"]["data"]
): LibraryProps["libraryItems"]["libraryItems"]["data"] {
return [...items].filter((item) => {
let result = true;
if (!showSubitems && !item.attributes.root_item) result = false;
if (!showSubitems && !item.attributes.root_item) return false;
if (
showSubitems &&
item.attributes.metadata.length > 0 &&
item.attributes.metadata[0].__typename === "ComponentMetadataOther" &&
(item.attributes.metadata[0].subtype.data.attributes.slug ===
@ -255,8 +286,10 @@ function filterItems(
item.attributes.metadata[0].subtype.data.attributes.slug ===
"relation-set")
)
result = false;
return result;
return false;
if (item.attributes.primary && !showPrimaryItems) return false;
if (!item.attributes.primary && !showSecondaryItems) return false;
return true;
});
}