From da8a489748e42ea011085bb2ebef976ba567e0e7 Mon Sep 17 00:00:00 2001 From: Kerry Date: Thu, 31 Aug 2023 11:27:39 +1200 Subject: [PATCH] Make Profile page the default route (#1653) * make profile the default route * src/pages/Home.tsx -> src/pages/SessionsOverview.tsx * UserHome -> UserSessionsOverview * update snapshots, fix session overview button alignment --- frontend/src/Router.test.tsx | 11 +- frontend/src/Router.tsx | 22 +- frontend/src/components/Layout.tsx | 2 +- .../src/components/NavBar/NavBar.stories.tsx | 4 +- .../components/NavItem/NavItem.stories.tsx | 4 +- .../src/components/NavItem/NavItem.test.tsx | 6 +- .../__snapshots__/NavItem.test.tsx.snap | 6 +- .../UnverifiedEmailAlert.test.tsx.snap | 2 +- .../UserSessionsOverview.module.css} | 2 +- .../UserSessionsOverview.stories.tsx} | 6 +- .../UserSessionsOverview.test.tsx} | 12 +- .../UserSessionsOverview.tsx} | 8 +- .../UserSessionsOverview.test.tsx.snap} | 28 +-- .../index.ts | 2 +- .../__snapshots__/Layout.test.tsx.snap | 6 +- frontend/src/gql/gql.ts | 28 +-- frontend/src/gql/graphql.ts | 204 +++++++++--------- .../pages/{Home.tsx => SessionsOverview.tsx} | 18 +- frontend/src/test-utils/WithLocation.tsx | 2 +- 19 files changed, 189 insertions(+), 184 deletions(-) rename frontend/src/components/{UserHome/UserHome.module.css => UserSessionsOverview/UserSessionsOverview.module.css} (96%) rename frontend/src/components/{UserHome/UserHome.stories.tsx => UserSessionsOverview/UserSessionsOverview.stories.tsx} (95%) rename frontend/src/components/{UserHome/UserHome.test.tsx => UserSessionsOverview/UserSessionsOverview.test.tsx} (86%) rename frontend/src/components/{UserHome/UserHome.tsx => UserSessionsOverview/UserSessionsOverview.tsx} (94%) rename frontend/src/components/{UserHome/__snapshots__/UserHome.test.tsx.snap => UserSessionsOverview/__snapshots__/UserSessionsOverview.test.tsx.snap} (78%) rename frontend/src/components/{UserHome => UserSessionsOverview}/index.ts (91%) rename frontend/src/pages/{Home.tsx => SessionsOverview.tsx} (74%) diff --git a/frontend/src/Router.test.tsx b/frontend/src/Router.test.tsx index 533ca9231..8c8322aee 100644 --- a/frontend/src/Router.test.tsx +++ b/frontend/src/Router.test.tsx @@ -18,18 +18,13 @@ import { segmentsToRoute } from "./Router"; describe("Router", () => { describe("segmentsToRoute", () => { - it("returns home for route with no segments", () => { + it("returns profile for route with no segments", () => { const segments: string[] = []; - expect(segmentsToRoute(segments)).toEqual({ type: "home" }); + expect(segmentsToRoute(segments)).toEqual({ type: "profile" }); }); - it("returns home for route with and empty string segment", () => { + it("returns profile for route with and empty string segment", () => { const segments: string[] = [""]; - expect(segmentsToRoute(segments)).toEqual({ type: "home" }); - }); - - it("returns profile for route with profile", () => { - const segments: string[] = ["profile"]; expect(segmentsToRoute(segments)).toEqual({ type: "profile" }); }); diff --git a/frontend/src/Router.tsx b/frontend/src/Router.tsx index cc19ff718..47ca94a3a 100644 --- a/frontend/src/Router.tsx +++ b/frontend/src/Router.tsx @@ -25,8 +25,8 @@ type Location = { searchParams?: URLSearchParams; }; -type HomeRoute = { type: "home" }; type ProfileRoute = { type: "profile" }; +type SessionOverviewRoute = { type: "sessions-overview" }; type OAuth2ClientRoute = { type: "client"; id: string }; type OAuth2SessionList = { type: "oauth2-session-list" }; type BrowserSessionRoute = { type: "session"; id: string }; @@ -36,7 +36,7 @@ type VerifyEmailRoute = { type: "verify-email"; id: string }; type UnknownRoute = { type: "unknown"; segments: string[] }; export type Route = - | HomeRoute + | SessionOverviewRoute | ProfileRoute | OAuth2ClientRoute | OAuth2SessionList @@ -48,10 +48,10 @@ export type Route = const routeToSegments = (route: Route): string[] => { switch (route.type) { - case "home": - return []; case "profile": - return ["profile"]; + return []; + case "sessions-overview": + return ["sessions-overview"]; case "verify-email": return ["emails", route.id, "verify"]; case "client": @@ -97,11 +97,11 @@ export const segmentsToRoute = (segments: string[]): Route => { // Special case for the home page if (segments.length === 0 || (segments.length === 1 && segments[0] === "")) { - return { type: "home" }; + return { type: "profile" }; } - if (matches("profile")) { - return { type: "profile" }; + if (matches("sessions-overview")) { + return { type: "sessions-overview" }; } if (matches("sessions")) { @@ -169,7 +169,7 @@ export const routeAtom = atom( }, ); -const Home = lazy(() => import("./pages/Home")); +const SessionsOverview = lazy(() => import("./pages/SessionsOverview")); const Profile = lazy(() => import("./pages/Profile")); const OAuth2Client = lazy(() => import("./pages/OAuth2Client")); const BrowserSession = lazy(() => import("./pages/BrowserSession")); @@ -182,10 +182,10 @@ const InnerRouter: React.FC = () => { const route = useAtomValue(routeAtom); switch (route.type) { - case "home": - return ; case "profile": return ; + case "sessions-overview": + return ; case "oauth2-session-list": return ; case "browser-session-list": diff --git a/frontend/src/components/Layout.tsx b/frontend/src/components/Layout.tsx index 64f4bd953..9a7342b28 100644 --- a/frontend/src/components/Layout.tsx +++ b/frontend/src/components/Layout.tsx @@ -42,8 +42,8 @@ const Layout: React.FC<{ children?: React.ReactNode }> = ({ children }) => { - Sessions Profile + Sessions
{children}
diff --git a/frontend/src/components/NavBar/NavBar.stories.tsx b/frontend/src/components/NavBar/NavBar.stories.tsx index 06de4cc86..97360f036 100644 --- a/frontend/src/components/NavBar/NavBar.stories.tsx +++ b/frontend/src/components/NavBar/NavBar.stories.tsx @@ -29,8 +29,8 @@ const meta = { - Home - Emails + Sessions + Profile External diff --git a/frontend/src/components/NavItem/NavItem.stories.tsx b/frontend/src/components/NavItem/NavItem.stories.tsx index c5421ecfe..08c74e755 100644 --- a/frontend/src/components/NavItem/NavItem.stories.tsx +++ b/frontend/src/components/NavItem/NavItem.stories.tsx @@ -46,8 +46,8 @@ type Story = StoryObj; export const Active: Story = { args: { - route: { type: "home" }, - children: "Home", + route: { type: "sessions-overview" }, + children: "Sessions", }, }; diff --git a/frontend/src/components/NavItem/NavItem.test.tsx b/frontend/src/components/NavItem/NavItem.test.tsx index f917639fe..894c06dcc 100644 --- a/frontend/src/components/NavItem/NavItem.test.tsx +++ b/frontend/src/components/NavItem/NavItem.test.tsx @@ -59,7 +59,7 @@ describe("NavItem", () => { it("render an active ", () => { const component = create( - Active + Active , ); const tree = component.toJSON(); @@ -69,7 +69,7 @@ describe("NavItem", () => { it("render an inactive ", () => { const component = create( - Inactive + Inactive , ); const tree = component.toJSON(); @@ -79,7 +79,7 @@ describe("NavItem", () => { it("renders a different route", () => { const component = create( - Emails + Sessions , ); const tree = component.toJSON(); diff --git a/frontend/src/components/NavItem/__snapshots__/NavItem.test.tsx.snap b/frontend/src/components/NavItem/__snapshots__/NavItem.test.tsx.snap index 2a1b1c395..7b3ba40fb 100644 --- a/frontend/src/components/NavItem/__snapshots__/NavItem.test.tsx.snap +++ b/frontend/src/components/NavItem/__snapshots__/NavItem.test.tsx.snap @@ -22,7 +22,7 @@ exports[`NavItem > render an inactive 1`] = ` > Inactive @@ -36,10 +36,10 @@ exports[`NavItem > renders a different route 1`] = ` > - Emails + Sessions `; diff --git a/frontend/src/components/UnverifiedEmailAlert/__snapshots__/UnverifiedEmailAlert.test.tsx.snap b/frontend/src/components/UnverifiedEmailAlert/__snapshots__/UnverifiedEmailAlert.test.tsx.snap index f6fdd7623..24cbccf25 100644 --- a/frontend/src/components/UnverifiedEmailAlert/__snapshots__/UnverifiedEmailAlert.test.tsx.snap +++ b/frontend/src/components/UnverifiedEmailAlert/__snapshots__/UnverifiedEmailAlert.test.tsx.snap @@ -35,7 +35,7 @@ exports[` > renders a warning when there are unverified Review and verify diff --git a/frontend/src/components/UserHome/UserHome.module.css b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.module.css similarity index 96% rename from frontend/src/components/UserHome/UserHome.module.css rename to frontend/src/components/UserSessionsOverview/UserSessionsOverview.module.css index 5ec66e54b..b7a53fdc7 100644 --- a/frontend/src/components/UserHome/UserHome.module.css +++ b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.module.css @@ -17,7 +17,7 @@ display: flex; flex-direction: row; justify-content: space-between; - align-content: center; + align-items: flex-start; gap: var(--cpd-space-1x); } diff --git a/frontend/src/components/UserHome/UserHome.stories.tsx b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.stories.tsx similarity index 95% rename from frontend/src/components/UserHome/UserHome.stories.tsx rename to frontend/src/components/UserSessionsOverview/UserSessionsOverview.stories.tsx index 43f64b141..57114d12a 100644 --- a/frontend/src/components/UserHome/UserHome.stories.tsx +++ b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.stories.tsx @@ -20,7 +20,7 @@ import { appConfigAtom, locationAtom } from "../../Router"; import { makeFragmentData } from "../../gql"; import { FRAGMENT as EMAIL_FRAGMENT } from "../UserEmail"; -import UserHome, { FRAGMENT } from "./UserHome"; +import UserSessionsOverview, { FRAGMENT } from "./UserSessionsOverview"; type Props = { primaryEmail: string | null; @@ -86,14 +86,14 @@ const Template: React.FC = ({ return ( - + ); }; const meta = { - title: "Pages/User Home", + title: "Pages/User Sessions Overview", component: Template, tags: ["autodocs"], } satisfies Meta; diff --git a/frontend/src/components/UserHome/UserHome.test.tsx b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.test.tsx similarity index 86% rename from frontend/src/components/UserHome/UserHome.test.tsx rename to frontend/src/components/UserSessionsOverview/UserSessionsOverview.test.tsx index 27707ddc7..c3c1537e0 100644 --- a/frontend/src/components/UserHome/UserHome.test.tsx +++ b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.test.tsx @@ -18,10 +18,10 @@ import { describe, expect, it } from "vitest"; import { makeFragmentData } from "../../gql"; import { FRAGMENT as EMAIL_FRAGMENT } from "../UserEmail"; -import UserHome, { FRAGMENT } from "./"; +import UserSessionsOverview, { FRAGMENT } from "./"; -describe("UserHome", () => { - it("render an simple ", () => { +describe("UserSessionsOverview", () => { + it("render an simple ", () => { const primaryEmail = makeFragmentData( { id: "email:123", @@ -56,12 +56,12 @@ describe("UserHome", () => { }, FRAGMENT, ); - const component = create(); + const component = create(); const tree = component.toJSON(); expect(tree).toMatchSnapshot(); }); - it("render a with sessions", () => { + it("render a with sessions", () => { const primaryEmail = makeFragmentData( { id: "email:123", @@ -96,7 +96,7 @@ describe("UserHome", () => { }, FRAGMENT, ); - const component = create(); + const component = create(); const tree = component.toJSON(); expect(tree).toMatchSnapshot(); }); diff --git a/frontend/src/components/UserHome/UserHome.tsx b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.tsx similarity index 94% rename from frontend/src/components/UserHome/UserHome.tsx rename to frontend/src/components/UserSessionsOverview/UserSessionsOverview.tsx index c4c6119d7..73756bddf 100644 --- a/frontend/src/components/UserHome/UserHome.tsx +++ b/frontend/src/components/UserSessionsOverview/UserSessionsOverview.tsx @@ -19,10 +19,10 @@ import { FragmentType, graphql, useFragment } from "../../gql"; import Block from "../Block/Block"; import BlockList from "../BlockList/BlockList"; -import styles from "./UserHome.module.css"; +import styles from "./UserSessionsOverview.module.css"; export const FRAGMENT = graphql(/* GraphQL */ ` - fragment UserHome_user on User { + fragment UserSessionsOverview_user on User { id primaryEmail { @@ -48,7 +48,7 @@ export const FRAGMENT = graphql(/* GraphQL */ ` } `); -const UserHome: React.FC<{ +const UserSessionsOverview: React.FC<{ user: FragmentType; }> = ({ user }) => { const data = useFragment(FRAGMENT, user); @@ -106,4 +106,4 @@ const UserHome: React.FC<{ ); }; -export default UserHome; +export default UserSessionsOverview; diff --git a/frontend/src/components/UserHome/__snapshots__/UserHome.test.tsx.snap b/frontend/src/components/UserSessionsOverview/__snapshots__/UserSessionsOverview.test.tsx.snap similarity index 78% rename from frontend/src/components/UserHome/__snapshots__/UserHome.test.tsx.snap rename to frontend/src/components/UserSessionsOverview/__snapshots__/UserSessionsOverview.test.tsx.snap index 4f85ba28f..73a22a905 100644 --- a/frontend/src/components/UserHome/__snapshots__/UserHome.test.tsx.snap +++ b/frontend/src/components/UserSessionsOverview/__snapshots__/UserSessionsOverview.test.tsx.snap @@ -1,6 +1,6 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`UserHome > render a with sessions 1`] = ` +exports[`UserSessionsOverview > render a with sessions 1`] = `
@@ -10,10 +10,10 @@ exports[`UserHome > render a with sessions 1`] = ` Where you're signed in
render a with sessions 1`] = `
render a with sessions 1`] = `
render a with sessions 1`] = `
`; -exports[`UserHome > render an simple 1`] = ` +exports[`UserSessionsOverview > render an simple 1`] = `
@@ -106,10 +106,10 @@ exports[`UserHome > render an simple 1`] = ` Where you're signed in
render an simple 1`] = `
render an simple 1`] = `
> renders app navigation correctly 1`] = ` Profile @@ -11,9 +12,8 @@ exports[` > renders app navigation correctly 1`] = ` exports[` > renders app navigation correctly 2`] = ` Sessions diff --git a/frontend/src/gql/gql.ts b/frontend/src/gql/gql.ts index 8591d7444..057458515 100644 --- a/frontend/src/gql/gql.ts +++ b/frontend/src/gql/gql.ts @@ -47,8 +47,6 @@ const documents = { types.SetPrimaryEmailDocument, "\n query UserGreeting($userId: ID!) {\n user(id: $userId) {\n id\n username\n matrix {\n mxid\n displayName\n }\n }\n viewer {\n __typename\n\n ... on User {\n id\n ...UnverifiedEmailAlert\n }\n }\n }\n": types.UserGreetingDocument, - "\n fragment UserHome_user on User {\n id\n\n primaryEmail {\n id\n ...UserEmail_email\n }\n\n confirmedEmails: emails(first: 0, state: CONFIRMED) {\n totalCount\n }\n\n browserSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n oauth2Sessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n compatSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n }\n": - types.UserHome_UserFragmentDoc, "\n mutation AddEmail($userId: ID!, $email: String!) {\n addEmail(input: { userId: $userId, email: $email }) {\n status\n violations\n email {\n id\n ...UserEmail_email\n }\n }\n }\n": types.AddEmailDocument, "\n query UserEmailListQuery(\n $userId: ID!\n $first: Int\n $after: String\n $last: Int\n $before: String\n ) {\n user(id: $userId) {\n id\n\n emails(first: $first, after: $after, last: $last, before: $before) {\n edges {\n cursor\n node {\n id\n ...UserEmail_email\n }\n }\n totalCount\n pageInfo {\n hasNextPage\n hasPreviousPage\n startCursor\n endCursor\n }\n }\n }\n }\n": @@ -57,6 +55,8 @@ const documents = { types.UserPrimaryEmailDocument, "\n mutation SetDisplayName($userId: ID!, $displayName: String) {\n setDisplayName(input: { userId: $userId, displayName: $displayName }) {\n status\n user {\n id\n matrix {\n displayName\n }\n }\n }\n }\n": types.SetDisplayNameDocument, + "\n fragment UserSessionsOverview_user on User {\n id\n\n primaryEmail {\n id\n ...UserEmail_email\n }\n\n confirmedEmails: emails(first: 0, state: CONFIRMED) {\n totalCount\n }\n\n browserSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n oauth2Sessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n compatSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n }\n": + types.UserSessionsOverview_UserFragmentDoc, "\n fragment UserEmail_verifyEmail on UserEmail {\n id\n email\n }\n": types.UserEmail_VerifyEmailFragmentDoc, "\n mutation VerifyEmail($id: ID!, $code: String!) {\n verifyEmail(input: { userEmailId: $id, code: $code }) {\n status\n\n user {\n id\n primaryEmail {\n id\n }\n }\n\n email {\n id\n ...UserEmail_email\n }\n }\n }\n": @@ -65,10 +65,10 @@ const documents = { types.ResendVerificationEmailDocument, "\n query BrowserSessionQuery($id: ID!) {\n browserSession(id: $id) {\n id\n createdAt\n lastAuthentication {\n id\n createdAt\n }\n user {\n id\n username\n }\n }\n }\n": types.BrowserSessionQueryDocument, - "\n query HomeQuery {\n viewer {\n __typename\n\n ... on User {\n id\n ...UserHome_user\n }\n }\n }\n": - types.HomeQueryDocument, "\n query OAuth2ClientQuery($id: ID!) {\n oauth2Client(id: $id) {\n id\n clientId\n clientName\n clientUri\n tosUri\n policyUri\n redirectUris\n }\n }\n": types.OAuth2ClientQueryDocument, + "\n query SessionsOverviewQuery {\n viewer {\n __typename\n\n ... on User {\n id\n ...UserSessionsOverview_user\n }\n }\n }\n": + types.SessionsOverviewQueryDocument, "\n query VerifyEmailQuery($id: ID!) {\n userEmail(id: $id) {\n ...UserEmail_verifyEmail\n }\n }\n": types.VerifyEmailQueryDocument, }; @@ -189,12 +189,6 @@ export function graphql( export function graphql( source: "\n query UserGreeting($userId: ID!) {\n user(id: $userId) {\n id\n username\n matrix {\n mxid\n displayName\n }\n }\n viewer {\n __typename\n\n ... on User {\n id\n ...UnverifiedEmailAlert\n }\n }\n }\n", ): (typeof documents)["\n query UserGreeting($userId: ID!) {\n user(id: $userId) {\n id\n username\n matrix {\n mxid\n displayName\n }\n }\n viewer {\n __typename\n\n ... on User {\n id\n ...UnverifiedEmailAlert\n }\n }\n }\n"]; -/** - * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. - */ -export function graphql( - source: "\n fragment UserHome_user on User {\n id\n\n primaryEmail {\n id\n ...UserEmail_email\n }\n\n confirmedEmails: emails(first: 0, state: CONFIRMED) {\n totalCount\n }\n\n browserSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n oauth2Sessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n compatSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n }\n", -): (typeof documents)["\n fragment UserHome_user on User {\n id\n\n primaryEmail {\n id\n ...UserEmail_email\n }\n\n confirmedEmails: emails(first: 0, state: CONFIRMED) {\n totalCount\n }\n\n browserSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n oauth2Sessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n compatSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n }\n"]; /** * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. */ @@ -219,6 +213,12 @@ export function graphql( export function graphql( source: "\n mutation SetDisplayName($userId: ID!, $displayName: String) {\n setDisplayName(input: { userId: $userId, displayName: $displayName }) {\n status\n user {\n id\n matrix {\n displayName\n }\n }\n }\n }\n", ): (typeof documents)["\n mutation SetDisplayName($userId: ID!, $displayName: String) {\n setDisplayName(input: { userId: $userId, displayName: $displayName }) {\n status\n user {\n id\n matrix {\n displayName\n }\n }\n }\n }\n"]; +/** + * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. + */ +export function graphql( + source: "\n fragment UserSessionsOverview_user on User {\n id\n\n primaryEmail {\n id\n ...UserEmail_email\n }\n\n confirmedEmails: emails(first: 0, state: CONFIRMED) {\n totalCount\n }\n\n browserSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n oauth2Sessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n compatSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n }\n", +): (typeof documents)["\n fragment UserSessionsOverview_user on User {\n id\n\n primaryEmail {\n id\n ...UserEmail_email\n }\n\n confirmedEmails: emails(first: 0, state: CONFIRMED) {\n totalCount\n }\n\n browserSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n oauth2Sessions(first: 0, state: ACTIVE) {\n totalCount\n }\n\n compatSessions(first: 0, state: ACTIVE) {\n totalCount\n }\n }\n"]; /** * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. */ @@ -247,14 +247,14 @@ export function graphql( * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. */ export function graphql( - source: "\n query HomeQuery {\n viewer {\n __typename\n\n ... on User {\n id\n ...UserHome_user\n }\n }\n }\n", -): (typeof documents)["\n query HomeQuery {\n viewer {\n __typename\n\n ... on User {\n id\n ...UserHome_user\n }\n }\n }\n"]; + source: "\n query OAuth2ClientQuery($id: ID!) {\n oauth2Client(id: $id) {\n id\n clientId\n clientName\n clientUri\n tosUri\n policyUri\n redirectUris\n }\n }\n", +): (typeof documents)["\n query OAuth2ClientQuery($id: ID!) {\n oauth2Client(id: $id) {\n id\n clientId\n clientName\n clientUri\n tosUri\n policyUri\n redirectUris\n }\n }\n"]; /** * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. */ export function graphql( - source: "\n query OAuth2ClientQuery($id: ID!) {\n oauth2Client(id: $id) {\n id\n clientId\n clientName\n clientUri\n tosUri\n policyUri\n redirectUris\n }\n }\n", -): (typeof documents)["\n query OAuth2ClientQuery($id: ID!) {\n oauth2Client(id: $id) {\n id\n clientId\n clientName\n clientUri\n tosUri\n policyUri\n redirectUris\n }\n }\n"]; + source: "\n query SessionsOverviewQuery {\n viewer {\n __typename\n\n ... on User {\n id\n ...UserSessionsOverview_user\n }\n }\n }\n", +): (typeof documents)["\n query SessionsOverviewQuery {\n viewer {\n __typename\n\n ... on User {\n id\n ...UserSessionsOverview_user\n }\n }\n }\n"]; /** * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients. */ diff --git a/frontend/src/gql/graphql.ts b/frontend/src/gql/graphql.ts index 1fa926957..b3142785d 100644 --- a/frontend/src/gql/graphql.ts +++ b/frontend/src/gql/graphql.ts @@ -1214,29 +1214,6 @@ export type UserGreetingQuery = { }); }; -export type UserHome_UserFragment = { - __typename?: "User"; - id: string; - primaryEmail?: - | ({ __typename?: "UserEmail"; id: string } & { - " $fragmentRefs"?: { UserEmail_EmailFragment: UserEmail_EmailFragment }; - }) - | null; - confirmedEmails: { __typename?: "UserEmailConnection"; totalCount: number }; - browserSessions: { - __typename?: "BrowserSessionConnection"; - totalCount: number; - }; - oauth2Sessions: { - __typename?: "Oauth2SessionConnection"; - totalCount: number; - }; - compatSessions: { - __typename?: "CompatSessionConnection"; - totalCount: number; - }; -} & { " $fragmentName"?: "UserHome_UserFragment" }; - export type AddEmailMutationVariables = Exact<{ userId: Scalars["ID"]["input"]; email: Scalars["String"]["input"]; @@ -1325,6 +1302,29 @@ export type SetDisplayNameMutation = { }; }; +export type UserSessionsOverview_UserFragment = { + __typename?: "User"; + id: string; + primaryEmail?: + | ({ __typename?: "UserEmail"; id: string } & { + " $fragmentRefs"?: { UserEmail_EmailFragment: UserEmail_EmailFragment }; + }) + | null; + confirmedEmails: { __typename?: "UserEmailConnection"; totalCount: number }; + browserSessions: { + __typename?: "BrowserSessionConnection"; + totalCount: number; + }; + oauth2Sessions: { + __typename?: "Oauth2SessionConnection"; + totalCount: number; + }; + compatSessions: { + __typename?: "CompatSessionConnection"; + totalCount: number; + }; +} & { " $fragmentName"?: "UserSessionsOverview_UserFragment" }; + export type UserEmail_VerifyEmailFragment = { __typename?: "UserEmail"; id: string; @@ -1395,17 +1395,6 @@ export type BrowserSessionQueryQuery = { } | null; }; -export type HomeQueryQueryVariables = Exact<{ [key: string]: never }>; - -export type HomeQueryQuery = { - __typename?: "Query"; - viewer: - | { __typename: "Anonymous" } - | ({ __typename: "User"; id: string } & { - " $fragmentRefs"?: { UserHome_UserFragment: UserHome_UserFragment }; - }); -}; - export type OAuth2ClientQueryQueryVariables = Exact<{ id: Scalars["ID"]["input"]; }>; @@ -1424,6 +1413,21 @@ export type OAuth2ClientQueryQuery = { } | null; }; +export type SessionsOverviewQueryQueryVariables = Exact<{ + [key: string]: never; +}>; + +export type SessionsOverviewQueryQuery = { + __typename?: "Query"; + viewer: + | { __typename: "Anonymous" } + | ({ __typename: "User"; id: string } & { + " $fragmentRefs"?: { + UserSessionsOverview_UserFragment: UserSessionsOverview_UserFragment; + }; + }); +}; + export type VerifyEmailQueryQueryVariables = Exact<{ id: Scalars["ID"]["input"]; }>; @@ -1640,12 +1644,12 @@ export const UserEmail_EmailFragmentDoc = { }, ], } as unknown as DocumentNode; -export const UserHome_UserFragmentDoc = { +export const UserSessionsOverview_UserFragmentDoc = { kind: "Document", definitions: [ { kind: "FragmentDefinition", - name: { kind: "Name", value: "UserHome_user" }, + name: { kind: "Name", value: "UserSessionsOverview_user" }, typeCondition: { kind: "NamedType", name: { kind: "Name", value: "User" }, @@ -1777,7 +1781,7 @@ export const UserHome_UserFragmentDoc = { }, }, ], -} as unknown as DocumentNode; +} as unknown as DocumentNode; export const UserEmail_VerifyEmailFragmentDoc = { kind: "Document", definitions: [ @@ -3942,13 +3946,70 @@ export const BrowserSessionQueryDocument = { BrowserSessionQueryQuery, BrowserSessionQueryQueryVariables >; -export const HomeQueryDocument = { +export const OAuth2ClientQueryDocument = { kind: "Document", definitions: [ { kind: "OperationDefinition", operation: "query", - name: { kind: "Name", value: "HomeQuery" }, + name: { kind: "Name", value: "OAuth2ClientQuery" }, + variableDefinitions: [ + { + kind: "VariableDefinition", + variable: { kind: "Variable", name: { kind: "Name", value: "id" } }, + type: { + kind: "NonNullType", + type: { kind: "NamedType", name: { kind: "Name", value: "ID" } }, + }, + }, + ], + selectionSet: { + kind: "SelectionSet", + selections: [ + { + kind: "Field", + name: { kind: "Name", value: "oauth2Client" }, + arguments: [ + { + kind: "Argument", + name: { kind: "Name", value: "id" }, + value: { + kind: "Variable", + name: { kind: "Name", value: "id" }, + }, + }, + ], + selectionSet: { + kind: "SelectionSet", + selections: [ + { kind: "Field", name: { kind: "Name", value: "id" } }, + { kind: "Field", name: { kind: "Name", value: "clientId" } }, + { kind: "Field", name: { kind: "Name", value: "clientName" } }, + { kind: "Field", name: { kind: "Name", value: "clientUri" } }, + { kind: "Field", name: { kind: "Name", value: "tosUri" } }, + { kind: "Field", name: { kind: "Name", value: "policyUri" } }, + { + kind: "Field", + name: { kind: "Name", value: "redirectUris" }, + }, + ], + }, + }, + ], + }, + }, + ], +} as unknown as DocumentNode< + OAuth2ClientQueryQuery, + OAuth2ClientQueryQueryVariables +>; +export const SessionsOverviewQueryDocument = { + kind: "Document", + definitions: [ + { + kind: "OperationDefinition", + operation: "query", + name: { kind: "Name", value: "SessionsOverviewQuery" }, selectionSet: { kind: "SelectionSet", selections: [ @@ -3971,7 +4032,10 @@ export const HomeQueryDocument = { { kind: "Field", name: { kind: "Name", value: "id" } }, { kind: "FragmentSpread", - name: { kind: "Name", value: "UserHome_user" }, + name: { + kind: "Name", + value: "UserSessionsOverview_user", + }, }, ], }, @@ -4000,7 +4064,7 @@ export const HomeQueryDocument = { }, { kind: "FragmentDefinition", - name: { kind: "Name", value: "UserHome_user" }, + name: { kind: "Name", value: "UserSessionsOverview_user" }, typeCondition: { kind: "NamedType", name: { kind: "Name", value: "User" }, @@ -4116,63 +4180,9 @@ export const HomeQueryDocument = { }, }, ], -} as unknown as DocumentNode; -export const OAuth2ClientQueryDocument = { - kind: "Document", - definitions: [ - { - kind: "OperationDefinition", - operation: "query", - name: { kind: "Name", value: "OAuth2ClientQuery" }, - variableDefinitions: [ - { - kind: "VariableDefinition", - variable: { kind: "Variable", name: { kind: "Name", value: "id" } }, - type: { - kind: "NonNullType", - type: { kind: "NamedType", name: { kind: "Name", value: "ID" } }, - }, - }, - ], - selectionSet: { - kind: "SelectionSet", - selections: [ - { - kind: "Field", - name: { kind: "Name", value: "oauth2Client" }, - arguments: [ - { - kind: "Argument", - name: { kind: "Name", value: "id" }, - value: { - kind: "Variable", - name: { kind: "Name", value: "id" }, - }, - }, - ], - selectionSet: { - kind: "SelectionSet", - selections: [ - { kind: "Field", name: { kind: "Name", value: "id" } }, - { kind: "Field", name: { kind: "Name", value: "clientId" } }, - { kind: "Field", name: { kind: "Name", value: "clientName" } }, - { kind: "Field", name: { kind: "Name", value: "clientUri" } }, - { kind: "Field", name: { kind: "Name", value: "tosUri" } }, - { kind: "Field", name: { kind: "Name", value: "policyUri" } }, - { - kind: "Field", - name: { kind: "Name", value: "redirectUris" }, - }, - ], - }, - }, - ], - }, - }, - ], } as unknown as DocumentNode< - OAuth2ClientQueryQuery, - OAuth2ClientQueryQueryVariables + SessionsOverviewQueryQuery, + SessionsOverviewQueryQueryVariables >; export const VerifyEmailQueryDocument = { kind: "Document", diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/SessionsOverview.tsx similarity index 74% rename from frontend/src/pages/Home.tsx rename to frontend/src/pages/SessionsOverview.tsx index 745e7bf52..155848f20 100644 --- a/frontend/src/pages/Home.tsx +++ b/frontend/src/pages/SessionsOverview.tsx @@ -18,28 +18,28 @@ import { atomWithQuery } from "jotai-urql"; import { mapQueryAtom } from "../atoms"; import GraphQLError from "../components/GraphQLError"; import NotLoggedIn from "../components/NotLoggedIn"; -import UserHome from "../components/UserHome"; +import UserSessionsOverview from "../components/UserSessionsOverview"; import { graphql } from "../gql"; import { isErr, unwrapErr, unwrapOk } from "../result"; const QUERY = graphql(/* GraphQL */ ` - query HomeQuery { + query SessionsOverviewQuery { viewer { __typename ... on User { id - ...UserHome_user + ...UserSessionsOverview_user } } } `); -const homeQueryAtom = atomWithQuery({ +const sessionsOverviewQueryAtom = atomWithQuery({ query: QUERY, }); -const homeAtom = mapQueryAtom(homeQueryAtom, (data) => { +const sessionsOverviewAtom = mapQueryAtom(sessionsOverviewQueryAtom, (data) => { if (data.viewer?.__typename === "User") { return data.viewer; } @@ -47,14 +47,14 @@ const homeAtom = mapQueryAtom(homeQueryAtom, (data) => { return null; }); -const Home: React.FC = () => { - const result = useAtomValue(homeAtom); +const SessionsOverview: React.FC = () => { + const result = useAtomValue(sessionsOverviewAtom); if (isErr(result)) return ; const data = unwrapOk(result); if (data === null) return ; - return ; + return ; }; -export default Home; +export default SessionsOverview; diff --git a/frontend/src/test-utils/WithLocation.tsx b/frontend/src/test-utils/WithLocation.tsx index 5f9aa4cae..9cd30eae7 100644 --- a/frontend/src/test-utils/WithLocation.tsx +++ b/frontend/src/test-utils/WithLocation.tsx @@ -37,7 +37,7 @@ const HydrateLocation: React.FC> = ({ * ``` * const component = create( - Active + Active , ); * ```