Revert "Add: tRPC + register on first time login"

This reverts commit cb5f9017a9a3e1e0886bfa67b9b9f5554f527d35.

components/FormLayout.tsx

@@ -1,12 +1,12 @@
 import Head from "next/head";
 import Link from "next/link";
-import { FormEvent } from "react";
 
-import { config } from "../config";
 import MessageManager from "./MessageManager";
 
 import styles from "../styles/create.module.scss";
 
+import { config } from "../config";
+
 interface FormProps {
   title: string;
   errorMessage?: string;
@@ -14,7 +14,7 @@ interface FormProps {
   infoMessage?: string;
 
   canSubmit: boolean;
-  handleSubmit: (event: FormEvent<HTMLFormElement>) => void;
+  handleSubmit: (event) => void;
 
   textBtnConfirm?: string;
   classBtnConfirm?: string;

package.json

@@ -10,11 +10,6 @@
   "dependencies": {
     "@prisma/client": "^4.10.0",
     "@svgr/webpack": "^6.5.1",
-    "@tanstack/react-query": "^4.24.6",
-    "@trpc/client": "^10.11.1",
-    "@trpc/next": "^10.11.1",
-    "@trpc/react-query": "^10.11.1",
-    "@trpc/server": "^10.11.1",
     "axios": "^1.3.2",
     "next": "^13.1.6",
     "next-auth": "^4.19.2",
@@ -26,8 +21,7 @@
     "react-select": "^5.7.0",
     "sass": "^1.58.0",
     "sharp": "^0.31.3",
-    "toastr": "^2.1.4",
+    "toastr": "^2.1.4"
-    "zod": "^3.20.6"
   },
   "devDependencies": {
     "@types/node": "^18.13.0",

pages/_app.tsx

@@ -1,36 +1,31 @@
-import { SessionProvider } from "next-auth/react";
+import { useEffect } from 'react';
-import type { AppProps } from "next/app";
+import { SessionProvider } from 'next-auth/react';
-import { useRouter } from "next/router";
-import nProgress from "nprogress";
-import { useEffect } from "react";
 
-import AuthRequired from "../components/AuthRequired";
+import { useRouter } from 'next/router';
 
-import { trpc } from "../utils/trpc";
+import nProgress from 'nprogress';
+import 'nprogress/nprogress.css';
 
-import "nprogress/nprogress.css";
+import AuthRequired from '../components/AuthRequired';
-import "../styles/globals.scss";
+
+import '../styles/globals.scss';
 
-interface MyAppProps extends AppProps {
-  Component: any; // TODO: fix type
-}
 function MyApp({
 	Component,
-  pageProps: { session, ...pageProps },
+	pageProps: { session, ...pageProps }
-}: MyAppProps) {
+}) {
 	const router = useRouter();
 
-  useEffect(() => {
+	useEffect(() => { // Chargement pages
-    // Chargement pages
+		router.events.on('routeChangeStart', nProgress.start);
-    router.events.on("routeChangeStart", nProgress.start);
+		router.events.on('routeChangeComplete', nProgress.done);
-    router.events.on("routeChangeComplete", nProgress.done);
+		router.events.on('routeChangeError', nProgress.done);
-    router.events.on("routeChangeError", nProgress.done);
 
 		return () => {
-      router.events.off("routeChangeStart", nProgress.start);
+			router.events.off('routeChangeStart', nProgress.start);
-      router.events.off("routeChangeComplete", nProgress.done);
+			router.events.off('routeChangeComplete', nProgress.done);
-      router.events.off("routeChangeError", nProgress.done);
+			router.events.off('routeChangeError', nProgress.done);
-    };
+		}
 	});
 
 	return (
@@ -46,4 +41,4 @@ function MyApp({
 	);
 }
 
-export default trpc.withTRPC(MyApp);
+export default MyApp;

pages/api/auth/[...nextauth].ts

@@ -1,7 +1,7 @@
-import NextAuth from "next-auth";
+import NextAuth from 'next-auth';
-import GoogleProvider from "next-auth/providers/google";
+import GoogleProvider from 'next-auth/providers/google';
 
-import { PrismaClient } from "@prisma/client";
+import { PrismaClient } from '@prisma/client';
 const prisma = new PrismaClient();
 
 export default NextAuth({
@@ -11,91 +11,54 @@ export default NextAuth({
             clientSecret: process.env.GOOGLE_CLIENT_SECRET,
             authorization: {
                 params: {
-          prompt: "consent",
+                    prompt: 'consent',
-          access_type: "offline",
+                    access_type: 'offline',
-          response_type: "code",
+                    response_type: 'code'
-        },
+                }
-      },
+            }
-    }),
+        })
     ],
     callbacks: {
-    async signIn({ account: accountParam, profile }) {
+        async signIn({ account: accountParam, profile }) { // TODO: Auth
-      // TODO: Auth
+            console.log('Connexion via', accountParam.provider, accountParam.providerAccountId, profile.email, profile.name)
-      console.log(
+            if (accountParam.provider !== 'google') {
-        "Connexion via",
+                return '/signin?error=' + encodeURI('Authentitifcation via Google requise');
-        accountParam.provider,
-        accountParam.providerAccountId,
-        profile.email,
-        profile.name
-      );
-      if (accountParam.provider !== "google") {
-        return (
-          "/signin?error=" + encodeURI("Authentitifcation via Google requise")
-        );
             }
 
             const email = profile?.email;
-      if (email === "") {
+            if (email === '') {
-        return (
+                return '/signin?error=' + encodeURI('Impossible de récupérer l\'email associé à ce compte Google');
-          "/signin?error=" +
-          encodeURI(
-            "Impossible de récupérer l'email associé à ce compte Google"
-          )
-        );
             }
 
             const googleId = profile?.sub;
-      if (googleId === "") {
+            if (googleId === '') {
-        return (
+                return '/signin?error=' + encodeURI('Impossible de récupérer l\'identifiant associé à ce compte Google');
-          "/signin?error=" +
-          encodeURI(
-            "Impossible de récupérer l'identifiant associé à ce compte Google"
-          )
-        );
             }
 
             try {
                 const account = await prisma.user.findFirst({
                     where: {
                         google_id: googleId,
-            email,
+                        email
-          },
+                    }
                 });
-        const accountCount = await prisma.user.count();
 
                 if (!account) {
-          if (accountCount === 0) {
+                    return '/signin?error=' + encodeURI('Vous n\'êtes pas autorisé à vous connecter avec ce compte Google');
-            await prisma.user.create({
-              data: {
-                email,
-                google_id: googleId,
-              },
-            });
-            return true;
-          }
-          return (
-            "/signin?error=" +
-            encodeURI(
-              "Vous n'êtes pas autorisé à vous connecter avec ce compte Google"
-            )
-          );
                 } else {
                     return true;
                 }
             } catch (error) {
                 console.error(error);
-        return (
+                return '/signin?error=' + encodeURI('Une erreur est survenue lors de l\'authentification');
-          "/signin?error=" +
+            }
-          encodeURI("Une erreur est survenue lors de l'authentification")
-        );
         }
     },
-  },
     pages: {
-    signIn: "/signin",
+        signIn: '/signin',
-    error: "/signin",
+        error: '/signin'
     },
     session: {
-    maxAge: 60 * 60 * 6, // Session de 6 heures
+        maxAge: 60 * 60 * 6 // Session de 6 heures
-  },
+    }
 });

pages/api/trpc/[trpc].ts

@@ -1,10 +0,0 @@
-import * as trpcNext from "@trpc/server/adapters/next";
-import { appRouter } from "../../../server/routers/_app";
-
-// export API handler
-// @see https://trpc.io/docs/api-handler
-
-export default trpcNext.createNextApiHandler({
-  router: appRouter,
-  createContext: () => ({}),
-});

pages/category/create.tsx

@@ -1,55 +1,48 @@
-import axios, { AxiosResponse } from "axios";
+import { useEffect, useState } from 'react';
-import { useRouter } from "next/router";
-import nProgress from "nprogress";
-import { FormEvent, useMemo, useState } from "react";
 
-import FormLayout from "../../components/FormLayout";
+import nProgress from 'nprogress';
-import TextBox from "../../components/TextBox";
+import axios, { AxiosResponse } from 'axios';
 
-import { Category } from "../../types";
+import FormLayout from '../../components/FormLayout';
-import { HandleAxiosError } from "../../utils/front";
+import TextBox from '../../components/TextBox';
-import { trpc } from "../../utils/trpc";
 
-import styles from "../../styles/create.module.scss";
+import styles from '../../styles/create.module.scss';
+import { HandleAxiosError } from '../../utils/front';
+import { useRouter } from 'next/router';
 
 function CreateCategory() {
-  const hello = trpc.hello.useQuery({ text: "client" });
     const info = useRouter().query?.info as string;
-  const [name, setName] = useState<string>("");
+    const [name, setName] = useState<string>('');
 
-  const [error, setError] = useState<string | undefined>();
+    const [error, setError] = useState<string | null>(null);
-  const [success, setSuccess] = useState<string | undefined>();
+    const [success, setSuccess] = useState<string | null>(null);
-  const [loading, setLoading] = useState<boolean>(false);
+    const [canSubmit, setCanSubmit] = useState<boolean>(false);
 
-  const canSubmit = useMemo<boolean>(
+    useEffect(() => setCanSubmit(name.length !== 0), [name]);
-    () => name.length !== 0 && !loading,
+
-    [loading, name.length]
+    const handleSubmit = async (event) => {
-  );
-  const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {
         event.preventDefault();
-    setSuccess(undefined);
+        setSuccess(null);
-    setError(undefined);
+        setError(null);
-    setLoading(true);
+        setCanSubmit(false);
         nProgress.start();
 
         try {
             const payload = { name };
-      const { data }: AxiosResponse<{ success: string; category: Category }> =
+            const { data }: AxiosResponse<any> = await axios.post('/api/category/create', payload);
-        await axios.post("/api/category/create", payload);
+            setSuccess(data?.success || 'Categorie créée avec succès');
-
+            setCanSubmit(false);
-      console.log(data);
-      setSuccess(data.success);
         } catch (error) {
             setError(HandleAxiosError(error));
+            setCanSubmit(true);
         } finally {
-      setLoading(false);
             nProgress.done();
         }
-  };
+    }
 
-  return (
+    return (<>
         <FormLayout
-      title="Créer une catégorie"
+            title='Créer une catégorie'
             errorMessage={error}
             successMessage={success}
             infoMessage={info}
@@ -57,16 +50,15 @@ function CreateCategory() {
             handleSubmit={handleSubmit}
         >
             <TextBox
-        name="name"
+                name='name'
-        label="Nom de la catégorie"
+                label='Nom de la catégorie'
                 onChangeCallback={(value) => setName(value)}
                 value={name}
-        fieldClass={styles["input-field"]}
+                fieldClass={styles['input-field']}
-        placeholder="Nom..."
+                placeholder='Nom...'
             />
-      {JSON.stringify(hello)}
         </FormLayout>
-  );
+    </>);
 }
 
 CreateCategory.authRequired = true;

pages/index.tsx

@@ -53,14 +53,17 @@ export async function getServerSideProps() {
     const favorites = [] as Link[];
     const categories = categoriesDB.map((categoryDB) => {
         const category = BuildCategory(categoryDB);
-    category.links.map((link) => (link.favorite ? favorites.push(link) : null));
+        category.links.map((link) =>
+            link.favorite ? favorites.push(link) : null
+        );
         return category;
     });
 
     if (categories.length === 0) {
         return {
             redirect: {
-        destination: "/category/create",
+                destination:
+                    "/category/create?info=Veuillez créer une catégorie",
             },
         };
     }

server/routers/_app.ts

@@ -1,19 +0,0 @@
-import { z } from "zod";
-import { procedure, router } from "../trpc";
-
-export const appRouter = router({
-  hello: procedure
-    .input(
-      z.object({
-        text: z.string(),
-      })
-    )
-    .query(({ input }) => {
-      return {
-        greeting: `hello ${input.text}`,
-      };
-    }),
-});
-
-// export type definition of API
-export type AppRouter = typeof appRouter;

server/trpc.ts

@@ -1,9 +0,0 @@
-import { initTRPC } from "@trpc/server";
-// Avoid exporting the entire t-object
-// since it's not very descriptive.
-// For instance, the use of a t variable
-// is common in i18n libraries.
-const t = initTRPC.create();
-// Base router and procedure helpers
-export const router = t.router;
-export const procedure = t.procedure;

tsconfig.json

@@ -8,7 +8,7 @@
 		],
 		"allowJs": true,
 		"skipLibCheck": true,
-		"strict": true,
+		"strict": false,
 		"forceConsistentCasingInFileNames": true,
 		"noEmit": true,
 		"esModuleInterop": true,
@@ -28,3 +28,4 @@
       	"node_modules"
     ]
 }
+  

utils/trpc.ts

@@ -1,21 +0,0 @@
-import { httpBatchLink } from "@trpc/client";
-import { createTRPCNext } from "@trpc/next";
-import type { AppRouter } from "../server/routers/_app";
-
-const getBaseUrl = () =>
-  typeof window !== "undefined"
-    ? ""
-    : `http://localhost:${process.env.PORT ?? 3000}`;
-
-export const trpc = createTRPCNext<AppRouter>({
-  config({ ctx }) {
-    return {
-      links: [
-        httpBatchLink({
-          url: `${getBaseUrl()}/api/trpc`,
-        }),
-      ],
-    };
-  },
-  ssr: false,
-});