fix apis, add more features

Author: wiseaidev

public/banner.png

@@ -6,6 +6,7 @@ import { ThemeProvider, createTheme } from "@mui/material/styles";
 import { indigo, pink } from "@mui/material/colors";
 import { useNylas } from "@nylas/nylas-react";
 import { userGetToken } from "@app/store/authReducer/actions";
+import Loading from "@app/pages/Loading";
 
 const theme = createTheme({
   breakpoints: {
@@ -225,12 +226,16 @@ const darkTheme = createTheme({
 const App = () => {
   const { loading, currentUser, error } = useSelector((state) => state.auth);
   const [currentAuthUser, setCurrentAuthUser] = useState(currentUser);
+  const [currentLanguage, setCurrentLanguage] = useState(null);
   const [currentTheme, setCurrentTheme] = useState("light");
 
   const dispatch = useDispatch();
   const Landing = lazy(() => import("@app/pages/Landing"));
   const Login = lazy(() => import("@app/pages/Login"));
   const MailApp = lazy(() => import("@app/pages/MailApp"));
+  const ProgrammingLanguages = lazy(() =>
+    import("@app/pages/ProgrammingLanguages")
+  );
 
   const nylas = useNylas();
 
@@ -240,6 +245,7 @@ const App = () => {
 
   useEffect(() => {
     setCurrentAuthUser(JSON.parse(localStorage.getItem("user")));
+    setCurrentLanguage(localStorage.getItem("language"));
   }, []);
 
   useEffect(() => {
@@ -251,18 +257,20 @@ const App = () => {
       dispatch(userGetToken({ nylas: nylas }));
     }
   }, [nylas]);
-
+  console.log(currentAuthUser);
   return (
-    <ThemeProvider theme={currentTheme === "light" ? theme : darkTheme}>
-      <Suspense>
+    <ThemeProvider theme={theme}>
+      <Suspense fallback={<Loading />}>
         <Routes>
           <Route
             exact
             path="/"
             element={
               <>
-                {currentAuthUser ? (
+                {currentLanguage && currentAuthUser ? (
                   <Navigate to={"/mail"} replace />
+                ) : !currentLanguage && currentAuthUser ? (
+                  <Navigate to={"/select"} replace />
                 ) : (
                   <Landing />
                 )}
@@ -274,6 +282,19 @@ const App = () => {
             path="/mail"
             element={<>{currentAuthUser ? <MailApp /> : <Login />}</>}
           />
+          <Route
+            exact
+            path="/select"
+            element={
+              <>
+                {!currentLanguage && currentAuthUser ? (
+                  <ProgrammingLanguages />
+                ) : (
+                  <Login />
+                )}
+              </>
+            }
+          />
           <Route
             exact
             path="/login"

public/features.png

@@ -178,19 +178,18 @@ const AppHeader = ({ viewMode, handleViewModeChange }) => {
         <IconButton onClick={(e) => handleViewModeChange(e.target.value)}>
           <MenuIcon />
         </IconButton>
-        <Typography
-          variant="h1"
-          component="div"
+        <Box
+          component="img"
           sx={{
             color: theme.palette.text.primary,
+            height: "50px",
             cursor: "pointer",
             [theme.breakpoints.up("sm")]: {
               marginLeft: 8,
             },
           }}
-        >
-          Emails
-        </Typography>
+          src="/main-logo.png"
+        />
       </Box>
 
       <Box

public/main-logo.png

@@ -97,6 +97,7 @@ const Banner = () => {
         color: theme.palette.text.primary,
         backgroundColor: theme.palette.background.paper,
         padding: theme.spacing(10),
+        paddingTop: theme.spacing(50),
       }}
     >
       <Container>

public/nylas-logo.png

@@ -15,7 +15,7 @@ const CallToAction = () => {
     <Box
       sx={{
         background: "#0D1549",
-        padding: theme.spacing(6, 0), // Adjusted top and bottom padding
+        padding: theme.spacing(6, 0),
       }}
     >
       <Container>
@@ -36,11 +36,11 @@ const CallToAction = () => {
           </Grid>
           <Grid item md={3} xs={12} sx={{ textAlign: "center" }}>
             <Button
-              href="#"
+              href="/login"
               sx={{
-                margin: "0 auto", // Center the button horizontally
-                width: "40%", // Make the button width 100% of its container
-                padding: theme.spacing(2), // Adjusted padding for the button
+                margin: "0 auto",
+                width: "40%",
+                padding: theme.spacing(2),
                 borderRadius: "50px",
                 fontSize: "16px",
                 textTransform: "capitalize",

public/nylas-logo.svg

@@ -75,7 +75,7 @@ const Faq = () => {
             mt: theme.spacing(3),
           }}
         >
-          Frequently Asked Questions
+          ❓ Frequently Asked Questions
         </Typography>
         {faqData.map((item) => (
           <Box