From 8541e0d78f1ac51d08039ceada42bb5904007575 Mon Sep 17 00:00:00 2001 From: "sweep-ai[bot]" <128439645+sweep-ai[bot]@users.noreply.github.com> Date: Wed, 26 Jul 2023 15:56:22 +0000 Subject: [PATCH 1/2] Update dashboard/src/main/Main.tsx --- dashboard/src/main/Main.tsx | 165 ++++++++++++++++++------------------ 1 file changed, 82 insertions(+), 83 deletions(-) diff --git a/dashboard/src/main/Main.tsx b/dashboard/src/main/Main.tsx index f0b188d595..c5d1bdd654 100644 --- a/dashboard/src/main/Main.tsx +++ b/dashboard/src/main/Main.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import React, { useState, useEffect, useContext } from "react"; import { Route, Redirect, Switch } from "react-router-dom"; import api from "shared/api"; @@ -27,30 +27,25 @@ type StateType = { version: string; }; -export default class Main extends Component { - state = { - loading: true, - isLoggedIn: false, - isEmailVerified: false, - hasInfo: false, - initialized: localStorage.getItem("init") === "true", - local: false, - userId: null as number, - version: null as string, - }; - - componentDidMount() { +const Main: React.FC = () => { + const [loading, setLoading] = useState(true); + const [isLoggedIn, setIsLoggedIn] = useState(false); + const [isEmailVerified, setIsEmailVerified] = useState(false); + const [hasInfo, setHasInfo] = useState(false); + const [initialized, setInitialized] = useState(localStorage.getItem("init") === "true"); + const [local, setLocal] = useState(false); + const [userId, setUserId] = useState(null); + const [version, setVersion] = useState(null); + useEffect(() => { // Get capabilities to case on user info requirements api.getMetadata("", {}, {}) .then((res) => { - this.setState({ - version: res.data?.version, - }) + setVersion(res.data?.version); }) .catch((err) => console.log(err)); - let { setUser, setCurrentError } = this.context; + let { setUser, setCurrentError } = useContext(Context); let urlParams = new URLSearchParams(window.location.search); let error = urlParams.get("error"); error && setCurrentError(error); @@ -59,88 +54,94 @@ export default class Main extends Component { .then((res) => { if (res && res?.data) { setUser(res.data.id, res.data.email); - this.setState({ - isLoggedIn: true, - isEmailVerified: res.data.email_verified, - initialized: true, - hasInfo: res.data.company_name && true, - loading: false, - userId: res.data.id, - }); + setIsLoggedIn(true); + setIsEmailVerified(res.data.email_verified); + setInitialized(true); + setHasInfo(res.data.company_name && true); + setLoading(false); + setUserId(res.data.id); } else { - this.setState({ isLoggedIn: false, loading: false }); + setIsLoggedIn(false); + setLoading(false); } }) - .catch((err) => this.setState({ isLoggedIn: false, loading: false })); + .catch((err) => { + setIsLoggedIn(false); + setLoading(false); + }); api .getMetadata("", {}, {}) .then((res) => { - this.context.setEdition(res.data?.version); - this.setState({ local: !res.data?.provisioner }); - this.context.setEnableGitlab(res.data?.gitlab ? true : false); + useContext(Context).setEdition(res.data?.version); + setLocal(!res.data?.provisioner); + useContext(Context).setEnableGitlab(res.data?.gitlab ? true : false); }) .catch((err) => console.log(err)); - } + }, []); - initialize = () => { - this.setState({ isLoggedIn: true, initialized: true }); + const initialize = () => { + setIsLoggedIn(true); + setInitialized(true); localStorage.setItem("init", "true"); }; - authenticate = () => { + const authenticate = () => { api .checkAuth("", {}, {}) .then((res) => { if (res && res?.data) { - this.context.setUser(res?.data?.id, res?.data?.email); - this.setState({ - isLoggedIn: true, - isEmailVerified: res?.data?.email_verified, - initialized: true, - hasInfo: res.data.company_name && true, - loading: false, - userId: res.data.id, - }); + useContext(Context).setUser(res?.data?.id, res?.data?.email); + setIsLoggedIn(true); + setIsEmailVerified(res?.data?.email_verified); + setInitialized(true); + setHasInfo(res.data.company_name && true); + setLoading(false); + setUserId(res.data.id); } else { - this.setState({ isLoggedIn: false, loading: false }); + setIsLoggedIn(false); + setLoading(false); } }) - .catch((err) => this.setState({ isLoggedIn: false, loading: false })); + .catch((err) => { + setIsLoggedIn(false); + setLoading(false); + }); }; - handleLogOut = () => { + const handleLogOut = () => { // Clears local storage for proper rendering of clusters // Attempt user logout api .logOutUser("", {}, {}) .then(() => { - this.context.clearContext(); - this.setState({ isLoggedIn: false, initialized: true }); + useContext(Context).clearContext(); + setIsLoggedIn(false); + setInitialized(true); localStorage.clear(); }) .catch((err) => - this.context.setCurrentError(err.response?.data.errors[0]) + useContext(Context).setCurrentError(err.response?.data.errors[0]) ); }; - renderMain = () => { - if (this.state.loading || !this.state.version) { + const renderMain = () => { + if (loading || !version) { return ; } // if logged in but not verified, block until email verification if ( - !this.state.local && - this.state.isLoggedIn && - !this.state.isEmailVerified + !local && + isLoggedIn && + !isEmailVerified ) { return ( { - return ; + return ; }} /> @@ -149,10 +150,10 @@ export default class Main extends Component { // Handle case where new user signs up via OAuth and has not set name and company if ( - this.state.version === "production" && - !this.state.hasInfo && - this.state.userId > 9312 && - this.state.isLoggedIn + version === "production" && + !hasInfo && + userId > 9312 && + isLoggedIn ) { return ( @@ -161,8 +162,8 @@ export default class Main extends Component { render={() => { return ( ); }} @@ -176,8 +177,8 @@ export default class Main extends Component { { - if (!this.state.isLoggedIn) { - return ; + if (!isLoggedIn) { + return ; } else { return ; } @@ -186,8 +187,8 @@ export default class Main extends Component { { - if (!this.state.isLoggedIn) { - return ; + if (!isLoggedIn) { + return ; } else { return ; } @@ -196,7 +197,7 @@ export default class Main extends Component { { - if (!this.state.isLoggedIn) { + if (!isLoggedIn) { return ; } else { return ; @@ -206,7 +207,7 @@ export default class Main extends Component { { - if (!this.state.isLoggedIn) { + if (!isLoggedIn) { return ; } else { return ; @@ -217,7 +218,7 @@ export default class Main extends Component { exact path="/" render={() => { - if (this.state.isLoggedIn) { + if (isLoggedIn) { return ; } else { return ; @@ -229,17 +230,17 @@ export default class Main extends Component { render={(routeProps) => { const baseRoute = routeProps.match.params.baseRoute; if ( - this.state.isLoggedIn && - this.state.initialized && + isLoggedIn && + initialized && PorterUrls.includes(baseRoute) ) { return ( ); } else { @@ -251,14 +252,12 @@ export default class Main extends Component { ); }; - render() { - return ( - <> - {this.renderMain()} - - - ); - } + return ( + <> + {renderMain()} + + + ); } -Main.contextType = Context; +export default Main; From cc7b9664832f5b4c7ed9809d24d32717e01440f5 Mon Sep 17 00:00:00 2001 From: "sweep-ai[bot]" <128439645+sweep-ai[bot]@users.noreply.github.com> Date: Wed, 26 Jul 2023 17:04:05 +0000 Subject: [PATCH 2/2] Update dashboard/src/main/Main.tsx --- dashboard/src/main/Main.tsx | 48 +++++++++++++++++++++++++++---------- 1 file changed, 36 insertions(+), 12 deletions(-) diff --git a/dashboard/src/main/Main.tsx b/dashboard/src/main/Main.tsx index c5d1bdd654..a7b5412228 100644 --- a/dashboard/src/main/Main.tsx +++ b/dashboard/src/main/Main.tsx @@ -37,15 +37,19 @@ const Main: React.FC = () => { const [userId, setUserId] = useState(null); const [version, setVersion] = useState(null); + const context = useContext(Context); + useEffect(() => { // Get capabilities to case on user info requirements api.getMetadata("", {}, {}) .then((res) => { - setVersion(res.data?.version); + if (res.data?.version !== version) { + setVersion(res.data?.version); + } }) .catch((err) => console.log(err)); - let { setUser, setCurrentError } = useContext(Context); + let { setUser, setCurrentError } = context; let urlParams = new URLSearchParams(window.location.search); let error = urlParams.get("error"); error && setCurrentError(error); @@ -54,20 +58,40 @@ const Main: React.FC = () => { .then((res) => { if (res && res?.data) { setUser(res.data.id, res.data.email); - setIsLoggedIn(true); - setIsEmailVerified(res.data.email_verified); - setInitialized(true); - setHasInfo(res.data.company_name && true); - setLoading(false); - setUserId(res.data.id); + if (!isLoggedIn) { + setIsLoggedIn(true); + } + if (!isEmailVerified) { + setIsEmailVerified(res.data.email_verified); + } + if (!initialized) { + setInitialized(true); + } + if (!hasInfo) { + setHasInfo(res.data.company_name && true); + } + if (loading) { + setLoading(false); + } + if (userId !== res.data.id) { + setUserId(res.data.id); + } } else { - setIsLoggedIn(false); - setLoading(false); + if (isLoggedIn) { + setIsLoggedIn(false); + } + if (loading) { + setLoading(false); + } } }) .catch((err) => { - setIsLoggedIn(false); - setLoading(false); + if (isLoggedIn) { + setIsLoggedIn(false); + } + if (loading) { + setLoading(false); + } }); api