Fix type errors

pages/api/trpc/[trpc].ts

@@ -38,8 +38,6 @@ export type inferQueryOutput<
   TRouteKey extends keyof AppRouter["_def"]["queries"]
 > = inferProcedureOutput<AppRouter["_def"]["queries"][TRouteKey]>;
 
-export const ssr = trcpReactQuery.ssr(appRouter, { user: null });
-
 export default trpcNext.createNextApiHandler({
   router: appRouter,
   createContext,

pages/calendar.tsx

@@ -2,22 +2,23 @@ import { Button } from "@chakra-ui/button";
 import { Input, InputGroup, InputLeftElement } from "@chakra-ui/input";
 import { Box } from "@chakra-ui/layout";
 import { t, Trans } from "@lingui/macro";
+import { createSSGHelpers } from "@trpc/react/ssg";
 import EventInfo from "components/calendar/EventInfo";
 import { EventModal, FormData } from "components/calendar/EventModal";
 import MyHead from "components/common/MyHead";
 import SubText from "components/common/SubText";
 import { useMyTheme } from "hooks/common";
-import { ssr } from "pages/api/trpc/[trpc]";
+import { appRouter } from "pages/api/trpc/[trpc]";
 import { Fragment, useState } from "react";
 import { FiSearch } from "react-icons/fi";
+import superjson from "superjson";
 import { trpc } from "utils/trpc";
 
 const CalendarPage = () => {
   const { gray } = useMyTheme();
   const events = trpc.useQuery(["calendar.events"], { enabled: false });
-  const [eventToEdit, setEventToEdit] = useState<
-    boolean | (FormData & { id: number })
-  >(false);
+  const [eventToEdit, setEventToEdit] =
+    useState<boolean | (FormData & { id: number })>(false);
   const [filter, setFilter] = useState("");
 
   let lastPrintedDate: [number, number, Date] | null = null;
@@ -135,11 +136,16 @@ const CalendarPage = () => {
 };
 
 export const getStaticProps = async () => {
-  await ssr.prefetchQuery("calendar.events");
+  const ssg = createSSGHelpers({
+    router: appRouter,
+    transformer: superjson,
+    ctx: { user: null },
+  });
+  await ssg.prefetchQuery("calendar.events");
 
   return {
     props: {
-      dehydratedState: ssr.dehydrate(),
+      dehydratedState: ssg.dehydrate(),
     },
     revalidate: 60,
   };

pages/freeagents.tsx

@@ -8,6 +8,7 @@ import {
   Flex,
 } from "@chakra-ui/react";
 import { Trans } from "@lingui/macro";
+import { createSSGHelpers } from "@trpc/react/ssg";
 import FAFilters from "components/freeagents/FAFilters";
 import FAModal from "components/freeagents/FAModal";
 import FreeAgentSection from "components/freeagents/FreeAgentSection";
@@ -15,10 +16,11 @@ import MatchesInfo from "components/freeagents/MatchesInfo";
 import { useMyTheme, useUser } from "hooks/common";
 import { useFreeAgents } from "hooks/freeagents";
 import { useRouter } from "next/router";
+import { appRouter } from "pages/api/trpc/[trpc]";
 import { useEffect, useRef, useState } from "react";
+import superjson from "superjson";
 import { mutate } from "swr";
 import { sendData } from "utils/postData";
-import { ssr } from "./api/trpc/[trpc]";
 
 const FreeAgentsPage = () => {
   const {
@@ -35,9 +37,8 @@ const FreeAgentsPage = () => {
   const [user] = useUser();
   const router = useRouter();
 
-  const [postIdToScrollTo, setPostIdToScrollTo] = useState<undefined | number>(
-    undefined
-  );
+  const [postIdToScrollTo, setPostIdToScrollTo] =
+    useState<undefined | number>(undefined);
   const { gray } = useMyTheme();
   const [sending, setSending] = useState(false);
   const postRef = useRef<HTMLDivElement>(null);
@@ -170,11 +171,16 @@ const FreeAgentsPage = () => {
 };
 
 export const getStaticProps = async () => {
-  await ssr.prefetchQuery("freeAgents.posts");
+  const ssg = createSSGHelpers({
+    router: appRouter,
+    transformer: superjson,
+    ctx: { user: null },
+  });
+  await ssg.prefetchQuery("freeAgents.posts");
 
   return {
     props: {
-      dehydratedState: ssr.dehydrate(),
+      dehydratedState: ssg.dehydrate(),
     },
     revalidate: 60,
   };

pages/plus/index.tsx

@@ -8,6 +8,7 @@ import {
   RadioGroup,
 } from "@chakra-ui/react";
 import { Trans } from "@lingui/macro";
+import { createSSGHelpers } from "@trpc/react/ssg";
 import MyHead from "components/common/MyHead";
 import SubText from "components/common/SubText";
 import Suggestion from "components/plus/Suggestion";
@@ -17,8 +18,9 @@ import VouchesList from "components/plus/VouchesList";
 import VouchModal from "components/plus/VouchModal";
 import { useUser } from "hooks/common";
 import { usePlusHomePage } from "hooks/plus";
-import { ssr } from "pages/api/trpc/[trpc]";
+import { appRouter } from "pages/api/trpc/[trpc]";
 import { Fragment } from "react";
+import superjson from "superjson";
 import { getVotingRange } from "utils/plus";
 import { getFullUsername } from "utils/strings";
 
@@ -238,14 +240,19 @@ const PlusHomePage = () => {
 };
 
 export const getStaticProps = async () => {
+  const ssg = createSSGHelpers({
+    router: appRouter,
+    transformer: superjson,
+    ctx: { user: null },
+  });
   await Promise.all([
-    ssr.prefetchQuery("plus.suggestions"),
-    ssr.prefetchQuery("plus.statuses"),
+    ssg.prefetchQuery("plus.suggestions"),
+    ssg.prefetchQuery("plus.statuses"),
   ]);
 
   return {
     props: {
-      dehydratedState: ssr.dehydrate(),
+      dehydratedState: ssg.dehydrate(),
     },
     revalidate: 60,
   };

utils/trpc.ts

@@ -1,4 +1,4 @@
-import { createReactQueryHooks, createTRPCClient } from "@trpc/react";
+import { createReactQueryHooks } from "@trpc/react";
 import superjson from "superjson";
 // Type-only import:
 // https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html#type-only-imports-and-export