mirror of
https://github.com/Sendouc/sendou.ink.git
synced 2026-09-29 14:50:13 -05:00
Typed scalars
This commit is contained in:
Kalle (Sendou)
@@ -1,7 +1,15 @@
|
||||
overwrite: true
|
||||
schema: "http://localhost:4000/graphql"
|
||||
documents: "**/*.graphql"
|
||||
config:
|
||||
scalars:
|
||||
Datetime: Date
|
||||
generates:
|
||||
generated/introspection.json:
|
||||
plugins:
|
||||
- "introspection"
|
||||
config:
|
||||
minify: true
|
||||
generated/graphql.ts:
|
||||
plugins:
|
||||
- "typescript"
|
||||
|
||||
@@ -6,8 +6,6 @@ export function InfoBanner() {
|
||||
const { data } = useTournamentData();
|
||||
const tournament = data?.tournamentByIdentifier;
|
||||
|
||||
// TODO: handle loading
|
||||
// TODO: handle error in parent
|
||||
if (!tournament) return null;
|
||||
|
||||
return (
|
||||
@@ -66,19 +64,19 @@ export function InfoBanner() {
|
||||
);
|
||||
}
|
||||
|
||||
function weekdayAndStartTime(date: string) {
|
||||
return new Date(date).toLocaleString("en-US", {
|
||||
function weekdayAndStartTime(date: Date) {
|
||||
return date.toLocaleString("en-US", {
|
||||
weekday: "long",
|
||||
hour: "numeric",
|
||||
});
|
||||
}
|
||||
|
||||
function shortMonthName(date: string) {
|
||||
return new Date(date).toLocaleString("en-US", { month: "short" });
|
||||
function shortMonthName(date: Date) {
|
||||
return date.toLocaleString("en-US", { month: "short" });
|
||||
}
|
||||
|
||||
function dayNumber(date: string) {
|
||||
return new Date(date).toLocaleString("en-US", { day: "numeric" });
|
||||
function dayNumber(date: Date) {
|
||||
return date.toLocaleString("en-US", { day: "numeric" });
|
||||
}
|
||||
|
||||
const S_Container = styled("div", {
|
||||
|
||||
@@ -18,7 +18,7 @@ export type Scalars = {
|
||||
* A point in time as described by the [ISO
|
||||
* 8601](https://en.wikipedia.org/wiki/ISO_8601) standard. May or may not include a timezone.
|
||||
*/
|
||||
Datetime: any;
|
||||
Datetime: Date;
|
||||
/** A universally unique identifier as defined by [RFC 4122](https://tools.ietf.org/html/rfc4122). */
|
||||
UUID: any;
|
||||
};
|
||||
@@ -2253,7 +2253,7 @@ export type TournamentByIdentifierQueryVariables = Exact<{
|
||||
}>;
|
||||
|
||||
|
||||
export type TournamentByIdentifierQuery = { __typename?: 'Query', tournamentByIdentifier?: { __typename?: 'Tournament', name: string, startTime: any, checkInTime?: any | null | undefined, bannerBackground: string, description?: string | null | undefined, textColor?: string | null | undefined, organizationByOrganizationIdentifier: { __typename?: 'Organization', name: string, discordInviteUrl?: string | null | undefined, twitterUrl?: string | null | undefined }, tournamentTeamsByTournamentIdentifier: { __typename?: 'TournamentTeamsConnection', nodes: Array<{ __typename?: 'TournamentTeam', name: string, tournamentTeamRostersByTournamentTeamId: { __typename?: 'TournamentTeamRostersConnection', nodes: Array<{ __typename?: 'TournamentTeamRoster', captain: boolean, accountByMemberId: { __typename?: 'Account', discordFullUsername?: string | null | undefined } }> } }> }, mapPoolsByTournamentIdentifier: { __typename?: 'MapPoolsConnection', nodes: Array<{ __typename?: 'MapPool', mapModeByMapModeId: { __typename?: 'MapMode', stage: string, gameMode: ModeEnum } }> } } | null | undefined };
|
||||
export type TournamentByIdentifierQuery = { __typename?: 'Query', tournamentByIdentifier?: { __typename?: 'Tournament', name: string, startTime: Date, checkInTime?: Date | null | undefined, bannerBackground: string, description?: string | null | undefined, textColor?: string | null | undefined, organizationByOrganizationIdentifier: { __typename?: 'Organization', name: string, discordInviteUrl?: string | null | undefined, twitterUrl?: string | null | undefined }, tournamentTeamsByTournamentIdentifier: { __typename?: 'TournamentTeamsConnection', nodes: Array<{ __typename?: 'TournamentTeam', name: string, tournamentTeamRostersByTournamentTeamId: { __typename?: 'TournamentTeamRostersConnection', nodes: Array<{ __typename?: 'TournamentTeamRoster', captain: boolean, accountByMemberId: { __typename?: 'Account', discordFullUsername?: string | null | undefined } }> } }> }, mapPoolsByTournamentIdentifier: { __typename?: 'MapPoolsConnection', nodes: Array<{ __typename?: 'MapPool', mapModeByMapModeId: { __typename?: 'MapMode', stage: string, gameMode: ModeEnum } }> } } | null | undefined };
|
||||
|
||||
|
||||
export const TournamentByIdentifierDocument = gql`
|
||||
|
||||
1
frontend/generated/introspection.json
Normal file
1
frontend/generated/introspection.json
Normal file
File diff suppressed because one or more lines are too long
50
frontend/package-lock.json
generated
50
frontend/package-lock.json
generated
@@ -14,10 +14,12 @@
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-icons": "^4.3.1",
|
||||
"urql": "^2.0.5"
|
||||
"urql": "^2.0.5",
|
||||
"urql-custom-scalars-exchange": "^0.1.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@graphql-codegen/cli": "2.2.2",
|
||||
"@graphql-codegen/introspection": "^2.1.0",
|
||||
"@graphql-codegen/typescript": "2.3.1",
|
||||
"@graphql-codegen/typescript-operations": "^2.2.0",
|
||||
"@graphql-codegen/typescript-urql": "^3.4.0",
|
||||
@@ -1623,6 +1625,19 @@
|
||||
"graphql": "^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@graphql-codegen/introspection": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-codegen/introspection/-/introspection-2.1.0.tgz",
|
||||
"integrity": "sha512-seGWZaX9vUd1RxSs+MBa9WOU+PCl8DNeScsOmxQP4qRC6rCle7y8pjeLKGduRarucIbO+nzY9jqaTAiMUogo8g==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@graphql-codegen/plugin-helpers": "^2.1.0",
|
||||
"tslib": "~2.3.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"graphql": "^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@graphql-codegen/plugin-helpers": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-codegen/plugin-helpers/-/plugin-helpers-2.3.1.tgz",
|
||||
@@ -15309,6 +15324,19 @@
|
||||
"react": ">= 16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/urql-custom-scalars-exchange": {
|
||||
"version": "0.1.5",
|
||||
"resolved": "https://registry.npmjs.org/urql-custom-scalars-exchange/-/urql-custom-scalars-exchange-0.1.5.tgz",
|
||||
"integrity": "sha512-8XhLOH8xTq5p1tlWhfwEdF3zstKt/nB6QNu5Ka5c5Htk4/p4/KOE0jkkD/YNfVCTpY7t1aTfA0g3do9a8+R2fw==",
|
||||
"dependencies": {
|
||||
"@urql/core": "^1.12.3 || ^2.0.0",
|
||||
"graphql": "^15.3.0",
|
||||
"wonka": "^4.0.14"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/use": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
|
||||
@@ -17282,6 +17310,16 @@
|
||||
"tslib": "~2.3.0"
|
||||
}
|
||||
},
|
||||
"@graphql-codegen/introspection": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-codegen/introspection/-/introspection-2.1.0.tgz",
|
||||
"integrity": "sha512-seGWZaX9vUd1RxSs+MBa9WOU+PCl8DNeScsOmxQP4qRC6rCle7y8pjeLKGduRarucIbO+nzY9jqaTAiMUogo8g==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@graphql-codegen/plugin-helpers": "^2.1.0",
|
||||
"tslib": "~2.3.0"
|
||||
}
|
||||
},
|
||||
"@graphql-codegen/plugin-helpers": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-codegen/plugin-helpers/-/plugin-helpers-2.3.1.tgz",
|
||||
@@ -28087,6 +28125,16 @@
|
||||
"wonka": "^4.0.14"
|
||||
}
|
||||
},
|
||||
"urql-custom-scalars-exchange": {
|
||||
"version": "0.1.5",
|
||||
"resolved": "https://registry.npmjs.org/urql-custom-scalars-exchange/-/urql-custom-scalars-exchange-0.1.5.tgz",
|
||||
"integrity": "sha512-8XhLOH8xTq5p1tlWhfwEdF3zstKt/nB6QNu5Ka5c5Htk4/p4/KOE0jkkD/YNfVCTpY7t1aTfA0g3do9a8+R2fw==",
|
||||
"requires": {
|
||||
"@urql/core": "^1.12.3 || ^2.0.0",
|
||||
"graphql": "^15.3.0",
|
||||
"wonka": "^4.0.14"
|
||||
}
|
||||
},
|
||||
"use": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
|
||||
|
||||
@@ -17,10 +17,12 @@
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-icons": "^4.3.1",
|
||||
"urql": "^2.0.5"
|
||||
"urql": "^2.0.5",
|
||||
"urql-custom-scalars-exchange": "^0.1.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@graphql-codegen/cli": "2.2.2",
|
||||
"@graphql-codegen/introspection": "^2.1.0",
|
||||
"@graphql-codegen/typescript": "2.3.1",
|
||||
"@graphql-codegen/typescript-operations": "^2.2.0",
|
||||
"@graphql-codegen/typescript-urql": "^3.4.0",
|
||||
|
||||
@@ -5,7 +5,9 @@ import { AppProps } from "next/app";
|
||||
import Head from "next/head";
|
||||
import { Layout } from "components/layout/Layout";
|
||||
import { globalCss } from "stitches.config";
|
||||
import { Provider, createClient } from "urql";
|
||||
import { Provider, createClient, fetchExchange } from "urql";
|
||||
import customScalarsExchange from "urql-custom-scalars-exchange";
|
||||
import schema from "generated/introspection.json";
|
||||
|
||||
const globalStyles = globalCss({
|
||||
"*": { boxSizing: "border-box" },
|
||||
@@ -24,6 +26,17 @@ const globalStyles = globalCss({
|
||||
|
||||
const client = createClient({
|
||||
url: "http://localhost:4000/graphql",
|
||||
exchanges: [
|
||||
customScalarsExchange({
|
||||
schema: schema as any,
|
||||
scalars: {
|
||||
Datetime(value) {
|
||||
return new Date(value);
|
||||
},
|
||||
},
|
||||
}),
|
||||
fetchExchange,
|
||||
],
|
||||
});
|
||||
|
||||
export default function App(props: AppProps) {
|
||||
|
||||
Reference in New Issue
Block a user