Tranforming more components to typescript (#47)

frontend/pages/api/auth/IssueBackupPrivateKey.js

@@ -31,8 +31,8 @@ const issueBackupPrivateKey = ({
     if (res.status == 200) {
       return res;
     } else {
-      return res;
       console.log("Failed to issue the backup key");
+      return res;
     }
   });
 };

frontend/pages/api/auth/Logout.ts

@@ -3,11 +3,8 @@ import SecurityClient from "~/utilities/SecurityClient";
 /**
  * This route logs the user out. Note: the user should authorized to do this.
  * We first try to log out - if the authorization fails (response.status = 401), we refetch the new token, and then retry
- * @param {*} req
- * @param {*} res
- * @returns
  */
-const logout = async (req, res) => {
+const logout = async () => {
   return SecurityClient.fetchCall("/api/v1/auth/logout", {
     method: "POST",
     headers: {
@@ -15,7 +12,7 @@ const logout = async (req, res) => {
     },
     credentials: "include",
   }).then((res) => {
-    if (res.status == 200) {
+    if (res?.status == 200) {
       SecurityClient.setToken("");
       // Delete the cookie by not setting a value; Alternatively clear the local storage
       localStorage.setItem("publicKey", "");

frontend/pages/api/organization/GetOrg.ts

@@ -2,18 +2,17 @@ import SecurityClient from "~/utilities/SecurityClient";
 
 /**
  * This route lets us get info about a certain org
- * @param {*} req
- * @param {*} res
+ * @param {string} orgId - the organization ID
  * @returns
  */
-const getOrganization = (req, res) => {
-  return SecurityClient.fetchCall("/api/v1/organization/" + req.orgId, {
+const getOrganization = ({ orgId }: { orgId: string; }) => {
+  return SecurityClient.fetchCall("/api/v1/organization/" + orgId, {
     method: "GET",
     headers: {
       "Content-Type": "application/json",
     },
   }).then(async (res) => {
-    if (res.status == 200) {
+    if (res?.status == 200) {
       return (await res.json()).organization;
     } else {
       console.log("Failed to get org info");

frontend/pages/api/organization/getOrgs.ts

@@ -2,18 +2,16 @@ import SecurityClient from "~/utilities/SecurityClient";
 
 /**
  * This route lets us get the all the orgs of a certain user.
- * @param {*} req
- * @param {*} res
  * @returns
  */
-const getOrganizations = (req, res) => {
+const getOrganizations = () => {
   return SecurityClient.fetchCall("/api/v1/organization", {
     method: "GET",
     headers: {
       "Content-Type": "application/json",
     },
   }).then(async (res) => {
-    if (res.status == 200) {
+    if (res?.status == 200) {
       return (await res.json()).organizations;
     } else {
       console.log("Failed to get orgs of a user");

frontend/pages/api/user/getUser.ts

@@ -2,18 +2,15 @@ import SecurityClient from "~/utilities/SecurityClient";
 
 /**
  * This route gets the information about a specific user.
- * @param {*} req
- * @param {*} res
- * @returns
  */
-const getUser = (req, res) => {
+const getUser = () => {
   return SecurityClient.fetchCall("/api/v1/user", {
     method: "GET",
     headers: {
       "Content-Type": "application/json",
     },
   }).then(async (res) => {
-    if (res.status == 200) {
+    if (res?.status == 200) {
       return (await res.json()).user;
     } else {
       console.log("Failed to get user info");

frontend/pages/api/workspace/getProjectInfo.ts

@@ -2,13 +2,12 @@ import SecurityClient from "~/utilities/SecurityClient";
 
 /**
  * This route lets us get the information of a certain project.
- * @param {*} req
- * @param {*} res
+ * @param {*} projectId - project ID (we renamed workspaces to projects in the app)
  * @returns
  */
-const getWorkspaceInfo = (req, res) => {
+const getProjectInfo = ({ projectId }: { projectId: string; }) => {
   return SecurityClient.fetchCall(
-    "/api/v1/workspace/" + req.workspaceId,
+    "/api/v1/workspace/" + projectId,
     {
       method: "GET",
       headers: {
@@ -16,7 +15,7 @@ const getWorkspaceInfo = (req, res) => {
       },
     }
   ).then(async (res) => {
-    if (res.status == 200) {
+    if (res?.status == 200) {
       return (await res.json()).workspace;
     } else {
       console.log("Failed to get project info");
@@ -24,4 +23,4 @@ const getWorkspaceInfo = (req, res) => {
   });
 };
 
-export default getWorkspaceInfo;
+export default getProjectInfo;

frontend/pages/home/[id].tsx

@@ -98,22 +98,22 @@ export default function Home() {
 
   useEffect(() => {
     const checkUserActionsFunction = async () => {
-      let userActionSlack = await checkUserAction({
+      const userActionSlack = await checkUserAction({
         action: "slack_cta_clicked",
       });
       setHasUserClickedSlack(userActionSlack ? true : false);
 
-      let userActionIntro = await checkUserAction({
+      const userActionIntro = await checkUserAction({
         action: "intro_cta_clicked",
       });
       setHasUserClickedIntro(userActionIntro ? true : false);
 
-      let userActionStar = await checkUserAction({
+      const userActionStar = await checkUserAction({
         action: "star_cta_clicked",
       });
       setHasUserStarred(userActionStar ? true : false);
 
-      let orgId = localStorage.getItem("orgData.id");
+      const orgId = localStorage.getItem("orgData.id");
       const orgUsers = await getOrganizationUsers({
         orgId: orgId ? orgId : "",
       });
@@ -123,9 +123,9 @@ export default function Home() {
   }, []);
 
   return (
-    <div className="mx-6 lg:mx-0 w-full overflow-y-scroll pt-28 h-screen">
-      <div className="flex flex-col items-center text-gray-300 text-lg mx-auto max-w-2xl lg:max-w-3xl xl:max-w-4xl">
-        <div className="text-3xl font-bold text-left w-full pt-6">Your quick start guide</div>
+    <div className="mx-6 lg:mx-0 w-full overflow-y-scroll pt-20 h-screen">
+      <div className="flex flex-col items-center text-gray-300 text-lg mx-auto max-w-2xl lg:max-w-3xl xl:max-w-4xl py-6">
+        <div className="text-3xl font-bold text-left w-full">Your quick start guide</div>
         <div className="text-md text-left w-full pt-2 pb-4 text-bunker-300">Click on the items below and follow the instructions.</div>
         {learningItem({ text: "Get to know Infisical", subText: "", complete: hasUserClickedIntro, icon: faHandPeace, time: "3 min", userAction: "intro_cta_clicked", link: "https://www.youtube.com/watch?v=JS3OKYU2078" })}
         {learningItem({ text: "Add your secrets", subText: "Click to see example secrets, and add your own.", complete: false, icon: faPlus, time: "2 min", userAction: "first_time_secrets_pushed", link: "/dashboard/" + router.query.id })}

frontend/pages/signup.js

@@ -197,7 +197,7 @@ export default function SignUp() {
         },
         async () => {
           client.createVerifier(async (err, result) => {
-            const response = await completeAccountInformationSignup({
+            let response = await completeAccountInformationSignup({
               email,
               firstName,
               lastName,

frontend/pages/signupinvite.js

@@ -92,7 +92,7 @@ export default function SignupInvite() {
         },
         async () => {
           client.createVerifier(async (err, result) => {
-            const response = await completeAccountInformationSignupInvite({
+            let response = await completeAccountInformationSignupInvite({
               email,
               firstName,
               lastName,
@@ -291,7 +291,7 @@ export default function SignupInvite() {
           <div className="py-2"></div>
         )}
       </div>
-      <div className="flex flex-col items-center justify-center w-full md:px-4 md:py-5 mt-2 px-2 py-3  max-h-24 max-w-md mx-auto text-lg">
+      <div className="flex flex-col items-center justify-center md:px-4 md:py-5 mt-2 px-2 py-3 max-h-24 max-w-max mx-auto text-lg">
         <Button
           text="Sign Up"
           onButtonPressed={() => {