Rename framework page

Signed-off-by: gearnode <bryan@frimin.fr>
This commit is contained in:
gearnode
2025-02-09 22:02:59 -08:00
parent 8ac4929f66
commit c9351b17ba
3 changed files with 26 additions and 25 deletions

View File

@@ -25,7 +25,8 @@ const NotFoundPage = lazy(() => import("./pages/NotFoundPage"));
const PeoplesPage = lazy(() => import("./pages/PeoplesPage")); const PeoplesPage = lazy(() => import("./pages/PeoplesPage"));
const VendorsPage = lazy(() => import("./pages/VendorsPage")); const VendorsPage = lazy(() => import("./pages/VendorsPage"));
const FrameworksPage = lazy(() => import("./pages/FrameworksPage")); const FrameworksPage = lazy(() => import("./pages/FrameworksPage"));
const FrameworkPage = lazy(() => import("./pages/FrameworkPage")); const FrameworkOverviewPage = lazy(() => import("./pages/FrameworkOverviewPage"));
function App() { function App() {
return ( return (
<StrictMode> <StrictMode>
@@ -41,7 +42,7 @@ function App() {
<Route path="/peoples" element={<PeoplesPage />} /> <Route path="/peoples" element={<PeoplesPage />} />
<Route path="/vendors" element={<VendorsPage />} /> <Route path="/vendors" element={<VendorsPage />} />
<Route path="/frameworks" element={<FrameworksPage />} /> <Route path="/frameworks" element={<FrameworksPage />} />
<Route path="/frameworks/:frameworkId" element={<FrameworkPage />} /> <Route path="/frameworks/:frameworkId" element={<FrameworkOverviewPage />} />
</Route> </Route>
<Route path="*" element={<NotFoundPage />} /> <Route path="*" element={<NotFoundPage />} />
</Routes> </Routes>

View File

@@ -22,10 +22,10 @@ import {
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Progress } from "@/components/ui/progress"; import { Progress } from "@/components/ui/progress";
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
import type { FrameworkPageQuery as FrameworkPageQueryType } from "./__generated__/FrameworkPageQuery.graphql"; import type { FrameworkOverviewPageQuery as FrameworkOverviewPageQueryType } from "./__generated__/FrameworkOverviewPageQuery.graphql";
const FrameworkPageQuery = graphql` const FrameworkOverviewPageQuery = graphql`
query FrameworkPageQuery($frameworkId: ID!) { query FrameworkOverviewPageQuery($frameworkId: ID!) {
node(id: $frameworkId) { node(id: $frameworkId) {
id id
... on Framework { ... on Framework {
@@ -46,12 +46,12 @@ const FrameworkPageQuery = graphql`
} }
`; `;
function FrameworkPageContent({ function FrameworkOverviewPageContent({
queryRef, queryRef,
}: { }: {
queryRef: PreloadedQuery<FrameworkPageQueryType>; queryRef: PreloadedQuery<FrameworkOverviewPageQueryType>;
}) { }) {
const data = usePreloadedQuery(FrameworkPageQuery, queryRef); const data = usePreloadedQuery(FrameworkOverviewPageQuery, queryRef);
const framework = data.node; const framework = data.node;
const controls = framework.controls?.edges.map(edge => edge?.node) ?? []; const controls = framework.controls?.edges.map(edge => edge?.node) ?? [];
@@ -164,7 +164,7 @@ function FrameworkPageContent({
); );
} }
function FrameworkPageFallback() { function FrameworkOverviewPageFallback() {
return ( return (
<div className="min-h-screen bg-background p-6"> <div className="min-h-screen bg-background p-6">
<div className="mb-8"> <div className="mb-8">
@@ -189,17 +189,17 @@ function FrameworkPageFallback() {
); );
} }
export default function FrameworkPage() { export default function FrameworkOverviewPage() {
const { frameworkId } = useParams(); const { frameworkId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<FrameworkPageQueryType>(FrameworkPageQuery); const [queryRef, loadQuery] = useQueryLoader<FrameworkOverviewPageQueryType>(FrameworkOverviewPageQuery);
useEffect(() => { useEffect(() => {
loadQuery({ frameworkId }); loadQuery({ frameworkId });
}, [loadQuery, frameworkId]); }, [loadQuery, frameworkId]);
return ( return (
<Suspense fallback={<FrameworkPageFallback />}> <Suspense fallback={<FrameworkOverviewPageFallback />}>
{queryRef && <FrameworkPageContent queryRef={queryRef} />} {queryRef && <FrameworkOverviewPageContent queryRef={queryRef} />}
</Suspense> </Suspense>
); );
} }

View File

@@ -1,5 +1,5 @@
/** /**
* @generated SignedSource<<51618c4ff52c6da6eb39cc0756d037e4>> * @generated SignedSource<<f9715593419cda898b34a0056729d77c>>
* @lightSyntaxTransform * @lightSyntaxTransform
* @nogrep * @nogrep
*/ */
@@ -10,10 +10,10 @@
import { ConcreteRequest } from 'relay-runtime'; import { ConcreteRequest } from 'relay-runtime';
export type ControlState = "IMPLEMENTED" | "IN_PROGRESS" | "NOT_APPLICABLE" | "NOT_STARTED"; export type ControlState = "IMPLEMENTED" | "IN_PROGRESS" | "NOT_APPLICABLE" | "NOT_STARTED";
export type FrameworkPageQuery$variables = { export type FrameworkOverviewPageQuery$variables = {
frameworkId: string; frameworkId: string;
}; };
export type FrameworkPageQuery$data = { export type FrameworkOverviewPageQuery$data = {
readonly node: { readonly node: {
readonly controls?: { readonly controls?: {
readonly edges: ReadonlyArray<{ readonly edges: ReadonlyArray<{
@@ -30,9 +30,9 @@ export type FrameworkPageQuery$data = {
readonly name?: string; readonly name?: string;
}; };
}; };
export type FrameworkPageQuery = { export type FrameworkOverviewPageQuery = {
response: FrameworkPageQuery$data; response: FrameworkOverviewPageQuery$data;
variables: FrameworkPageQuery$variables; variables: FrameworkOverviewPageQuery$variables;
}; };
const node: ConcreteRequest = (function(){ const node: ConcreteRequest = (function(){
@@ -128,7 +128,7 @@ return {
"argumentDefinitions": (v0/*: any*/), "argumentDefinitions": (v0/*: any*/),
"kind": "Fragment", "kind": "Fragment",
"metadata": null, "metadata": null,
"name": "FrameworkPageQuery", "name": "FrameworkOverviewPageQuery",
"selections": [ "selections": [
{ {
"alias": null, "alias": null,
@@ -151,7 +151,7 @@ return {
"operation": { "operation": {
"argumentDefinitions": (v0/*: any*/), "argumentDefinitions": (v0/*: any*/),
"kind": "Operation", "kind": "Operation",
"name": "FrameworkPageQuery", "name": "FrameworkOverviewPageQuery",
"selections": [ "selections": [
{ {
"alias": null, "alias": null,
@@ -176,16 +176,16 @@ return {
] ]
}, },
"params": { "params": {
"cacheID": "20c37c26ec0c229a526ba1f84a0bb22e", "cacheID": "4190ee685492e95820ecb106f2dc7e3c",
"id": null, "id": null,
"metadata": {}, "metadata": {},
"name": "FrameworkPageQuery", "name": "FrameworkOverviewPageQuery",
"operationKind": "query", "operationKind": "query",
"text": "query FrameworkPageQuery(\n $frameworkId: ID!\n) {\n node(id: $frameworkId) {\n __typename\n id\n ... on Framework {\n name\n description\n controls {\n edges {\n node {\n id\n name\n description\n state\n }\n }\n }\n }\n }\n}\n" "text": "query FrameworkOverviewPageQuery(\n $frameworkId: ID!\n) {\n node(id: $frameworkId) {\n __typename\n id\n ... on Framework {\n name\n description\n controls {\n edges {\n node {\n id\n name\n description\n state\n }\n }\n }\n }\n }\n}\n"
} }
}; };
})(); })();
(node as any).hash = "c018807d1942d694eceae254a3078c4d"; (node as any).hash = "25fb6b72c598d19767825ac648654fcf";
export default node; export default node;