Add peoples page

Signed-off-by: gearnode <bryan@frimin.fr>
This commit is contained in:
gearnode
2025-02-09 19:00:47 -08:00
parent b10f48998d
commit aa53264df0
4 changed files with 431 additions and 0 deletions

View File

@@ -22,6 +22,7 @@ posthog.init(process.env.POSTHOG_KEY!, {
const HomePage = lazy(() => import("./pages/HomePage"));
const NotFoundPage = lazy(() => import("./pages/NotFoundPage"));
const PeoplesPage = lazy(() => import("./pages/PeoplesPage"));
function App() {
return (
@@ -35,6 +36,7 @@ function App() {
<Routes>
<Route path="/" element={<ConsoleLayout />}>
<Route index element={<HomePage />} />
<Route path="/peoples" element={<PeoplesPage />} />
</Route>
<Route path="*" element={<NotFoundPage />} />
</Routes>

View File

@@ -0,0 +1,63 @@
import { Suspense, useEffect } from "react";
import {
graphql,
PreloadedQuery,
usePreloadedQuery,
useQueryLoader,
} from "react-relay";
import type { PeoplesPageQuery as PeoplesPageQueryType } from "./__generated__/PeoplesPageQuery.graphql";
const PeoplesPageQuery = graphql`
query PeoplesPageQuery {
node(id: "AZSfP_xAcAC5IAAAAAAltA") {
id
... on Organization {
peoples {
edges {
node {
id
fullName
primaryEmailAddress
additionalEmailAddresses
createdAt
updatedAt
}
}
}
}
}
}
`;
function PeoplesPageContent({
queryRef,
}: {
queryRef: PreloadedQuery<PeoplesPageQueryType>;
}) {
const data = usePreloadedQuery(PeoplesPageQuery, queryRef);
return (
<pre>{JSON.stringify(data, null, 2)}</pre>
);
}
function PeoplesPageFallback() {
return <div>Loading...</div>;
}
export default function PeoplesPage() {
const [queryRef, loadQuery] = useQueryLoader<PeoplesPageQueryType>(PeoplesPageQuery);
useEffect(() => {
loadQuery({});
}, [loadQuery]);
if (!queryRef) {
return <PeoplesPageFallback />;
}
return (
<Suspense fallback={<PeoplesPageFallback />}>
<PeoplesPageContent queryRef={queryRef} />
</Suspense>
);
}

View File

@@ -0,0 +1,191 @@
/**
* @generated SignedSource<<e0bd568420e8442ebe1e1f968d206979>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type PeoplesPageQuery$variables = Record<PropertyKey, never>;
export type PeoplesPageQuery$data = {
readonly node: {
readonly id: string;
readonly peoples?: {
readonly edges: ReadonlyArray<{
readonly node: {
readonly additionalEmailAddresses: ReadonlyArray<string>;
readonly createdAt: any;
readonly fullName: string;
readonly id: string;
readonly primaryEmailAddress: string;
readonly updatedAt: any;
};
}>;
};
};
};
export type PeoplesPageQuery = {
response: PeoplesPageQuery$data;
variables: PeoplesPageQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"kind": "Literal",
"name": "id",
"value": "AZSfP_xAcAC5IAAAAAAltA"
}
],
v1 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v2 = {
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": null,
"concreteType": "PeopleConnection",
"kind": "LinkedField",
"name": "peoples",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "PeopleEdge",
"kind": "LinkedField",
"name": "edges",
"plural": true,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "People",
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v1/*: any*/),
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "fullName",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "primaryEmailAddress",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "additionalEmailAddresses",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "createdAt",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "updatedAt",
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
}
],
"type": "Organization",
"abstractKey": null
};
return {
"fragment": {
"argumentDefinitions": [],
"kind": "Fragment",
"metadata": null,
"name": "PeoplesPageQuery",
"selections": [
{
"alias": null,
"args": (v0/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v1/*: any*/),
(v2/*: any*/)
],
"storageKey": "node(id:\"AZSfP_xAcAC5IAAAAAAltA\")"
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": [],
"kind": "Operation",
"name": "PeoplesPageQuery",
"selections": [
{
"alias": null,
"args": (v0/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
(v1/*: any*/),
(v2/*: any*/)
],
"storageKey": "node(id:\"AZSfP_xAcAC5IAAAAAAltA\")"
}
]
},
"params": {
"cacheID": "98a9fdbb092f803bd997c417aed8b9a4",
"id": null,
"metadata": {},
"name": "PeoplesPageQuery",
"operationKind": "query",
"text": "query PeoplesPageQuery {\n node(id: \"AZSfP_xAcAC5IAAAAAAltA\") {\n __typename\n id\n ... on Organization {\n peoples {\n edges {\n node {\n id\n fullName\n primaryEmailAddress\n additionalEmailAddresses\n createdAt\n updatedAt\n }\n }\n }\n }\n }\n}\n"
}
};
})();
(node as any).hash = "72495143e41518eb0c6bc2e1af81bded";
export default node;

View File

@@ -0,0 +1,175 @@
/**
* @generated SignedSource<<76613a71949a43eb69fb9dfd0a4c1694>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type VendorsPageQuery$variables = Record<PropertyKey, never>;
export type VendorsPageQuery$data = {
readonly node: {
readonly id: string;
readonly vendors?: {
readonly edges: ReadonlyArray<{
readonly node: {
readonly createdAt: any;
readonly id: string;
readonly name: string;
readonly updatedAt: any;
};
}>;
};
};
};
export type VendorsPageQuery = {
response: VendorsPageQuery$data;
variables: VendorsPageQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"kind": "Literal",
"name": "id",
"value": "AZSfP_xAcAC5IAAAAAAltA"
}
],
v1 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v2 = {
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": null,
"concreteType": "VendorConnection",
"kind": "LinkedField",
"name": "vendors",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "VendorEdge",
"kind": "LinkedField",
"name": "edges",
"plural": true,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "Vendor",
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v1/*: any*/),
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "createdAt",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "updatedAt",
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
}
],
"type": "Organization",
"abstractKey": null
};
return {
"fragment": {
"argumentDefinitions": [],
"kind": "Fragment",
"metadata": null,
"name": "VendorsPageQuery",
"selections": [
{
"alias": null,
"args": (v0/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v1/*: any*/),
(v2/*: any*/)
],
"storageKey": "node(id:\"AZSfP_xAcAC5IAAAAAAltA\")"
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": [],
"kind": "Operation",
"name": "VendorsPageQuery",
"selections": [
{
"alias": null,
"args": (v0/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
(v1/*: any*/),
(v2/*: any*/)
],
"storageKey": "node(id:\"AZSfP_xAcAC5IAAAAAAltA\")"
}
]
},
"params": {
"cacheID": "6e90edfb4e2117a046157785647169c7",
"id": null,
"metadata": {},
"name": "VendorsPageQuery",
"operationKind": "query",
"text": "query VendorsPageQuery {\n node(id: \"AZSfP_xAcAC5IAAAAAAltA\") {\n __typename\n id\n ... on Organization {\n vendors {\n edges {\n node {\n id\n name\n createdAt\n updatedAt\n }\n }\n }\n }\n }\n}\n"
}
};
})();
(node as any).hash = "22ce46326b87e66442cdb832085dfe60";
export default node;