From 3af6f9b99d97e64461da330eb146c6e1856013c5 Mon Sep 17 00:00:00 2001
From: felipe torres <felipe.torressepulveda@gmail.com>
Date: Mon, 1 Jul 2024 15:50:12 -0700
Subject: [PATCH 1/6] Adding pagination helpers

---
 .vscode/settings.json                        |   3 +
 app/components/Navbar/MainNav.tsx            |   8 +-
 app/components/Navbar/NavbarItem.tsx         |  52 ++--
 app/components/Navbar/index.tsx              | 104 ++++---
 app/components/Navbar/types.d.ts             |   1 +
 app/components/sharedLayouts/index.tsx       |   5 +
 app/routes/_authenticated/graphiql/index.tsx | 274 +++++++++++++++++++
 app/routes/_authenticated/tickets/index.tsx  |   9 +
 app/utils/urls.ts                            |   3 +
 package-lock.json                            |   2 +-
 package.json                                 |   2 +-
 11 files changed, 391 insertions(+), 72 deletions(-)
 create mode 100644 .vscode/settings.json
 create mode 100644 app/components/sharedLayouts/index.tsx
 create mode 100644 app/routes/_authenticated/graphiql/index.tsx
 create mode 100644 app/routes/_authenticated/tickets/index.tsx

diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..25fa621
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}
diff --git a/app/components/Navbar/MainNav.tsx b/app/components/Navbar/MainNav.tsx
index a18e839..87cdb02 100644
--- a/app/components/Navbar/MainNav.tsx
+++ b/app/components/Navbar/MainNav.tsx
@@ -11,9 +11,11 @@ export function MainNav({ items }: NavBarProps) {
 
   return (
     <nav className={"items-center space-x-4 lg:space-x-6"}>
-      {items.map((item) => (
-        <NavbarItem key={`navbarItem-${item.content}`} item={item} />
-      ))}
+      {items
+        .filter((item) => item.show)
+        .map((item) => (
+          <NavbarItem key={`navbarItem-${item.content}`} item={item} />
+        ))}
       {isReady && !user ? (
         <a className={buttonVariants({})} href={urls.login}>
           Ingresar
diff --git a/app/components/Navbar/NavbarItem.tsx b/app/components/Navbar/NavbarItem.tsx
index 22441c9..11d5caf 100644
--- a/app/components/Navbar/NavbarItem.tsx
+++ b/app/components/Navbar/NavbarItem.tsx
@@ -17,36 +17,40 @@ export const NavbarItem = ({ item }: { item: NavbarMenuItem }) => {
           {item.content}
         </DropdownMenuTrigger>
         <DropdownMenuContent align="end">
-          {item.children.map((children) => {
-            if (children.link) {
+          {item.children
+            .filter((child) => child.show)
+            .map((child) => {
+              if (child.link) {
+                return (
+                  <DropdownMenuItem
+                    key={`dropdown-${item.content}`}
+                    className="cursor-pointer"
+                  >
+                    <a href={child.link} className="flex items-center">
+                      {child.icon}
+                      <span>{child.content}</span>
+                    </a>
+                  </DropdownMenuItem>
+                );
+              }
+
+              if (child.content === "separator") {
+                return (
+                  <DropdownMenuSeparator key={`dropdown-${item.content}`} />
+                );
+              }
+
               return (
                 <DropdownMenuItem
                   key={`dropdown-${item.content}`}
-                  className="cursor-pointer"
+                  onClick={child.onClick}
+                  className={cn(child.onClick && "cursor-pointer")}
                 >
-                  <a href={children.link} className="flex items-center">
-                    {children.icon}
-                    <span>{children.content}</span>
-                  </a>
+                  {child.icon}
+                  <span>{child.content}</span>
                 </DropdownMenuItem>
               );
-            }
-
-            if (children.content === "separator") {
-              return <DropdownMenuSeparator key={`dropdown-${item.content}`} />;
-            }
-
-            return (
-              <DropdownMenuItem
-                key={`dropdown-${item.content}`}
-                onClick={children.onClick}
-                className={cn(children.onClick && "cursor-pointer")}
-              >
-                {children.icon}
-                <span>{children.content}</span>
-              </DropdownMenuItem>
-            );
-          })}
+            })}
         </DropdownMenuContent>
       </DropdownMenu>
     );
diff --git a/app/components/Navbar/index.tsx b/app/components/Navbar/index.tsx
index 072876c..ad70719 100644
--- a/app/components/Navbar/index.tsx
+++ b/app/components/Navbar/index.tsx
@@ -1,6 +1,7 @@
 import { LogOut, PackageOpen, Settings, User as UserIcon } from "lucide-react";
+import { useMemo } from "react";
 
-import { useIsLoggedIn } from "~/utils/supabase/AuthProvider";
+import { useIsAuthReady, useIsLoggedIn } from "~/utils/supabase/AuthProvider";
 import { logout } from "~/utils/supabase/client";
 import { urls } from "~/utils/urls";
 
@@ -9,61 +10,78 @@ import { MobileNav } from "./MobileNav";
 import { ThemeSwitcher } from "./ThemeSwitcher";
 import type { NavbarMenuItem } from "./types";
 
-const userItems = [
-  {
-    content: "Eventos",
-    link: urls.eventos.root,
-  },
-  {
-    content: "Comunidades",
-    link: urls.comunidades,
-  },
-  {
-    content: "Perfil",
-    children: [
-      {
-        content: "Mi Cuenta",
-        icon: <UserIcon className="mr-2 size-4" />,
-        link: urls.home,
-      },
-      {
-        content: "separator",
-      },
-      {
-        content: "Settings",
-        icon: <Settings className="mr-2 size-4" />,
-        link: urls.home,
-      },
-      {
-        content: "separator",
-      },
-      {
-        content: "Salir",
-        icon: <LogOut className="mr-2 size-4" />,
-        onClick: () => {
-          logout().catch(console.error);
-        },
-      },
-    ],
-  },
-] satisfies NavbarMenuItem[];
 const guestItems = [
   {
     content: "Eventos",
+    show: true,
     link: urls.eventos.root,
   },
   {
     content: "Comunidades",
+    show: true,
     link: urls.comunidades,
   },
-  {
-    content: "Iniciar sesión",
-    link: urls.login,
-  },
 ] satisfies NavbarMenuItem[];
 
 export const Navbar = () => {
   const isLogged = useIsLoggedIn();
+  const isAuthReady = useIsAuthReady();
+
+  const userItems = useMemo(
+    () =>
+      [
+        {
+          content: "Eventos",
+          show: true,
+          link: urls.eventos.root,
+        },
+        {
+          content: "Comunidades",
+          show: true,
+          link: urls.comunidades,
+        },
+        {
+          content: "Mis Tickets",
+          show: true,
+          link: urls.tickets.root,
+        },
+        {
+          content: "Perfil",
+          show: true,
+          children: [
+            {
+              content: "Mi Cuenta",
+              show: true,
+              icon: <UserIcon className="mr-2 size-4" />,
+              link: urls.home,
+            },
+            {
+              show: true,
+              content: "separator",
+            },
+            {
+              content: "Settings",
+              show: true,
+              icon: <Settings className="mr-2 size-4" />,
+              link: urls.home,
+            },
+            {
+              show: true,
+              content: "separator",
+            },
+            {
+              content: "Salir",
+              show: isAuthReady && isLogged,
+              icon: <LogOut className="mr-2 size-4" />,
+              onClick: () => {
+                logout().catch(console.error);
+              },
+            },
+          ],
+        },
+      ] satisfies NavbarMenuItem[],
+    [isAuthReady, isLogged],
+  );
 
   return (
     <header className="supports-backdrop-blur:bg-background/60 sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur">
diff --git a/app/components/Navbar/types.d.ts b/app/components/Navbar/types.d.ts
index 71c7cea..372e695 100644
--- a/app/components/Navbar/types.d.ts
+++ b/app/components/Navbar/types.d.ts
@@ -1,5 +1,6 @@
 export type NavbarMenuItem = {
   content: string;
+  show: boolean;
   link?: string;
   icon?: React.ReactNode;
   onClick?: (e: React.MouseEvent<HTMLElement>) => void;
diff --git a/app/components/sharedLayouts/index.tsx b/app/components/sharedLayouts/index.tsx
new file mode 100644
index 0000000..68942a8
--- /dev/null
+++ b/app/components/sharedLayouts/index.tsx
@@ -0,0 +1,5 @@
+import { cn } from "~/utils/utils";
+
+export const sharedLayoutStyle = cn(
+  "mx-auto flex w-full max-w-[1360px] px-6 py-12",
+);
diff --git a/app/routes/_authenticated/graphiql/index.tsx b/app/routes/_authenticated/graphiql/index.tsx
new file mode 100644
index 0000000..537008b
--- /dev/null
+++ b/app/routes/_authenticated/graphiql/index.tsx
@@ -0,0 +1,274 @@
+import { createGraphiQLFetcher, Fetcher } from "@graphiql/toolkit";
+import { GraphiQL } from "graphiql";
+import { useEffect, useRef, useState } from "react";
+
+import "graphiql/graphiql.css";
+import { Button } from "~/components/ui/button";
+import {
+  useIsAuthReady,
+  useIsLoggedIn,
+  useTokenRef,
+} from "~/utils/supabase/AuthProvider";
+import { urls } from "~/utils/urls";
+
+const comunidades = `query TodasLasComunidades {
+  communities {
+    description
+    id
+    name
+    status
+  }
+}`;
+
+const comunidadesYEventos = `query ComunidadesYEventos {
+  communities {
+    id
+    name
+    status
+    events {
+      id
+      name
+      address
+      description
+      startDateTime
+      endDateTime
+    }
+  }
+}`;
+
+const comunidadesUsuariosYEventos = `query comunidadesUsuariosYEventos {
+  communities {
+    id
+    name
+    status
+    users {
+      id
+      username
+      lastName
+      name
+      bio
+    }
+    events {
+      id
+      name
+      address
+      description
+      startDateTime
+      endDateTime
+    }
+  }
+}`;
+
+const mutacionCrearComunidad = `# Esta mutación requiere un permiso especial.
+# Manda un mensaje en el discord
+# https://https://discord.jschile.org
+# Para que te asignen el permiso
+mutation CrearComunidad($input: CommunityCreateInput!) {
+  createCommunity(input: $input) {
+    id
+    description
+    name
+    status
+  }
+}`;
+
+const mutacionCrearEvento = `# Esta mutación requiere que seas Admin de una Comunidad.
+# Puedes permirle permisos al Admin de alguna comunidad
+# para que te haga admin
+mutation CrearEvento($input: EventCreateInput!) {
+  createEvent(input: $input) {
+    id
+    description
+    startDateTime
+    endDateTime
+  }
+}`;
+
+const mutacionCrearTicket = `# Esta mutación requiere que seas Admin de una Comunidad.
+# Puedes permirle permisos al Admin de alguna comunidad
+# para que te haga admin
+mutation CrearTicket($input: TicketCreateInput!) {
+  createTicket(input: $input) {
+    id
+    description
+    startDateTime
+    endDateTime
+  }
+}`;
+
+const mutacionDeCreatePurchaseOrder = `mutation claimUserTicket($input: TicketClaimInput!) {
+  claimUserTicket(input: $input) {
+    __typename
+    ... on PurchaseOrder {
+      __typename
+      id
+      currency {
+        id
+      }
+      finalPrice
+      paymentLink
+      status
+      tickets {
+        id
+        approvalStatus
+        status
+        redemptionStatus
+        paymentStatus
+      }
+    }
+    ... on RedeemUserTicketError {
+      __typename
+      error
+      errorMessage
+    }
+  }
+}`;
+
+export default function Pregunta() {
+  // const [isLoaded, setIsLoaded] = useState(false);
+  // const [isLoggedIn, setIsLoggedIn] = useState(false);
+  const fetcherRef = useRef<Fetcher>();
+  const tokenRef = useTokenRef();
+  const isLoggedIn = useIsLoggedIn();
+  const isAuthReady = useIsAuthReady();
+
+  useEffect(() => {
+    if (!tokenRef.current) {
+      return;
+    }
+
+    const fetcher = createGraphiQLFetcher({
+      url: import.meta.env.VITE_JSCL_API_URL!,
+      enableIncrementalDelivery: true,
+      fetch(input, init) {
+        return fetch(input, {
+          ...init,
+          headers: {
+            ...init?.headers,
+            Authorization: `Bearer ${tokenRef.current}`,
+          },
+        });
+      },
+    });
+
+    fetcherRef.current = fetcher;
+  }, [tokenRef]);
+
+  if (!isAuthReady) {
+    <div className="p-4">...Loading</div>;
+  }
+
+  if (!isLoggedIn) {
+    return (
+      <div className="m-auto my-0 p-4">
+        <p>Woah! No estas logueado</p>
+        Para loguearte{" "}
+        <a href={urls.login}>
+          <Button variant="outline">Haz click aquí</Button>
+        </a>
+      </div>
+    );
+  }
+
+  if (!fetcherRef.current) {
+    return (
+      <div className="p-4">
+        No pudimos cargar el fetcher. Prueba refrescando, o reporta este issue
+        en github.
+      </div>
+    );
+  }
+
+  return (
+    <div className="h-[calc(100svh-4rem)]">
+      <GraphiQL
+        fetcher={fetcherRef.current}
+        defaultEditorToolsVisibility="variables"
+        defaultTabs={[
+          {
+            query: comunidades,
+          },
+          {
+            query: comunidadesUsuariosYEventos,
+          },
+          {
+            query: comunidadesYEventos,
+          },
+          {
+            query: mutacionCrearComunidad,
+            variables: JSON.stringify(
+              {
+                input: {
+                  description: "",
+                  name: "",
+                  slug: "",
+                },
+              },
+              null,
+              2,
+            ),
+          },
+          {
+            query: mutacionCrearEvento,
+            variables: JSON.stringify(
+              {
+                input: {
+                  communityId: "",
+                  description: "",
+                  maxAttendees: 0,
+                  name: "",
+                  startDateTime: "",
+                },
+              },
+              null,
+              2,
+            ),
+          },
+          {
+            query: mutacionCrearTicket,
+            variables: JSON.stringify(
+              {
+                input: {
+                  eventId: "f8cc358c-a0e5-4ae3-a6e6-d4bf92102f6a",
+                  isFree: false,
+                  name: "Ticket 1",
+                  prices: [
+                    {
+                      currencyId: "71c3b512-f471-4710-a55c-43b8563825fe",
+                      value: 20,
+                    },
+                  ],
+                  startDateTime: "2030-04-03T12:50:31.857Z",
+                  unlimitedTickets: false,
+                  quantity: 20,
+                },
+              },
+              null,
+              2,
+            ),
+          },
+          {
+            query: mutacionDeCreatePurchaseOrder,
+            variables: JSON.stringify(
+              {
+                input: {
+                  idempotencyUUIDKey: "13a5143e-74b3-4f2a-b1ee-4780ae1086da",
+                  purchaseOrder: [
+                    {
+                      quantity: 2,
+                      ticketId: "f7a0f051-b739-4d44-b4b1-1f14e7cf33bd",
+                    },
+                  ],
+                },
+              },
+              null,
+              2,
+            ),
+          },
+        ]}
+      />
+    </div>
+  );
+}
+
+export const runtime = "edge";
diff --git a/app/routes/_authenticated/tickets/index.tsx b/app/routes/_authenticated/tickets/index.tsx
new file mode 100644
index 0000000..5a1dd5a
--- /dev/null
+++ b/app/routes/_authenticated/tickets/index.tsx
@@ -0,0 +1,9 @@
+import { sharedLayoutStyle } from "~/components/sharedLayouts";
+
+export default function Layout() {
+  return (
+    <div className={sharedLayoutStyle}>
+      <h1>Mis Tickets</h1>
+    </div>
+  );
+}
diff --git a/app/utils/urls.ts b/app/utils/urls.ts
index b0bc86a..7d34980 100644
--- a/app/utils/urls.ts
+++ b/app/utils/urls.ts
@@ -6,5 +6,8 @@ export const urls = {
     tickets: (id: string) => `/eventos/${id}/tickets`,
   },
   comunidades: "/comunidades",
+  tickets: {
+    root: "/tickets",
+  },
   login: "/login",
 };
diff --git a/package-lock.json b/package-lock.json
index 355a966..c700e37 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -77,7 +77,7 @@
         "prettier-plugin-tailwindcss": "^0.4.1",
         "remix-flat-routes": "^0.6.5",
         "tailwindcss": "^3.4.4",
-        "typescript": "^5.1.6",
+        "typescript": "^5.5.2",
         "vite": "^5.1.0",
         "vite-tsconfig-paths": "^4.2.1",
         "wrangler": "3.57.1"
diff --git a/package.json b/package.json
index 33eb6f7..0208ed7 100644
--- a/package.json
+++ b/package.json
@@ -90,7 +90,7 @@
     "prettier-plugin-tailwindcss": "^0.4.1",
     "remix-flat-routes": "^0.6.5",
     "tailwindcss": "^3.4.4",
-    "typescript": "^5.1.6",
+    "typescript": "^5.5.2",
     "vite": "^5.1.0",
     "vite-tsconfig-paths": "^4.2.1",
     "wrangler": "3.57.1"

From 6e230e48eb5218437772772776508631846939ef Mon Sep 17 00:00:00 2001
From: felipe torres <felipe.torressepulveda@gmail.com>
Date: Mon, 1 Jul 2024 20:35:22 -0700
Subject: [PATCH 2/6] update

---
 app/api/ApolloClientForRSC.tsx | 27 --------------------------
 app/api/gql/graphql.ts         | 31 +++++++++++++++++++++++++++---
 app/api/gql/schema.gql         | 35 ++++++++++++++++++++++++++++++++--
 app/utils/urls.ts              |  1 +
 4 files changed, 62 insertions(+), 32 deletions(-)
 delete mode 100644 app/api/ApolloClientForRSC.tsx

diff --git a/app/api/ApolloClientForRSC.tsx b/app/api/ApolloClientForRSC.tsx
deleted file mode 100644
index 5d8d8cf..0000000
--- a/app/api/ApolloClientForRSC.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-// import { ApolloClient, HttpLink, InMemoryCache } from "@apollo/client";
-// import { registerApolloClient } from "@apollo/experimental-nextjs-app-support/rsc";
-// import { cookies } from "next/headers";
-
-// import { COOKIE_NAME } from "@/utils/supabase/client";
-
-// const { getClient } = registerApolloClient(() => {
-//   const cookieValue = cookies().get(COOKIE_NAME)?.value ?? "";
-//   const headers = cookieValue
-//     ? {
-//         headers: {
-//           cookie: `${COOKIE_NAME}=${cookieValue}`,
-//         },
-//       }
-//     : {};
-//   return new ApolloClient({
-//     cache: new InMemoryCache(),
-//     link: new HttpLink({
-//       // this needs to be an absolute url, as relative urls cannot be used in SSR
-//       uri: VITE_JSCL_API_URL,
-//       // fetch,
-//       ...headers,
-//     }),
-//   });
-// });
-
-// export const getApolloClientForRSC = getClient;
diff --git a/app/api/gql/graphql.ts b/app/api/gql/graphql.ts
index ebac85a..b0ce81d 100644
--- a/app/api/gql/graphql.ts
+++ b/app/api/gql/graphql.ts
@@ -375,13 +375,38 @@ export type MutationValidateWorkEmailArgs = {
   confirmationToken: Scalars["String"]["input"];
 };
 
-export type MyTicketsSearchInput = {
+export type MyTicketsSearchValues = {
   approvalStatus: InputMaybe<TicketApprovalStatus>;
   eventId: InputMaybe<Scalars["String"]["input"]>;
   paymentStatus: InputMaybe<TicketPaymentStatus>;
   redemptionStatus: InputMaybe<TicketRedemptionStatus>;
 };
 
+export type PaginatedInputMyTicketsSearchValues = {
+  pagination: PaginationSearchInputParams;
+  search: InputMaybe<MyTicketsSearchValues>;
+};
+
+/** Type used for querying the paginated leaves and it's paginated meta data */
+export type PaginatedUserTicket = {
+  data: Array<UserTicket>;
+  pagination: Pagination;
+};
+
+/** Pagination meta data */
+export type Pagination = {
+  currentPage: Scalars['Int']['output'];
+  pageSize: Scalars['Int']['output'];
+  totalPages: Scalars['Int']['output'];
+  totalRecords: Scalars['Int']['output'];
+};
+
+export type PaginationSearchInputParams = {
+  /** Page number, starts at 0 */
+  page: Scalars['Int']['input'];
+  pageSize: Scalars['Int']['input'];
+};
+
 export type PayForPurchaseOrderInput = {
   currencyID: Scalars["String"]["input"];
   purchaseOrderId: Scalars["String"]["input"];
@@ -449,7 +474,7 @@ export type Query = {
   /** Get the current user */
   me: User;
   /** Get a list of tickets for the current user */
-  myTickets: Array<UserTicket>;
+  myTickets: PaginatedUserTicket;
   /** Get a list of salaries associated to the user */
   salaries: Array<Salary>;
   /** Search a consolidated payment logs, by date, aggregated by platform and currency_id */
@@ -504,7 +529,7 @@ export type QueryEventsArgs = {
 };
 
 export type QueryMyTicketsArgs = {
-  input: InputMaybe<MyTicketsSearchInput>;
+  input: PaginatedInputMyTicketsSearchValues;
 };
 
 export type QuerySearchConsolidatedPaymentLogsArgs = {
diff --git a/app/api/gql/schema.gql b/app/api/gql/schema.gql
index e65d8b1..bf8cfc8 100644
--- a/app/api/gql/schema.gql
+++ b/app/api/gql/schema.gql
@@ -343,13 +343,44 @@ type Mutation {
   validateWorkEmail(confirmationToken: String!): WorkEmail!
 }
 
-input MyTicketsSearchInput {
+input MyTicketsSearchValues {
   approvalStatus: TicketApprovalStatus
   eventId: String
   paymentStatus: TicketPaymentStatus
   redemptionStatus: TicketRedemptionStatus
 }
 
+input PaginatedInputMyTicketsSearchValues {
+  pagination: PaginationSearchInputParams! = { page: 0, pageSize: 20 }
+  search: MyTicketsSearchValues
+}
+
+"""
+Type used for querying the paginated leaves and it's paginated meta data
+"""
+type PaginatedUserTicket {
+  data: [UserTicket!]!
+  pagination: Pagination!
+}
+
+"""
+Pagination meta data
+"""
+type Pagination {
+  currentPage: Int!
+  pageSize: Int!
+  totalPages: Int!
+  totalRecords: Int!
+}
+
+input PaginationSearchInputParams {
+  """
+  Page number, starts at 0
+  """
+  page: Int!
+  pageSize: Int!
+}
+
 input PayForPurchaseOrderInput {
   currencyID: String!
   purchaseOrderId: String!
@@ -452,7 +483,7 @@ type Query {
   """
   Get a list of tickets for the current user
   """
-  myTickets(input: MyTicketsSearchInput): [UserTicket!]!
+  myTickets(input: PaginatedInputMyTicketsSearchValues!): PaginatedUserTicket!
 
   """
   Get a list of salaries associated to the user
diff --git a/app/utils/urls.ts b/app/utils/urls.ts
index 7d34980..f426b93 100644
--- a/app/utils/urls.ts
+++ b/app/utils/urls.ts
@@ -8,6 +8,7 @@ export const urls = {
   comunidades: "/comunidades",
   tickets: {
     root: "/tickets",
+    ticket: (ticketId: string) => `/ticket/:${ticketId}`,
   },
   login: "/login",
 };

From f38dd9b04708c6b077ae84a0bfc915312156837b Mon Sep 17 00:00:00 2001
From: felipe torres <felipe.torressepulveda@gmail.com>
Date: Mon, 1 Jul 2024 23:25:38 -0700
Subject: [PATCH 3/6] Linter plus default page

---
 app/api/ApolloWrapper.tsx                     |  39 ++---
 app/api/gql/gql.ts                            |   8 ++
 app/api/gql/graphql.ts                        | 134 +++++++++++++++++-
 app/api/gql/schema.gql                        |   1 +
 .../graphql/misTickets.generated.tsx          | 121 ++++++++++++++++
 .../MisTickets/graphql/misTickets.gql         |  16 +++
 app/routes/_authenticated/graphiql/index.tsx  |  16 ++-
 app/utils/supabase/client.ts                  |  33 +++++
 components.json                               |   2 +-
 tailwind.config.js                            |  10 +-
 vite-env.d.ts                                 |   4 +-
 11 files changed, 341 insertions(+), 43 deletions(-)
 create mode 100644 app/components/MisTickets/graphql/misTickets.generated.tsx
 create mode 100644 app/components/MisTickets/graphql/misTickets.gql

diff --git a/app/api/ApolloWrapper.tsx b/app/api/ApolloWrapper.tsx
index 9f97ad9..56dc7b1 100644
--- a/app/api/ApolloWrapper.tsx
+++ b/app/api/ApolloWrapper.tsx
@@ -10,8 +10,8 @@ import { setContext } from "@apollo/client/link/context";
 import { onError } from "@apollo/client/link/error";
 import { RetryLink } from "@apollo/client/link/retry";
 
-import { useSetTokenRef, useTokenRef } from "../utils/supabase/AuthProvider";
-import { supabaseClient } from "../utils/supabase/client";
+import { useTokenRef } from "../utils/supabase/AuthProvider";
+import { useRefreshToken } from "../utils/supabase/client";
 
 const retryLink = new RetryLink();
 
@@ -62,38 +62,21 @@ const useAuthLink = () => {
 // Este link se encarga de manejar errores de autenticación
 // Si el servidor responde con un code UNAUTHENTICATED, intenta refrescar el token.
 const useErrorLink = () => {
-  const setToken = useSetTokenRef();
+  const refreshToken = useRefreshToken();
 
   return onError(({ graphQLErrors, networkError, operation, forward }) => {
     if (graphQLErrors) {
       for (const err of graphQLErrors) {
-        if (err.extensions.code === "UNAUTHENTICATED") {
-          supabaseClient.auth
-            .getSession()
-            .then(({ data, error }) => {
-              if (error) {
-                // eslint-disable-next-line no-console
-                console.error("Error refreshing access token", error);
-
-                return;
-              }
-
-              const newToken = data.session?.access_token;
-
-              if (!newToken) {
-                // eslint-disable-next-line no-console
-                console.error("No access token found in session data");
-              } else {
-                setToken(newToken);
-              }
-
+        if (err.extensions.type === "UNAUTHENTICATED") {
+          refreshToken(
+            () => {
               forward(operation);
-            })
-            .catch((error: unknown) => {
+            },
+            () => {
               // eslint-disable-next-line no-console
-              console.error("Error refreshing access token", error);
-            });
-          // }
+              console.error("Error refreshing access token");
+            },
+          );
         }
       }
     } else if (networkError) {
diff --git a/app/api/gql/gql.ts b/app/api/gql/gql.ts
index 264fbad..c3959c7 100644
--- a/app/api/gql/gql.ts
+++ b/app/api/gql/gql.ts
@@ -15,6 +15,8 @@ import type { TypedDocumentNode as DocumentNode } from "@graphql-typed-document-
 const documents = {
   "query FetchExampleEvents {\n  events {\n    id\n    description\n    community {\n      id\n      name\n    }\n    tags {\n      id\n      name\n      description\n    }\n  }\n}":
     types.FetchExampleEventsDocument,
+  "query misTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}":
+    types.MisTicketsDocument,
   "mutation createPurchaseOrder($input: TicketClaimInput!) {\n  claimUserTicket(input: $input) {\n    __typename\n    ... on PurchaseOrder {\n      __typename\n      id\n      currency {\n        id\n      }\n      finalPrice\n      paymentLink\n      status\n      tickets {\n        id\n        approvalStatus\n        redemptionStatus\n        paymentStatus\n      }\n    }\n    ... on RedeemUserTicketError {\n      __typename\n      error\n      errorMessage\n    }\n  }\n}":
     types.CreatePurchaseOrderDocument,
   "fragment EventTicketFragment on Ticket {\n  id\n  name\n  description\n  quantity\n  isFree\n  startDateTime\n  status\n  isUnlimited\n  prices {\n    id\n    amount\n    currency {\n      currency\n      id\n    }\n  }\n}":
@@ -43,6 +45,12 @@ export function graphql(source: string): unknown;
 export function graphql(
   source: "query FetchExampleEvents {\n  events {\n    id\n    description\n    community {\n      id\n      name\n    }\n    tags {\n      id\n      name\n      description\n    }\n  }\n}",
 ): (typeof documents)["query FetchExampleEvents {\n  events {\n    id\n    description\n    community {\n      id\n      name\n    }\n    tags {\n      id\n      name\n      description\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: "query misTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}",
+): (typeof documents)["query misTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\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/app/api/gql/graphql.ts b/app/api/gql/graphql.ts
index b0ce81d..8775170 100644
--- a/app/api/gql/graphql.ts
+++ b/app/api/gql/graphql.ts
@@ -395,16 +395,16 @@ export type PaginatedUserTicket = {
 
 /** Pagination meta data */
 export type Pagination = {
-  currentPage: Scalars['Int']['output'];
-  pageSize: Scalars['Int']['output'];
-  totalPages: Scalars['Int']['output'];
-  totalRecords: Scalars['Int']['output'];
+  currentPage: Scalars["Int"]["output"];
+  pageSize: Scalars["Int"]["output"];
+  totalPages: Scalars["Int"]["output"];
+  totalRecords: Scalars["Int"]["output"];
 };
 
 export type PaginationSearchInputParams = {
   /** Page number, starts at 0 */
-  page: Scalars['Int']['input'];
-  pageSize: Scalars['Int']['input'];
+  page: Scalars["Int"]["input"];
+  pageSize: Scalars["Int"]["input"];
 };
 
 export type PayForPurchaseOrderInput = {
@@ -774,6 +774,7 @@ export type UserTicket = {
   id: Scalars["ID"]["output"];
   paymentStatus: TicketPaymentStatus;
   redemptionStatus: TicketRedemptionStatus;
+  ticketTemplate: Ticket;
 };
 
 export enum ValidPaymentMethods {
@@ -855,6 +856,27 @@ export type FetchExampleEventsQuery = {
   }>;
 };
 
+export type MisTicketsQueryVariables = Exact<{
+  input: PaginatedInputMyTicketsSearchValues;
+}>;
+
+export type MisTicketsQuery = {
+  myTickets: {
+    data: Array<{
+      approvalStatus: TicketApprovalStatus;
+      id: string;
+      paymentStatus: TicketPaymentStatus;
+      redemptionStatus: TicketRedemptionStatus;
+    }>;
+    pagination: {
+      currentPage: number;
+      pageSize: number;
+      totalPages: number;
+      totalRecords: number;
+    };
+  };
+};
+
 export type CreatePurchaseOrderMutationVariables = Exact<{
   input: TicketClaimInput;
 }>;
@@ -1028,6 +1050,106 @@ export const FetchExampleEventsDocument = {
   FetchExampleEventsQuery,
   FetchExampleEventsQueryVariables
 >;
+export const MisTicketsDocument = {
+  kind: "Document",
+  definitions: [
+    {
+      kind: "OperationDefinition",
+      operation: "query",
+      name: { kind: "Name", value: "misTickets" },
+      variableDefinitions: [
+        {
+          kind: "VariableDefinition",
+          variable: {
+            kind: "Variable",
+            name: { kind: "Name", value: "input" },
+          },
+          type: {
+            kind: "NonNullType",
+            type: {
+              kind: "NamedType",
+              name: {
+                kind: "Name",
+                value: "PaginatedInputMyTicketsSearchValues",
+              },
+            },
+          },
+        },
+      ],
+      selectionSet: {
+        kind: "SelectionSet",
+        selections: [
+          {
+            kind: "Field",
+            name: { kind: "Name", value: "myTickets" },
+            arguments: [
+              {
+                kind: "Argument",
+                name: { kind: "Name", value: "input" },
+                value: {
+                  kind: "Variable",
+                  name: { kind: "Name", value: "input" },
+                },
+              },
+            ],
+            selectionSet: {
+              kind: "SelectionSet",
+              selections: [
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "data" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "approvalStatus" },
+                      },
+                      { kind: "Field", name: { kind: "Name", value: "id" } },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "paymentStatus" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "redemptionStatus" },
+                      },
+                    ],
+                  },
+                },
+                {
+                  kind: "Field",
+                  name: { kind: "Name", value: "pagination" },
+                  selectionSet: {
+                    kind: "SelectionSet",
+                    selections: [
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "currentPage" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "pageSize" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "totalPages" },
+                      },
+                      {
+                        kind: "Field",
+                        name: { kind: "Name", value: "totalRecords" },
+                      },
+                    ],
+                  },
+                },
+              ],
+            },
+          },
+        ],
+      },
+    },
+  ],
+} as unknown as DocumentNode<MisTicketsQuery, MisTicketsQueryVariables>;
 export const CreatePurchaseOrderDocument = {
   kind: "Document",
   definitions: [
diff --git a/app/api/gql/schema.gql b/app/api/gql/schema.gql
index bf8cfc8..256d8d8 100644
--- a/app/api/gql/schema.gql
+++ b/app/api/gql/schema.gql
@@ -788,6 +788,7 @@ type UserTicket {
   id: ID!
   paymentStatus: TicketPaymentStatus!
   redemptionStatus: TicketRedemptionStatus!
+  ticketTemplate: Ticket!
 }
 
 enum ValidPaymentMethods {
diff --git a/app/components/MisTickets/graphql/misTickets.generated.tsx b/app/components/MisTickets/graphql/misTickets.generated.tsx
new file mode 100644
index 0000000..2a84a8a
--- /dev/null
+++ b/app/components/MisTickets/graphql/misTickets.generated.tsx
@@ -0,0 +1,121 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+// @ts-nocheck
+/* eslint-disable */
+/* prettier-ignore */
+/* This file is automatically generated. Please do not modify it manually. */
+import * as Types from '../../../api/gql/graphql';
+
+import { gql } from "graphql-tag";
+import * as Apollo from "@apollo/client";
+const defaultOptions = {} as const;
+export type MisTicketsQueryVariables = Types.Exact<{
+  input: Types.PaginatedInputMyTicketsSearchValues;
+}>;
+
+export type MisTicketsQuery = {
+  __typename?: "Query";
+  myTickets: {
+    __typename?: "PaginatedUserTicket";
+    data: Array<{
+      __typename?: "UserTicket";
+      approvalStatus: Types.TicketApprovalStatus;
+      id: string;
+      paymentStatus: Types.TicketPaymentStatus;
+      redemptionStatus: Types.TicketRedemptionStatus;
+    }>;
+    pagination: {
+      __typename?: "Pagination";
+      currentPage: number;
+      pageSize: number;
+      totalPages: number;
+      totalRecords: number;
+    };
+  };
+};
+
+export const MisTicketsDocument = gql`
+  query misTickets($input: PaginatedInputMyTicketsSearchValues!) {
+    myTickets(input: $input) {
+      data {
+        approvalStatus
+        id
+        paymentStatus
+        redemptionStatus
+      }
+      pagination {
+        currentPage
+        pageSize
+        totalPages
+        totalRecords
+      }
+    }
+  }
+`;
+
+/**
+ * __useMisTicketsQuery__
+ *
+ * To run a query within a React component, call `useMisTicketsQuery` and pass it any options that fit your needs.
+ * When your component renders, `useMisTicketsQuery` returns an object from Apollo Client that contains loading, error, and data properties
+ * you can use to render your UI.
+ *
+ * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
+ *
+ * @example
+ * const { data, loading, error } = useMisTicketsQuery({
+ *   variables: {
+ *      input: // value for 'input'
+ *   },
+ * });
+ */
+export function useMisTicketsQuery(
+  baseOptions: Apollo.QueryHookOptions<
+    MisTicketsQuery,
+    MisTicketsQueryVariables
+  > &
+    (
+      | { variables: MisTicketsQueryVariables; skip?: boolean }
+      | { skip: boolean }
+    ),
+) {
+  const options = { ...defaultOptions, ...baseOptions };
+  return Apollo.useQuery<MisTicketsQuery, MisTicketsQueryVariables>(
+    MisTicketsDocument,
+    options,
+  );
+}
+export function useMisTicketsLazyQuery(
+  baseOptions?: Apollo.LazyQueryHookOptions<
+    MisTicketsQuery,
+    MisTicketsQueryVariables
+  >,
+) {
+  const options = { ...defaultOptions, ...baseOptions };
+  return Apollo.useLazyQuery<MisTicketsQuery, MisTicketsQueryVariables>(
+    MisTicketsDocument,
+    options,
+  );
+}
+export function useMisTicketsSuspenseQuery(
+  baseOptions?: Apollo.SuspenseQueryHookOptions<
+    MisTicketsQuery,
+    MisTicketsQueryVariables
+  >,
+) {
+  const options = { ...defaultOptions, ...baseOptions };
+  return Apollo.useSuspenseQuery<MisTicketsQuery, MisTicketsQueryVariables>(
+    MisTicketsDocument,
+    options,
+  );
+}
+export type MisTicketsQueryHookResult = ReturnType<typeof useMisTicketsQuery>;
+export type MisTicketsLazyQueryHookResult = ReturnType<
+  typeof useMisTicketsLazyQuery
+>;
+export type MisTicketsSuspenseQueryHookResult = ReturnType<
+  typeof useMisTicketsSuspenseQuery
+>;
+export type MisTicketsQueryResult = Apollo.QueryResult<
+  MisTicketsQuery,
+  MisTicketsQueryVariables
+>;
diff --git a/app/components/MisTickets/graphql/misTickets.gql b/app/components/MisTickets/graphql/misTickets.gql
new file mode 100644
index 0000000..d208e42
--- /dev/null
+++ b/app/components/MisTickets/graphql/misTickets.gql
@@ -0,0 +1,16 @@
+query misTickets($input: PaginatedInputMyTicketsSearchValues!) {
+  myTickets(input: $input) {
+    data {
+      approvalStatus
+      id
+      paymentStatus
+      redemptionStatus
+    }
+    pagination {
+      currentPage
+      pageSize
+      totalPages
+      totalRecords
+    }
+  }
+}
diff --git a/app/routes/_authenticated/graphiql/index.tsx b/app/routes/_authenticated/graphiql/index.tsx
index 537008b..65378be 100644
--- a/app/routes/_authenticated/graphiql/index.tsx
+++ b/app/routes/_authenticated/graphiql/index.tsx
@@ -1,6 +1,6 @@
 import { createGraphiQLFetcher, Fetcher } from "@graphiql/toolkit";
 import { GraphiQL } from "graphiql";
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useRef } from "react";
 
 import "graphiql/graphiql.css";
 import { Button } from "~/components/ui/button";
@@ -9,6 +9,7 @@ import {
   useIsLoggedIn,
   useTokenRef,
 } from "~/utils/supabase/AuthProvider";
+import { useRefreshToken } from "~/utils/supabase/client";
 import { urls } from "~/utils/urls";
 
 const comunidades = `query TodasLasComunidades {
@@ -131,6 +132,7 @@ export default function Pregunta() {
   const tokenRef = useTokenRef();
   const isLoggedIn = useIsLoggedIn();
   const isAuthReady = useIsAuthReady();
+  const refreshToken = useRefreshToken();
 
   useEffect(() => {
     if (!tokenRef.current) {
@@ -147,6 +149,18 @@ export default function Pregunta() {
             ...init?.headers,
             Authorization: `Bearer ${tokenRef.current}`,
           },
+        }).then(async (res) => {
+          const cloned = res.clone();
+          const jsonResponse = await res.json();
+
+          if (
+            (jsonResponse as { errors: { extensions: { type: string } }[] })
+              ?.errors?.[0]?.extensions?.type === "UNAUTHENTICATED"
+          ) {
+            refreshToken();
+          }
+
+          return cloned;
         });
       },
     });
diff --git a/app/utils/supabase/client.ts b/app/utils/supabase/client.ts
index 5dd3d2a..721af4e 100644
--- a/app/utils/supabase/client.ts
+++ b/app/utils/supabase/client.ts
@@ -3,6 +3,8 @@ import { createClient } from "@supabase/supabase-js";
 import cookies from "js-cookie";
 import { CookieAttributes } from "node_modules/@types/js-cookie";
 
+import { useSetTokenRef } from "~/utils/supabase/AuthProvider";
+
 export const COOKIE_NAME = "community-os-access-token";
 
 if (!import.meta.env.VITE_SUPABASE_URL) {
@@ -18,6 +20,37 @@ export const supabaseClient = createClient(
   import.meta.env.VITE_SUPABASE_ANON_KEY,
 );
 
+export const useRefreshToken = () => {
+  const setToken = useSetTokenRef();
+
+  return (onSuccess?: () => void, onError?: (error: unknown) => void) => {
+    supabaseClient.auth
+      .refreshSession()
+      .then(({ data, error }) => {
+        if (error) {
+          // eslint-disable-next-line no-console
+          console.error("Error refreshing access token", error);
+
+          return;
+        }
+
+        const newToken = data.session?.access_token;
+
+        if (!newToken) {
+          // eslint-disable-next-line no-console
+          console.error("No access token found in session data");
+        } else {
+          setToken(newToken);
+        }
+
+        onSuccess?.();
+      })
+      .catch((error: unknown) => {
+        onError?.(error);
+      });
+  };
+};
+
 const oneHour = 1000 * 60 * 60;
 const oneYear = oneHour * 24 * 365;
 
diff --git a/components.json b/components.json
index eca6990..27135ec 100644
--- a/components.json
+++ b/components.json
@@ -14,4 +14,4 @@
     "components": "~/components",
     "utils": "~/lib/utils"
   }
-}
\ No newline at end of file
+}
diff --git a/tailwind.config.js b/tailwind.config.js
index 7cb7e37..0730ff9 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -2,10 +2,10 @@
 module.exports = {
   darkMode: ["class"],
   content: [
-    './pages/**/*.{ts,tsx}',
-    './components/**/*.{ts,tsx}',
-    './app/**/*.{ts,tsx}',
-    './src/**/*.{ts,tsx}',
+    "./pages/**/*.{ts,tsx}",
+    "./components/**/*.{ts,tsx}",
+    "./app/**/*.{ts,tsx}",
+    "./src/**/*.{ts,tsx}",
   ],
   prefix: "",
   theme: {
@@ -74,4 +74,4 @@ module.exports = {
     },
   },
   plugins: [require("tailwindcss-animate")],
-}
\ No newline at end of file
+};
diff --git a/vite-env.d.ts b/vite-env.d.ts
index 96a911a..dead977 100644
--- a/vite-env.d.ts
+++ b/vite-env.d.ts
@@ -9,5 +9,5 @@ interface ImportMetaEnv {
 }
 
 interface ImportMeta {
-  readonly env: ImportMetaEnv
-}
\ No newline at end of file
+  readonly env: ImportMetaEnv;
+}

From 9478adb3430c34687057a5416983a1836cf6f621 Mon Sep 17 00:00:00 2001
From: felipe torres <felipe.torressepulveda@gmail.com>
Date: Tue, 2 Jul 2024 15:39:23 -0700
Subject: [PATCH 4/6] name change and prettier

---
 app/api/gql/gql.ts                            |  8 +--
 app/api/gql/graphql.ts                        | 10 +--
 .../graphql/myTickets.generated.tsx}          | 64 +++++++++----------
 .../graphql/myTickets.gql}                    |  2 +-
 4 files changed, 42 insertions(+), 42 deletions(-)
 rename app/components/{MisTickets/graphql/misTickets.generated.tsx => MyTickets/graphql/myTickets.generated.tsx} (55%)
 rename app/components/{MisTickets/graphql/misTickets.gql => MyTickets/graphql/myTickets.gql} (76%)

diff --git a/app/api/gql/gql.ts b/app/api/gql/gql.ts
index c3959c7..eb4693d 100644
--- a/app/api/gql/gql.ts
+++ b/app/api/gql/gql.ts
@@ -15,8 +15,8 @@ import type { TypedDocumentNode as DocumentNode } from "@graphql-typed-document-
 const documents = {
   "query FetchExampleEvents {\n  events {\n    id\n    description\n    community {\n      id\n      name\n    }\n    tags {\n      id\n      name\n      description\n    }\n  }\n}":
     types.FetchExampleEventsDocument,
-  "query misTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}":
-    types.MisTicketsDocument,
+  "query myTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}":
+    types.MyTicketsDocument,
   "mutation createPurchaseOrder($input: TicketClaimInput!) {\n  claimUserTicket(input: $input) {\n    __typename\n    ... on PurchaseOrder {\n      __typename\n      id\n      currency {\n        id\n      }\n      finalPrice\n      paymentLink\n      status\n      tickets {\n        id\n        approvalStatus\n        redemptionStatus\n        paymentStatus\n      }\n    }\n    ... on RedeemUserTicketError {\n      __typename\n      error\n      errorMessage\n    }\n  }\n}":
     types.CreatePurchaseOrderDocument,
   "fragment EventTicketFragment on Ticket {\n  id\n  name\n  description\n  quantity\n  isFree\n  startDateTime\n  status\n  isUnlimited\n  prices {\n    id\n    amount\n    currency {\n      currency\n      id\n    }\n  }\n}":
@@ -49,8 +49,8 @@ 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: "query misTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}",
-): (typeof documents)["query misTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}"];
+  source: "query myTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\n    }\n  }\n}",
+): (typeof documents)["query myTickets($input: PaginatedInputMyTicketsSearchValues!) {\n  myTickets(input: $input) {\n    data {\n      approvalStatus\n      id\n      paymentStatus\n      redemptionStatus\n    }\n    pagination {\n      currentPage\n      pageSize\n      totalPages\n      totalRecords\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/app/api/gql/graphql.ts b/app/api/gql/graphql.ts
index 8775170..e9fbae5 100644
--- a/app/api/gql/graphql.ts
+++ b/app/api/gql/graphql.ts
@@ -856,11 +856,11 @@ export type FetchExampleEventsQuery = {
   }>;
 };
 
-export type MisTicketsQueryVariables = Exact<{
+export type MyTicketsQueryVariables = Exact<{
   input: PaginatedInputMyTicketsSearchValues;
 }>;
 
-export type MisTicketsQuery = {
+export type MyTicketsQuery = {
   myTickets: {
     data: Array<{
       approvalStatus: TicketApprovalStatus;
@@ -1050,13 +1050,13 @@ export const FetchExampleEventsDocument = {
   FetchExampleEventsQuery,
   FetchExampleEventsQueryVariables
 >;
-export const MisTicketsDocument = {
+export const MyTicketsDocument = {
   kind: "Document",
   definitions: [
     {
       kind: "OperationDefinition",
       operation: "query",
-      name: { kind: "Name", value: "misTickets" },
+      name: { kind: "Name", value: "myTickets" },
       variableDefinitions: [
         {
           kind: "VariableDefinition",
@@ -1149,7 +1149,7 @@ export const MisTicketsDocument = {
       },
     },
   ],
-} as unknown as DocumentNode<MisTicketsQuery, MisTicketsQueryVariables>;
+} as unknown as DocumentNode<MyTicketsQuery, MyTicketsQueryVariables>;
 export const CreatePurchaseOrderDocument = {
   kind: "Document",
   definitions: [
diff --git a/app/components/MisTickets/graphql/misTickets.generated.tsx b/app/components/MyTickets/graphql/myTickets.generated.tsx
similarity index 55%
rename from app/components/MisTickets/graphql/misTickets.generated.tsx
rename to app/components/MyTickets/graphql/myTickets.generated.tsx
index 2a84a8a..8db11bf 100644
--- a/app/components/MisTickets/graphql/misTickets.generated.tsx
+++ b/app/components/MyTickets/graphql/myTickets.generated.tsx
@@ -8,11 +8,11 @@ import * as Types from '../../../api/gql/graphql';
 import { gql } from "graphql-tag";
 import * as Apollo from "@apollo/client";
 const defaultOptions = {} as const;
-export type MisTicketsQueryVariables = Types.Exact<{
+export type MyTicketsQueryVariables = Types.Exact<{
   input: Types.PaginatedInputMyTicketsSearchValues;
 }>;
 
-export type MisTicketsQuery = {
+export type MyTicketsQuery = {
   __typename?: "Query";
   myTickets: {
     __typename?: "PaginatedUserTicket";
@@ -33,8 +33,8 @@ export type MisTicketsQuery = {
   };
 };
 
-export const MisTicketsDocument = gql`
-  query misTickets($input: PaginatedInputMyTicketsSearchValues!) {
+export const MyTicketsDocument = gql`
+  query myTickets($input: PaginatedInputMyTicketsSearchValues!) {
     myTickets(input: $input) {
       data {
         approvalStatus
@@ -53,69 +53,69 @@ export const MisTicketsDocument = gql`
 `;
 
 /**
- * __useMisTicketsQuery__
+ * __useMyTicketsQuery__
  *
- * To run a query within a React component, call `useMisTicketsQuery` and pass it any options that fit your needs.
- * When your component renders, `useMisTicketsQuery` returns an object from Apollo Client that contains loading, error, and data properties
+ * To run a query within a React component, call `useMyTicketsQuery` and pass it any options that fit your needs.
+ * When your component renders, `useMyTicketsQuery` returns an object from Apollo Client that contains loading, error, and data properties
  * you can use to render your UI.
  *
  * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
  *
  * @example
- * const { data, loading, error } = useMisTicketsQuery({
+ * const { data, loading, error } = useMyTicketsQuery({
  *   variables: {
  *      input: // value for 'input'
  *   },
  * });
  */
-export function useMisTicketsQuery(
+export function useMyTicketsQuery(
   baseOptions: Apollo.QueryHookOptions<
-    MisTicketsQuery,
-    MisTicketsQueryVariables
+    MyTicketsQuery,
+    MyTicketsQueryVariables
   > &
     (
-      | { variables: MisTicketsQueryVariables; skip?: boolean }
+      | { variables: MyTicketsQueryVariables; skip?: boolean }
       | { skip: boolean }
     ),
 ) {
   const options = { ...defaultOptions, ...baseOptions };
-  return Apollo.useQuery<MisTicketsQuery, MisTicketsQueryVariables>(
-    MisTicketsDocument,
+  return Apollo.useQuery<MyTicketsQuery, MyTicketsQueryVariables>(
+    MyTicketsDocument,
     options,
   );
 }
-export function useMisTicketsLazyQuery(
+export function useMyTicketsLazyQuery(
   baseOptions?: Apollo.LazyQueryHookOptions<
-    MisTicketsQuery,
-    MisTicketsQueryVariables
+    MyTicketsQuery,
+    MyTicketsQueryVariables
   >,
 ) {
   const options = { ...defaultOptions, ...baseOptions };
-  return Apollo.useLazyQuery<MisTicketsQuery, MisTicketsQueryVariables>(
-    MisTicketsDocument,
+  return Apollo.useLazyQuery<MyTicketsQuery, MyTicketsQueryVariables>(
+    MyTicketsDocument,
     options,
   );
 }
-export function useMisTicketsSuspenseQuery(
+export function useMyTicketsSuspenseQuery(
   baseOptions?: Apollo.SuspenseQueryHookOptions<
-    MisTicketsQuery,
-    MisTicketsQueryVariables
+    MyTicketsQuery,
+    MyTicketsQueryVariables
   >,
 ) {
   const options = { ...defaultOptions, ...baseOptions };
-  return Apollo.useSuspenseQuery<MisTicketsQuery, MisTicketsQueryVariables>(
-    MisTicketsDocument,
+  return Apollo.useSuspenseQuery<MyTicketsQuery, MyTicketsQueryVariables>(
+    MyTicketsDocument,
     options,
   );
 }
-export type MisTicketsQueryHookResult = ReturnType<typeof useMisTicketsQuery>;
-export type MisTicketsLazyQueryHookResult = ReturnType<
-  typeof useMisTicketsLazyQuery
+export type MyTicketsQueryHookResult = ReturnType<typeof useMyTicketsQuery>;
+export type MyTicketsLazyQueryHookResult = ReturnType<
+  typeof useMyTicketsLazyQuery
 >;
-export type MisTicketsSuspenseQueryHookResult = ReturnType<
-  typeof useMisTicketsSuspenseQuery
+export type MyTicketsSuspenseQueryHookResult = ReturnType<
+  typeof useMyTicketsSuspenseQuery
 >;
-export type MisTicketsQueryResult = Apollo.QueryResult<
-  MisTicketsQuery,
-  MisTicketsQueryVariables
+export type MyTicketsQueryResult = Apollo.QueryResult<
+  MyTicketsQuery,
+  MyTicketsQueryVariables
 >;
diff --git a/app/components/MisTickets/graphql/misTickets.gql b/app/components/MyTickets/graphql/myTickets.gql
similarity index 76%
rename from app/components/MisTickets/graphql/misTickets.gql
rename to app/components/MyTickets/graphql/myTickets.gql
index d208e42..f7b178c 100644
--- a/app/components/MisTickets/graphql/misTickets.gql
+++ b/app/components/MyTickets/graphql/myTickets.gql
@@ -1,4 +1,4 @@
-query misTickets($input: PaginatedInputMyTicketsSearchValues!) {
+query myTickets($input: PaginatedInputMyTicketsSearchValues!) {
   myTickets(input: $input) {
     data {
       approvalStatus

From b0fcb84a1f88e7e029e5033084dded1f5626a8b4 Mon Sep 17 00:00:00 2001
From: felipe torres <felipe.torressepulveda@gmail.com>
Date: Tue, 2 Jul 2024 17:24:31 -0700
Subject: [PATCH 5/6] Adding event to ticket

---
 app/api/gql/graphql.ts                        | 201 +++++++++---------
 app/api/gql/schema.gql                        |   1 +
 app/components/MyTickets/MyTickets.tsx        |  11 +
 app/components/MyTickets/MyTicketsList.tsx    |  28 +++
 .../MyTickets/graphql/myTickets.gql           |  14 ++
 app/routes/_authenticated/tickets/index.tsx   |   6 +-
 codegen.ts                                    |   7 +-
 7 files changed, 166 insertions(+), 102 deletions(-)
 create mode 100644 app/components/MyTickets/MyTickets.tsx
 create mode 100644 app/components/MyTickets/MyTicketsList.tsx

diff --git a/app/api/gql/graphql.ts b/app/api/gql/graphql.ts
index e9fbae5..70162ab 100644
--- a/app/api/gql/graphql.ts
+++ b/app/api/gql/graphql.ts
@@ -100,13 +100,13 @@ export type CreateCommunityInput = {
 };
 
 export type CreateCompanyInput = {
-  description: InputMaybe<Scalars["String"]["input"]>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
   /** The email domain of the company (What we'll use to match the company to the user on account-creation) */
   domain: Scalars["String"]["input"];
-  logo: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  status: InputMaybe<CompanyStatus>;
-  website: InputMaybe<Scalars["String"]["input"]>;
+  logo?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  status?: InputMaybe<CompanyStatus>;
+  website?: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type CreateSalaryInput = {
@@ -161,39 +161,39 @@ export type Event = {
 
 /** Representation of an Event (Events and Users, is what tickets are linked to) */
 export type EventUsersTicketsArgs = {
-  input: InputMaybe<EventsTicketsSearchInput>;
+  input?: InputMaybe<EventsTicketsSearchInput>;
 };
 
 export type EventCreateInput = {
-  address: InputMaybe<Scalars["String"]["input"]>;
+  address?: InputMaybe<Scalars["String"]["input"]>;
   communityId: Scalars["String"]["input"];
   description: Scalars["String"]["input"];
-  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
-  latitude: InputMaybe<Scalars["String"]["input"]>;
-  longitude: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
+  latitude?: InputMaybe<Scalars["String"]["input"]>;
+  longitude?: InputMaybe<Scalars["String"]["input"]>;
   maxAttendees: Scalars["Int"]["input"];
-  meetingURL: InputMaybe<Scalars["String"]["input"]>;
+  meetingURL?: InputMaybe<Scalars["String"]["input"]>;
   name: Scalars["String"]["input"];
   startDateTime: Scalars["DateTime"]["input"];
-  status: InputMaybe<EventStatus>;
-  timeZone: InputMaybe<Scalars["String"]["input"]>;
-  visibility: InputMaybe<EventVisibility>;
+  status?: InputMaybe<EventStatus>;
+  timeZone?: InputMaybe<Scalars["String"]["input"]>;
+  visibility?: InputMaybe<EventVisibility>;
 };
 
 export type EventEditInput = {
-  address: InputMaybe<Scalars["String"]["input"]>;
-  description: InputMaybe<Scalars["String"]["input"]>;
-  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
+  address?: InputMaybe<Scalars["String"]["input"]>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
   eventId: Scalars["String"]["input"];
-  latitude: InputMaybe<Scalars["String"]["input"]>;
-  longitude: InputMaybe<Scalars["String"]["input"]>;
-  maxAttendees: InputMaybe<Scalars["Int"]["input"]>;
-  meetingURL: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  startDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
-  status: InputMaybe<EventStatus>;
-  timeZone: InputMaybe<Scalars["String"]["input"]>;
-  visibility: InputMaybe<EventVisibility>;
+  latitude?: InputMaybe<Scalars["String"]["input"]>;
+  longitude?: InputMaybe<Scalars["String"]["input"]>;
+  maxAttendees?: InputMaybe<Scalars["Int"]["input"]>;
+  meetingURL?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  startDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
+  status?: InputMaybe<EventStatus>;
+  timeZone?: InputMaybe<Scalars["String"]["input"]>;
+  visibility?: InputMaybe<EventVisibility>;
 };
 
 /** Search for tags */
@@ -213,19 +213,19 @@ export enum EventVisibility {
 }
 
 export type EventsSearchInput = {
-  id: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  startDateTimeFrom: InputMaybe<Scalars["DateTime"]["input"]>;
-  startDateTimeTo: InputMaybe<Scalars["DateTime"]["input"]>;
-  status: InputMaybe<EventStatus>;
-  visibility: InputMaybe<EventVisibility>;
+  id?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  startDateTimeFrom?: InputMaybe<Scalars["DateTime"]["input"]>;
+  startDateTimeTo?: InputMaybe<Scalars["DateTime"]["input"]>;
+  status?: InputMaybe<EventStatus>;
+  visibility?: InputMaybe<EventVisibility>;
 };
 
 export type EventsTicketsSearchInput = {
-  approvalStatus: InputMaybe<TicketApprovalStatus>;
-  id: InputMaybe<Scalars["String"]["input"]>;
-  paymentStatus: InputMaybe<TicketPaymentStatus>;
-  redemptionStatus: InputMaybe<TicketRedemptionStatus>;
+  approvalStatus?: InputMaybe<TicketApprovalStatus>;
+  id?: InputMaybe<Scalars["String"]["input"]>;
+  paymentStatus?: InputMaybe<TicketPaymentStatus>;
+  redemptionStatus?: InputMaybe<TicketRedemptionStatus>;
 };
 
 export enum Gender {
@@ -376,15 +376,15 @@ export type MutationValidateWorkEmailArgs = {
 };
 
 export type MyTicketsSearchValues = {
-  approvalStatus: InputMaybe<TicketApprovalStatus>;
-  eventId: InputMaybe<Scalars["String"]["input"]>;
-  paymentStatus: InputMaybe<TicketPaymentStatus>;
-  redemptionStatus: InputMaybe<TicketRedemptionStatus>;
+  approvalStatus?: InputMaybe<TicketApprovalStatus>;
+  eventId?: InputMaybe<Scalars["String"]["input"]>;
+  paymentStatus?: InputMaybe<TicketPaymentStatus>;
+  redemptionStatus?: InputMaybe<TicketRedemptionStatus>;
 };
 
 export type PaginatedInputMyTicketsSearchValues = {
-  pagination: PaginationSearchInputParams;
-  search: InputMaybe<MyTicketsSearchValues>;
+  pagination?: PaginationSearchInputParams;
+  search?: InputMaybe<MyTicketsSearchValues>;
 };
 
 /** Type used for querying the paginated leaves and it's paginated meta data */
@@ -499,9 +499,9 @@ export type Query = {
 };
 
 export type QueryCommunitiesArgs = {
-  id: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  status: InputMaybe<CommnunityStatus>;
+  id?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  status?: InputMaybe<CommnunityStatus>;
 };
 
 export type QueryCommunityArgs = {
@@ -509,7 +509,7 @@ export type QueryCommunityArgs = {
 };
 
 export type QueryCompaniesArgs = {
-  input: InputMaybe<SearchCompaniesInput>;
+  input?: InputMaybe<SearchCompaniesInput>;
 };
 
 export type QueryCompanyArgs = {
@@ -525,7 +525,7 @@ export type QueryEventImagesArgs = {
 };
 
 export type QueryEventsArgs = {
-  input: InputMaybe<EventsSearchInput>;
+  input?: InputMaybe<EventsSearchInput>;
 };
 
 export type QueryMyTicketsArgs = {
@@ -541,11 +541,11 @@ export type QuerySearchPaymentLogsArgs = {
 };
 
 export type QueryStatusArgs = {
-  name: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type QueryTagsArgs = {
-  input: InputMaybe<TagSearchInput>;
+  input?: InputMaybe<TagSearchInput>;
 };
 
 export type QueryUserSearchArgs = {
@@ -594,14 +594,14 @@ export type SanityAssetRef = {
 };
 
 export type SearchCompaniesInput = {
-  companyName: InputMaybe<Scalars["String"]["input"]>;
-  description: InputMaybe<Scalars["String"]["input"]>;
-  domain: InputMaybe<Scalars["String"]["input"]>;
-  website: InputMaybe<Scalars["String"]["input"]>;
+  companyName?: InputMaybe<Scalars["String"]["input"]>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  domain?: InputMaybe<Scalars["String"]["input"]>;
+  website?: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type SearchPaymentLogsInput = {
-  endDate: InputMaybe<Scalars["DateTime"]["input"]>;
+  endDate?: InputMaybe<Scalars["DateTime"]["input"]>;
   startDate: Scalars["DateTime"]["input"];
 };
 
@@ -624,9 +624,9 @@ export type Tag = {
 };
 
 export type TagSearchInput = {
-  description: InputMaybe<Scalars["String"]["input"]>;
-  id: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  id?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
 };
 
 /** Representation of a ticket */
@@ -659,43 +659,43 @@ export enum TicketApprovalStatus {
 
 export type TicketClaimInput = {
   /** If this field is passed, a purchase order payment link will be generated right away */
-  generatePaymentLink: InputMaybe<GeneratePaymentLinkInput>;
+  generatePaymentLink?: InputMaybe<GeneratePaymentLinkInput>;
   /** A unique key to prevent duplicate requests, it's optional to send, but it's recommended to send it to prevent duplicate requests. If not sent, it will be created by the server. */
-  idempotencyUUIDKey: InputMaybe<Scalars["String"]["input"]>;
+  idempotencyUUIDKey?: InputMaybe<Scalars["String"]["input"]>;
   purchaseOrder: Array<PurchaseOrderInput>;
 };
 
 export type TicketCreateInput = {
-  description: InputMaybe<Scalars["String"]["input"]>;
-  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
   eventId: Scalars["String"]["input"];
   /** If the ticket is free, the price submitted will be ignored. */
   isFree: Scalars["Boolean"]["input"];
   name: Scalars["String"]["input"];
-  prices: InputMaybe<Array<PricingInputField>>;
-  quantity: InputMaybe<Scalars["Int"]["input"]>;
-  requiresApproval: InputMaybe<Scalars["Boolean"]["input"]>;
+  prices?: InputMaybe<Array<PricingInputField>>;
+  quantity?: InputMaybe<Scalars["Int"]["input"]>;
+  requiresApproval?: InputMaybe<Scalars["Boolean"]["input"]>;
   startDateTime: Scalars["DateTime"]["input"];
-  status: InputMaybe<TicketTemplateStatus>;
+  status?: InputMaybe<TicketTemplateStatus>;
   /** If provided, quantity must not be passed. This is for things like online events where there is no limit to the amount of tickets that can be sold. */
   unlimitedTickets: Scalars["Boolean"]["input"];
-  visibility: InputMaybe<TicketTemplateVisibility>;
+  visibility?: InputMaybe<TicketTemplateVisibility>;
 };
 
 export type TicketEditInput = {
-  description: InputMaybe<Scalars["String"]["input"]>;
-  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
-  eventId: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  prices: InputMaybe<PricingInputField>;
-  quantity: InputMaybe<Scalars["Int"]["input"]>;
-  requiresApproval: InputMaybe<Scalars["Boolean"]["input"]>;
-  startDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
-  status: InputMaybe<TicketTemplateStatus>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
+  eventId?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  prices?: InputMaybe<PricingInputField>;
+  quantity?: InputMaybe<Scalars["Int"]["input"]>;
+  requiresApproval?: InputMaybe<Scalars["Boolean"]["input"]>;
+  startDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
+  status?: InputMaybe<TicketTemplateStatus>;
   ticketId: Scalars["String"]["input"];
   /** If provided, quantity must not be passed. This is for things like online events where there is no limit to the amount of tickets that can be sold. */
-  unlimitedTickets: InputMaybe<Scalars["Boolean"]["input"]>;
-  visibility: InputMaybe<TicketTemplateVisibility>;
+  unlimitedTickets?: InputMaybe<Scalars["Boolean"]["input"]>;
+  visibility?: InputMaybe<TicketTemplateVisibility>;
 };
 
 export enum TicketPaymentStatus {
@@ -728,33 +728,33 @@ export enum TypeOfEmployment {
 
 export type UpdateCommunityInput = {
   communityId: Scalars["String"]["input"];
-  description: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  slug: InputMaybe<Scalars["String"]["input"]>;
-  status: InputMaybe<CommnunityStatus>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  slug?: InputMaybe<Scalars["String"]["input"]>;
+  status?: InputMaybe<CommnunityStatus>;
 };
 
 export type UpdateCompanyInput = {
   companyId: Scalars["String"]["input"];
-  description: InputMaybe<Scalars["String"]["input"]>;
-  domain: InputMaybe<Scalars["String"]["input"]>;
-  logo: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  website: InputMaybe<Scalars["String"]["input"]>;
+  description?: InputMaybe<Scalars["String"]["input"]>;
+  domain?: InputMaybe<Scalars["String"]["input"]>;
+  logo?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  website?: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type UpdateSalaryInput = {
-  amount: InputMaybe<Scalars["Int"]["input"]>;
+  amount?: InputMaybe<Scalars["Int"]["input"]>;
   confirmationToken: Scalars["String"]["input"];
-  countryCode: InputMaybe<Scalars["String"]["input"]>;
-  currencyCode: InputMaybe<Scalars["String"]["input"]>;
-  gender: InputMaybe<Gender>;
-  genderOtherText: InputMaybe<Scalars["String"]["input"]>;
+  countryCode?: InputMaybe<Scalars["String"]["input"]>;
+  currencyCode?: InputMaybe<Scalars["String"]["input"]>;
+  gender?: InputMaybe<Gender>;
+  genderOtherText?: InputMaybe<Scalars["String"]["input"]>;
   salaryId: Scalars["String"]["input"];
-  typeOfEmployment: InputMaybe<TypeOfEmployment>;
-  workMetodology: InputMaybe<WorkMetodology>;
-  workSeniorityAndRoleId: InputMaybe<Scalars["String"]["input"]>;
-  yearsOfExperience: InputMaybe<Scalars["Int"]["input"]>;
+  typeOfEmployment?: InputMaybe<TypeOfEmployment>;
+  workMetodology?: InputMaybe<WorkMetodology>;
+  workSeniorityAndRoleId?: InputMaybe<Scalars["String"]["input"]>;
+  yearsOfExperience?: InputMaybe<Scalars["Int"]["input"]>;
 };
 
 /** Representation of a user */
@@ -773,6 +773,7 @@ export type UserTicket = {
   approvalStatus: TicketApprovalStatus;
   id: Scalars["ID"]["output"];
   paymentStatus: TicketPaymentStatus;
+  purchaseOrder: Maybe<PurchaseOrder>;
   redemptionStatus: TicketRedemptionStatus;
   ticketTemplate: Ticket;
 };
@@ -830,15 +831,15 @@ export type UpdateUserRoleInCommunityInput = {
 };
 
 export type UserEditInput = {
-  bio: InputMaybe<Scalars["String"]["input"]>;
+  bio?: InputMaybe<Scalars["String"]["input"]>;
   id: Scalars["String"]["input"];
-  lastName: InputMaybe<Scalars["String"]["input"]>;
-  name: InputMaybe<Scalars["String"]["input"]>;
-  username: InputMaybe<Scalars["String"]["input"]>;
+  lastName?: InputMaybe<Scalars["String"]["input"]>;
+  name?: InputMaybe<Scalars["String"]["input"]>;
+  username?: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type UserSearchInput = {
-  tags: InputMaybe<Array<SearchableUserTags>>;
+  tags?: InputMaybe<Array<SearchableUserTags>>;
 };
 
 export type FetchExampleEventsQueryVariables = Exact<{ [key: string]: never }>;
diff --git a/app/api/gql/schema.gql b/app/api/gql/schema.gql
index 256d8d8..12b5b5b 100644
--- a/app/api/gql/schema.gql
+++ b/app/api/gql/schema.gql
@@ -787,6 +787,7 @@ type UserTicket {
   approvalStatus: TicketApprovalStatus!
   id: ID!
   paymentStatus: TicketPaymentStatus!
+  purchaseOrder: PurchaseOrder
   redemptionStatus: TicketRedemptionStatus!
   ticketTemplate: Ticket!
 }
diff --git a/app/components/MyTickets/MyTickets.tsx b/app/components/MyTickets/MyTickets.tsx
new file mode 100644
index 0000000..233f7a6
--- /dev/null
+++ b/app/components/MyTickets/MyTickets.tsx
@@ -0,0 +1,11 @@
+import { Suspense } from "react";
+
+import { MyTicketsList } from "~/components/MyTickets/MyTicketsList";
+
+export const MyTickets = () => {
+  return (
+    <Suspense>
+      <MyTicketsList />
+    </Suspense>
+  );
+};
diff --git a/app/components/MyTickets/MyTicketsList.tsx b/app/components/MyTickets/MyTicketsList.tsx
new file mode 100644
index 0000000..568b62c
--- /dev/null
+++ b/app/components/MyTickets/MyTicketsList.tsx
@@ -0,0 +1,28 @@
+import { TicketApprovalStatus } from "~/api/gql/graphql";
+import { useMyTicketsSuspenseQuery } from "~/components/MyTickets/graphql/myTickets.generated";
+
+export const MyTicketsList = () => {
+  const tickets = useMyTicketsSuspenseQuery({
+    variables: {
+      input: {
+        pagination: {
+          page: 0,
+          pageSize: 10,
+        },
+        search: {
+          approvalStatus: TicketApprovalStatus.Approved,
+        },
+      },
+    },
+  });
+
+  const myTickets = tickets.data.myTickets?.data?.map((ticket) => ticket);
+
+  return (
+    <div>
+      {myTickets.map((ticket) => (
+        <div key={ticket.id}>{ticket.id}</div>
+      ))}
+    </div>
+  );
+};
diff --git a/app/components/MyTickets/graphql/myTickets.gql b/app/components/MyTickets/graphql/myTickets.gql
index f7b178c..1039f9e 100644
--- a/app/components/MyTickets/graphql/myTickets.gql
+++ b/app/components/MyTickets/graphql/myTickets.gql
@@ -5,6 +5,20 @@ query myTickets($input: PaginatedInputMyTicketsSearchValues!) {
       id
       paymentStatus
       redemptionStatus
+      ticketTemplate {
+        id
+        name
+      }
+      purchaseOrder {
+        id
+        currency {
+          id
+          currency
+          validPaymentMethods
+        }
+        finalPrice
+        status
+      }
     }
     pagination {
       currentPage
diff --git a/app/routes/_authenticated/tickets/index.tsx b/app/routes/_authenticated/tickets/index.tsx
index 5a1dd5a..cbf973d 100644
--- a/app/routes/_authenticated/tickets/index.tsx
+++ b/app/routes/_authenticated/tickets/index.tsx
@@ -1,9 +1,13 @@
+import { MyTickets } from "~/components/MyTickets/MyTickets";
 import { sharedLayoutStyle } from "~/components/sharedLayouts";
 
 export default function Layout() {
   return (
     <div className={sharedLayoutStyle}>
-      <h1>Mis Tickets</h1>
+      <div className="flex flex-col gap-4">
+        <h1 className="text-3xl">Mis Tickets</h1>
+        <MyTickets />
+      </div>
     </div>
   );
 }
diff --git a/codegen.ts b/codegen.ts
index 08788b0..a3f0eec 100644
--- a/codegen.ts
+++ b/codegen.ts
@@ -23,7 +23,12 @@ const config = {
       config: {
         useTypeImports: true,
         skipTypename: true,
-        avoidOptionals: true,
+        avoidOptionals: {
+          field: true,
+          object: false,
+          inputValue: false,
+          defaultValue: false,
+        },
         nonOptionalTypename: false,
         // Lamentablemente, code-gen establece "any" como predeterminado, cuando no tiene un
         // tipo para un "scalar". Esta opción nos obliga a definir un tipo cada vez que

From 9a1f3108ab7eba0ddf21b0b0ab739135725a4d92 Mon Sep 17 00:00:00 2001
From: felipe torres <felipe.torressepulveda@gmail.com>
Date: Tue, 2 Jul 2024 17:36:16 -0700
Subject: [PATCH 6/6] Revert "Adding event to ticket"

This reverts commit b0fcb84a1f88e7e029e5033084dded1f5626a8b4.
---
 app/api/gql/graphql.ts                        | 201 +++++++++---------
 app/api/gql/schema.gql                        |   1 -
 app/components/MyTickets/MyTickets.tsx        |  11 -
 app/components/MyTickets/MyTicketsList.tsx    |  28 ---
 .../MyTickets/graphql/myTickets.gql           |  14 --
 app/routes/_authenticated/tickets/index.tsx   |   6 +-
 codegen.ts                                    |   7 +-
 7 files changed, 102 insertions(+), 166 deletions(-)
 delete mode 100644 app/components/MyTickets/MyTickets.tsx
 delete mode 100644 app/components/MyTickets/MyTicketsList.tsx

diff --git a/app/api/gql/graphql.ts b/app/api/gql/graphql.ts
index 70162ab..e9fbae5 100644
--- a/app/api/gql/graphql.ts
+++ b/app/api/gql/graphql.ts
@@ -100,13 +100,13 @@ export type CreateCommunityInput = {
 };
 
 export type CreateCompanyInput = {
-  description?: InputMaybe<Scalars["String"]["input"]>;
+  description: InputMaybe<Scalars["String"]["input"]>;
   /** The email domain of the company (What we'll use to match the company to the user on account-creation) */
   domain: Scalars["String"]["input"];
-  logo?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  status?: InputMaybe<CompanyStatus>;
-  website?: InputMaybe<Scalars["String"]["input"]>;
+  logo: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  status: InputMaybe<CompanyStatus>;
+  website: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type CreateSalaryInput = {
@@ -161,39 +161,39 @@ export type Event = {
 
 /** Representation of an Event (Events and Users, is what tickets are linked to) */
 export type EventUsersTicketsArgs = {
-  input?: InputMaybe<EventsTicketsSearchInput>;
+  input: InputMaybe<EventsTicketsSearchInput>;
 };
 
 export type EventCreateInput = {
-  address?: InputMaybe<Scalars["String"]["input"]>;
+  address: InputMaybe<Scalars["String"]["input"]>;
   communityId: Scalars["String"]["input"];
   description: Scalars["String"]["input"];
-  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
-  latitude?: InputMaybe<Scalars["String"]["input"]>;
-  longitude?: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
+  latitude: InputMaybe<Scalars["String"]["input"]>;
+  longitude: InputMaybe<Scalars["String"]["input"]>;
   maxAttendees: Scalars["Int"]["input"];
-  meetingURL?: InputMaybe<Scalars["String"]["input"]>;
+  meetingURL: InputMaybe<Scalars["String"]["input"]>;
   name: Scalars["String"]["input"];
   startDateTime: Scalars["DateTime"]["input"];
-  status?: InputMaybe<EventStatus>;
-  timeZone?: InputMaybe<Scalars["String"]["input"]>;
-  visibility?: InputMaybe<EventVisibility>;
+  status: InputMaybe<EventStatus>;
+  timeZone: InputMaybe<Scalars["String"]["input"]>;
+  visibility: InputMaybe<EventVisibility>;
 };
 
 export type EventEditInput = {
-  address?: InputMaybe<Scalars["String"]["input"]>;
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
+  address: InputMaybe<Scalars["String"]["input"]>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
   eventId: Scalars["String"]["input"];
-  latitude?: InputMaybe<Scalars["String"]["input"]>;
-  longitude?: InputMaybe<Scalars["String"]["input"]>;
-  maxAttendees?: InputMaybe<Scalars["Int"]["input"]>;
-  meetingURL?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  startDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
-  status?: InputMaybe<EventStatus>;
-  timeZone?: InputMaybe<Scalars["String"]["input"]>;
-  visibility?: InputMaybe<EventVisibility>;
+  latitude: InputMaybe<Scalars["String"]["input"]>;
+  longitude: InputMaybe<Scalars["String"]["input"]>;
+  maxAttendees: InputMaybe<Scalars["Int"]["input"]>;
+  meetingURL: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  startDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
+  status: InputMaybe<EventStatus>;
+  timeZone: InputMaybe<Scalars["String"]["input"]>;
+  visibility: InputMaybe<EventVisibility>;
 };
 
 /** Search for tags */
@@ -213,19 +213,19 @@ export enum EventVisibility {
 }
 
 export type EventsSearchInput = {
-  id?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  startDateTimeFrom?: InputMaybe<Scalars["DateTime"]["input"]>;
-  startDateTimeTo?: InputMaybe<Scalars["DateTime"]["input"]>;
-  status?: InputMaybe<EventStatus>;
-  visibility?: InputMaybe<EventVisibility>;
+  id: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  startDateTimeFrom: InputMaybe<Scalars["DateTime"]["input"]>;
+  startDateTimeTo: InputMaybe<Scalars["DateTime"]["input"]>;
+  status: InputMaybe<EventStatus>;
+  visibility: InputMaybe<EventVisibility>;
 };
 
 export type EventsTicketsSearchInput = {
-  approvalStatus?: InputMaybe<TicketApprovalStatus>;
-  id?: InputMaybe<Scalars["String"]["input"]>;
-  paymentStatus?: InputMaybe<TicketPaymentStatus>;
-  redemptionStatus?: InputMaybe<TicketRedemptionStatus>;
+  approvalStatus: InputMaybe<TicketApprovalStatus>;
+  id: InputMaybe<Scalars["String"]["input"]>;
+  paymentStatus: InputMaybe<TicketPaymentStatus>;
+  redemptionStatus: InputMaybe<TicketRedemptionStatus>;
 };
 
 export enum Gender {
@@ -376,15 +376,15 @@ export type MutationValidateWorkEmailArgs = {
 };
 
 export type MyTicketsSearchValues = {
-  approvalStatus?: InputMaybe<TicketApprovalStatus>;
-  eventId?: InputMaybe<Scalars["String"]["input"]>;
-  paymentStatus?: InputMaybe<TicketPaymentStatus>;
-  redemptionStatus?: InputMaybe<TicketRedemptionStatus>;
+  approvalStatus: InputMaybe<TicketApprovalStatus>;
+  eventId: InputMaybe<Scalars["String"]["input"]>;
+  paymentStatus: InputMaybe<TicketPaymentStatus>;
+  redemptionStatus: InputMaybe<TicketRedemptionStatus>;
 };
 
 export type PaginatedInputMyTicketsSearchValues = {
-  pagination?: PaginationSearchInputParams;
-  search?: InputMaybe<MyTicketsSearchValues>;
+  pagination: PaginationSearchInputParams;
+  search: InputMaybe<MyTicketsSearchValues>;
 };
 
 /** Type used for querying the paginated leaves and it's paginated meta data */
@@ -499,9 +499,9 @@ export type Query = {
 };
 
 export type QueryCommunitiesArgs = {
-  id?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  status?: InputMaybe<CommnunityStatus>;
+  id: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  status: InputMaybe<CommnunityStatus>;
 };
 
 export type QueryCommunityArgs = {
@@ -509,7 +509,7 @@ export type QueryCommunityArgs = {
 };
 
 export type QueryCompaniesArgs = {
-  input?: InputMaybe<SearchCompaniesInput>;
+  input: InputMaybe<SearchCompaniesInput>;
 };
 
 export type QueryCompanyArgs = {
@@ -525,7 +525,7 @@ export type QueryEventImagesArgs = {
 };
 
 export type QueryEventsArgs = {
-  input?: InputMaybe<EventsSearchInput>;
+  input: InputMaybe<EventsSearchInput>;
 };
 
 export type QueryMyTicketsArgs = {
@@ -541,11 +541,11 @@ export type QuerySearchPaymentLogsArgs = {
 };
 
 export type QueryStatusArgs = {
-  name?: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type QueryTagsArgs = {
-  input?: InputMaybe<TagSearchInput>;
+  input: InputMaybe<TagSearchInput>;
 };
 
 export type QueryUserSearchArgs = {
@@ -594,14 +594,14 @@ export type SanityAssetRef = {
 };
 
 export type SearchCompaniesInput = {
-  companyName?: InputMaybe<Scalars["String"]["input"]>;
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  domain?: InputMaybe<Scalars["String"]["input"]>;
-  website?: InputMaybe<Scalars["String"]["input"]>;
+  companyName: InputMaybe<Scalars["String"]["input"]>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  domain: InputMaybe<Scalars["String"]["input"]>;
+  website: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type SearchPaymentLogsInput = {
-  endDate?: InputMaybe<Scalars["DateTime"]["input"]>;
+  endDate: InputMaybe<Scalars["DateTime"]["input"]>;
   startDate: Scalars["DateTime"]["input"];
 };
 
@@ -624,9 +624,9 @@ export type Tag = {
 };
 
 export type TagSearchInput = {
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  id?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  id: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
 };
 
 /** Representation of a ticket */
@@ -659,43 +659,43 @@ export enum TicketApprovalStatus {
 
 export type TicketClaimInput = {
   /** If this field is passed, a purchase order payment link will be generated right away */
-  generatePaymentLink?: InputMaybe<GeneratePaymentLinkInput>;
+  generatePaymentLink: InputMaybe<GeneratePaymentLinkInput>;
   /** A unique key to prevent duplicate requests, it's optional to send, but it's recommended to send it to prevent duplicate requests. If not sent, it will be created by the server. */
-  idempotencyUUIDKey?: InputMaybe<Scalars["String"]["input"]>;
+  idempotencyUUIDKey: InputMaybe<Scalars["String"]["input"]>;
   purchaseOrder: Array<PurchaseOrderInput>;
 };
 
 export type TicketCreateInput = {
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
   eventId: Scalars["String"]["input"];
   /** If the ticket is free, the price submitted will be ignored. */
   isFree: Scalars["Boolean"]["input"];
   name: Scalars["String"]["input"];
-  prices?: InputMaybe<Array<PricingInputField>>;
-  quantity?: InputMaybe<Scalars["Int"]["input"]>;
-  requiresApproval?: InputMaybe<Scalars["Boolean"]["input"]>;
+  prices: InputMaybe<Array<PricingInputField>>;
+  quantity: InputMaybe<Scalars["Int"]["input"]>;
+  requiresApproval: InputMaybe<Scalars["Boolean"]["input"]>;
   startDateTime: Scalars["DateTime"]["input"];
-  status?: InputMaybe<TicketTemplateStatus>;
+  status: InputMaybe<TicketTemplateStatus>;
   /** If provided, quantity must not be passed. This is for things like online events where there is no limit to the amount of tickets that can be sold. */
   unlimitedTickets: Scalars["Boolean"]["input"];
-  visibility?: InputMaybe<TicketTemplateVisibility>;
+  visibility: InputMaybe<TicketTemplateVisibility>;
 };
 
 export type TicketEditInput = {
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  endDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
-  eventId?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  prices?: InputMaybe<PricingInputField>;
-  quantity?: InputMaybe<Scalars["Int"]["input"]>;
-  requiresApproval?: InputMaybe<Scalars["Boolean"]["input"]>;
-  startDateTime?: InputMaybe<Scalars["DateTime"]["input"]>;
-  status?: InputMaybe<TicketTemplateStatus>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  endDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
+  eventId: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  prices: InputMaybe<PricingInputField>;
+  quantity: InputMaybe<Scalars["Int"]["input"]>;
+  requiresApproval: InputMaybe<Scalars["Boolean"]["input"]>;
+  startDateTime: InputMaybe<Scalars["DateTime"]["input"]>;
+  status: InputMaybe<TicketTemplateStatus>;
   ticketId: Scalars["String"]["input"];
   /** If provided, quantity must not be passed. This is for things like online events where there is no limit to the amount of tickets that can be sold. */
-  unlimitedTickets?: InputMaybe<Scalars["Boolean"]["input"]>;
-  visibility?: InputMaybe<TicketTemplateVisibility>;
+  unlimitedTickets: InputMaybe<Scalars["Boolean"]["input"]>;
+  visibility: InputMaybe<TicketTemplateVisibility>;
 };
 
 export enum TicketPaymentStatus {
@@ -728,33 +728,33 @@ export enum TypeOfEmployment {
 
 export type UpdateCommunityInput = {
   communityId: Scalars["String"]["input"];
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  slug?: InputMaybe<Scalars["String"]["input"]>;
-  status?: InputMaybe<CommnunityStatus>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  slug: InputMaybe<Scalars["String"]["input"]>;
+  status: InputMaybe<CommnunityStatus>;
 };
 
 export type UpdateCompanyInput = {
   companyId: Scalars["String"]["input"];
-  description?: InputMaybe<Scalars["String"]["input"]>;
-  domain?: InputMaybe<Scalars["String"]["input"]>;
-  logo?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  website?: InputMaybe<Scalars["String"]["input"]>;
+  description: InputMaybe<Scalars["String"]["input"]>;
+  domain: InputMaybe<Scalars["String"]["input"]>;
+  logo: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  website: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type UpdateSalaryInput = {
-  amount?: InputMaybe<Scalars["Int"]["input"]>;
+  amount: InputMaybe<Scalars["Int"]["input"]>;
   confirmationToken: Scalars["String"]["input"];
-  countryCode?: InputMaybe<Scalars["String"]["input"]>;
-  currencyCode?: InputMaybe<Scalars["String"]["input"]>;
-  gender?: InputMaybe<Gender>;
-  genderOtherText?: InputMaybe<Scalars["String"]["input"]>;
+  countryCode: InputMaybe<Scalars["String"]["input"]>;
+  currencyCode: InputMaybe<Scalars["String"]["input"]>;
+  gender: InputMaybe<Gender>;
+  genderOtherText: InputMaybe<Scalars["String"]["input"]>;
   salaryId: Scalars["String"]["input"];
-  typeOfEmployment?: InputMaybe<TypeOfEmployment>;
-  workMetodology?: InputMaybe<WorkMetodology>;
-  workSeniorityAndRoleId?: InputMaybe<Scalars["String"]["input"]>;
-  yearsOfExperience?: InputMaybe<Scalars["Int"]["input"]>;
+  typeOfEmployment: InputMaybe<TypeOfEmployment>;
+  workMetodology: InputMaybe<WorkMetodology>;
+  workSeniorityAndRoleId: InputMaybe<Scalars["String"]["input"]>;
+  yearsOfExperience: InputMaybe<Scalars["Int"]["input"]>;
 };
 
 /** Representation of a user */
@@ -773,7 +773,6 @@ export type UserTicket = {
   approvalStatus: TicketApprovalStatus;
   id: Scalars["ID"]["output"];
   paymentStatus: TicketPaymentStatus;
-  purchaseOrder: Maybe<PurchaseOrder>;
   redemptionStatus: TicketRedemptionStatus;
   ticketTemplate: Ticket;
 };
@@ -831,15 +830,15 @@ export type UpdateUserRoleInCommunityInput = {
 };
 
 export type UserEditInput = {
-  bio?: InputMaybe<Scalars["String"]["input"]>;
+  bio: InputMaybe<Scalars["String"]["input"]>;
   id: Scalars["String"]["input"];
-  lastName?: InputMaybe<Scalars["String"]["input"]>;
-  name?: InputMaybe<Scalars["String"]["input"]>;
-  username?: InputMaybe<Scalars["String"]["input"]>;
+  lastName: InputMaybe<Scalars["String"]["input"]>;
+  name: InputMaybe<Scalars["String"]["input"]>;
+  username: InputMaybe<Scalars["String"]["input"]>;
 };
 
 export type UserSearchInput = {
-  tags?: InputMaybe<Array<SearchableUserTags>>;
+  tags: InputMaybe<Array<SearchableUserTags>>;
 };
 
 export type FetchExampleEventsQueryVariables = Exact<{ [key: string]: never }>;
diff --git a/app/api/gql/schema.gql b/app/api/gql/schema.gql
index 12b5b5b..256d8d8 100644
--- a/app/api/gql/schema.gql
+++ b/app/api/gql/schema.gql
@@ -787,7 +787,6 @@ type UserTicket {
   approvalStatus: TicketApprovalStatus!
   id: ID!
   paymentStatus: TicketPaymentStatus!
-  purchaseOrder: PurchaseOrder
   redemptionStatus: TicketRedemptionStatus!
   ticketTemplate: Ticket!
 }
diff --git a/app/components/MyTickets/MyTickets.tsx b/app/components/MyTickets/MyTickets.tsx
deleted file mode 100644
index 233f7a6..0000000
--- a/app/components/MyTickets/MyTickets.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Suspense } from "react";
-
-import { MyTicketsList } from "~/components/MyTickets/MyTicketsList";
-
-export const MyTickets = () => {
-  return (
-    <Suspense>
-      <MyTicketsList />
-    </Suspense>
-  );
-};
diff --git a/app/components/MyTickets/MyTicketsList.tsx b/app/components/MyTickets/MyTicketsList.tsx
deleted file mode 100644
index 568b62c..0000000
--- a/app/components/MyTickets/MyTicketsList.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { TicketApprovalStatus } from "~/api/gql/graphql";
-import { useMyTicketsSuspenseQuery } from "~/components/MyTickets/graphql/myTickets.generated";
-
-export const MyTicketsList = () => {
-  const tickets = useMyTicketsSuspenseQuery({
-    variables: {
-      input: {
-        pagination: {
-          page: 0,
-          pageSize: 10,
-        },
-        search: {
-          approvalStatus: TicketApprovalStatus.Approved,
-        },
-      },
-    },
-  });
-
-  const myTickets = tickets.data.myTickets?.data?.map((ticket) => ticket);
-
-  return (
-    <div>
-      {myTickets.map((ticket) => (
-        <div key={ticket.id}>{ticket.id}</div>
-      ))}
-    </div>
-  );
-};
diff --git a/app/components/MyTickets/graphql/myTickets.gql b/app/components/MyTickets/graphql/myTickets.gql
index 1039f9e..f7b178c 100644
--- a/app/components/MyTickets/graphql/myTickets.gql
+++ b/app/components/MyTickets/graphql/myTickets.gql
@@ -5,20 +5,6 @@ query myTickets($input: PaginatedInputMyTicketsSearchValues!) {
       id
       paymentStatus
       redemptionStatus
-      ticketTemplate {
-        id
-        name
-      }
-      purchaseOrder {
-        id
-        currency {
-          id
-          currency
-          validPaymentMethods
-        }
-        finalPrice
-        status
-      }
     }
     pagination {
       currentPage
diff --git a/app/routes/_authenticated/tickets/index.tsx b/app/routes/_authenticated/tickets/index.tsx
index cbf973d..5a1dd5a 100644
--- a/app/routes/_authenticated/tickets/index.tsx
+++ b/app/routes/_authenticated/tickets/index.tsx
@@ -1,13 +1,9 @@
-import { MyTickets } from "~/components/MyTickets/MyTickets";
 import { sharedLayoutStyle } from "~/components/sharedLayouts";
 
 export default function Layout() {
   return (
     <div className={sharedLayoutStyle}>
-      <div className="flex flex-col gap-4">
-        <h1 className="text-3xl">Mis Tickets</h1>
-        <MyTickets />
-      </div>
+      <h1>Mis Tickets</h1>
     </div>
   );
 }
diff --git a/codegen.ts b/codegen.ts
index a3f0eec..08788b0 100644
--- a/codegen.ts
+++ b/codegen.ts
@@ -23,12 +23,7 @@ const config = {
       config: {
         useTypeImports: true,
         skipTypename: true,
-        avoidOptionals: {
-          field: true,
-          object: false,
-          inputValue: false,
-          defaultValue: false,
-        },
+        avoidOptionals: true,
         nonOptionalTypename: false,
         // Lamentablemente, code-gen establece "any" como predeterminado, cuando no tiene un
         // tipo para un "scalar". Esta opción nos obliga a definir un tipo cada vez que