Feature/discord

components/DiscordLoginLink.tsx

@@ -0,0 +1,19 @@
+import Link from "next/link";
+
+const DiscordLoginLink = ({ userEmail }) => (
+  <div className="Box">
+    <Link
+      href={`https://discord.com/api/oauth2/authorize?client_id=1105902302839189514&permissions=26783953042448&redirect_uri=https%3A%2F%2Fapp.watermelontools.com%2Fdiscord&response_type=code&scope=identify%20email%20webhook.incoming%20relationships.read%20messages.read%20bot%20connections%20dm_channels.read`}
+      className="button block"
+    >
+      <div className="Box d-flex flex-items-center flex-justify-start p-2">
+        <img className="avatar avatar-8" src="/logos/github.svg" />
+        <div className="p-2">
+          <h2>Login to GitHub</h2>
+          <p>View your Assigned Issues and Relevant Pull Requests</p>
+        </div>
+      </div>
+    </Link>
+  </div>
+);
+export default DiscordLoginLink;

pages/discord.tsx

@@ -0,0 +1,77 @@
+import { useEffect, useState } from "react";
+import { useRouter } from "next/router";
+import Link from "next/link";
+import saveUserInfo from "../utils/db/github/saveUser";
+import JiraLoginLink from "../components/JiraLoginLink";
+export default function GitHub({ login, avatar_url, userEmail, error }) {
+  const [hasPaid, setHasPaid] = useState(false);
+  const [timeToRedirect, setTimeToRedirect] = useState(10);
+
+  const router = useRouter();
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setTimeToRedirect(timeToRedirect - 1);
+      if (timeToRedirect === 0) {
+        router.push("/");
+      }
+    }, 1000);
+    return () => clearInterval(interval);
+  }, [timeToRedirect]);
+
+  /* useEffect(() => {
+    // use getByEmail to check if user has paid
+    fetch("/api/payments/getByEmail", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({ email: userEmail }),
+    })
+      .then((res) => res.json())
+      .then((data) => {
+        if (data.email) {
+          setHasPaid(true);
+        }
+      });
+  }, []);
+ */
+  return (
+    <div className="Box" style={{ maxWidth: "100ch", margin: "auto" }}>
+      <div className="Subhead">
+        <h2 className="Subhead-heading px-2">
+          You have logged in with Discord as {login}
+        </h2>
+      </div>
+      <img
+        src={avatar_url}
+        alt="github user image"
+        className="avatar avatar-8"
+      />
+      <div>
+        <p className="text-emphasized">We recommend you login to Jira</p>
+        <JiraLoginLink userEmail={userEmail} />
+      </div>
+      <div>
+        <p>You will be redirected in {timeToRedirect}...</p>
+        <p>
+          If you are not redirected, please click <Link href="/">here</Link>
+        </p>
+        {error && <p>{error}</p>}
+      </div>
+    </div>
+  );
+}
+
+export async function getServerSideProps(context) {
+  let f;
+  if (context.query.code) {
+    console.log("code", context.query.code);
+  } else
+    return {
+      props: {
+        error: "no code",
+      },
+    };
+  console.log("context", context);
+}