mirror of
https://gitea.gofwd.group/dstrawsb/ballistic-builder.git
synced 2025-12-06 02:36:44 -05:00
filters dispolaying, now need to link it to the data
This commit is contained in:
949
package-lock.json
generated
949
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
12
package.json
12
package.json
@@ -9,17 +9,13 @@
|
|||||||
"lint": "next lint"
|
"lint": "next lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@emotion/react": "^11.13.5",
|
"@emotion/react": "^11.14.0",
|
||||||
"@emotion/styled": "^11.13.5",
|
"@emotion/styled": "^11.14.0",
|
||||||
"@headlessui/react": "^2.2.0",
|
"@headlessui/react": "^2.2.0",
|
||||||
"@heroicons/react": "^2.2.0",
|
"@heroicons/react": "^2.2.0",
|
||||||
"@lucia-auth/adapter-drizzle": "^1.1.0",
|
"@lucia-auth/adapter-drizzle": "^1.1.0",
|
||||||
"@mui/icons-material": "^6.1.7",
|
"@mui/material": "^6.4.3",
|
||||||
"@mui/joy": "^5.0.0-beta.48",
|
"@mui/x-tree-view": "^7.25.0",
|
||||||
"@mui/material": "^6.1.7",
|
|
||||||
"@mui/styles": "^6.1.7",
|
|
||||||
"@mui/system": "^6.1.7",
|
|
||||||
"@mui/x-data-grid": "^7.22.2",
|
|
||||||
"@oslojs/crypto": "^1.0.1",
|
"@oslojs/crypto": "^1.0.1",
|
||||||
"@oslojs/encoding": "^1.1.0",
|
"@oslojs/encoding": "^1.1.0",
|
||||||
"@radix-ui/react-alert-dialog": "^1.1.5",
|
"@radix-ui/react-alert-dialog": "^1.1.5",
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ export default function RootLayout({
|
|||||||
<div className="flex min-h-full flex-col">
|
<div className="flex min-h-full flex-col">
|
||||||
|
|
||||||
<div className="mx-auto flex w-full max-w-7xl items-start gap-x-8 ">
|
<div className="mx-auto flex w-full max-w-7xl items-start gap-x-8 ">
|
||||||
<aside className="sticky top-8 hidden w-44 shrink-0 lg:block pt-4">
|
<aside className="sticky top-8 hidden w[200] shrink-0 lg:block pt-4">
|
||||||
{/* Left column area */}
|
{/* Left column area */}
|
||||||
<Filter heading="Filters"/>
|
<Filter heading="Filters"/>
|
||||||
</aside>
|
</aside>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { getSights } from "@queries/PSA";
|
import { getSights } from "@queries/PSA";
|
||||||
import styles from '../styles.module.css';
|
// import styles from '../styles.module.css';
|
||||||
import PageHero from "@components/PageHero";
|
import PageHero from "@components/PageHero";
|
||||||
import SortTable from "@components/SortTable";
|
import SortTable from "@components/SortTable";
|
||||||
import {Suspense} from "react";
|
import {Suspense} from "react";
|
||||||
|
|||||||
@@ -1,5 +1,9 @@
|
|||||||
"use client";
|
"use client";
|
||||||
const ButtonProducts = ( props:any ) => {
|
interface ButtonProductsProps {
|
||||||
|
category: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const ButtonProducts = (props: ButtonProductsProps) => {
|
||||||
const category = props.category;
|
const category = props.category;
|
||||||
return (
|
return (
|
||||||
<button onClick={async () => { alert(category); return false;}} >{props.category}</button>
|
<button onClick={async () => { alert(category); return false;}} >{props.category}</button>
|
||||||
|
|||||||
@@ -1,29 +1,45 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { getBBProductsCategories } from "@/db/queries/Products";
|
import { getBBProductsCategories, getBBProductsSubCategories } from "@/db/queries/Products";
|
||||||
// import Link from "next/link";
|
// import Link from "next/link";
|
||||||
import ButtonProducts from "../ButtonProduct";
|
import Box from '@mui/material/Box';
|
||||||
|
import { SimpleTreeView } from '@mui/x-tree-view/SimpleTreeView';
|
||||||
|
import { TreeItem } from '@mui/x-tree-view/TreeItem';
|
||||||
|
|
||||||
|
|
||||||
interface FilterProps {
|
interface FilterProps {
|
||||||
heading: string;
|
heading: string;
|
||||||
[key: string]: unknown;
|
[key: string]: unknown;
|
||||||
}
|
}
|
||||||
|
async function SubCategories(props: { cat: string; }) {
|
||||||
|
|
||||||
const Filter: React.FC<FilterProps> = async (props) => {
|
const bbSubCats = await getBBProductsSubCategories(props.cat);
|
||||||
const bbCats = getBBProductsCategories();
|
return (
|
||||||
|
<>
|
||||||
|
{bbSubCats.map((subcat) => (
|
||||||
|
<TreeItem key={subcat.subcategory} itemId={subcat.subcategory} label={subcat.subcategory} />
|
||||||
|
))}
|
||||||
|
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function Filter(props: FilterProps) {
|
||||||
|
const bbCats = await getBBProductsCategories();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<div className="mt-20">
|
<div className="mt-20">
|
||||||
<h1 className="pt-10 ml-2 font-bold">{props.heading}</h1>
|
<h1 className="pt-10 ml-2 font-bold">{props.heading}</h1>
|
||||||
<div className="flex flex-col pt-2 pb-6 ml-2 rounded-r-lg text-white bg-[#334155]">
|
<div className="flex flex-col pt-2 pb-6 ml-2 rounded-r-lg text-white bg-[#334155]">
|
||||||
|
<Box sx={ {minHeight: 600, minWidth: 250} }>
|
||||||
{(await bbCats).map((cat) => (
|
<SimpleTreeView>
|
||||||
<div className="ml-2 " key={cat.category}>
|
{bbCats.map((cat) => (
|
||||||
{/* <Link href={`/products/${cat.category}`}> */}
|
<TreeItem key={cat.category} itemId={cat.category} label={cat.category}>
|
||||||
<ButtonProducts category={cat.category} />
|
{cat.category && <SubCategories cat={cat.category} />}
|
||||||
{/* </Link> */}
|
</TreeItem>
|
||||||
</div>
|
))}
|
||||||
))
|
</SimpleTreeView>
|
||||||
}
|
</Box>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user