From ebccfb18cd1647f5d1074b1486ab30dcb736725d Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Tue, 3 May 2022 19:50:01 +0530 Subject: [PATCH 01/19] test-pull req --- dashboard/src/routes/index.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/dashboard/src/routes/index.tsx b/dashboard/src/routes/index.tsx index 30cec3a..61690a0 100644 --- a/dashboard/src/routes/index.tsx +++ b/dashboard/src/routes/index.tsx @@ -23,10 +23,12 @@ export const AppRoutes = () => { } > - } /> - } /> - } /> - } /> + }> + } /> + } /> + + } /> + } /> From c783e101d555dc7a116fcc65b29672d619637600 Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Tue, 3 May 2022 19:53:21 +0530 Subject: [PATCH 02/19] test-pull req --- dashboard/src/routes/index.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/dashboard/src/routes/index.tsx b/dashboard/src/routes/index.tsx index 61690a0..8443372 100644 --- a/dashboard/src/routes/index.tsx +++ b/dashboard/src/routes/index.tsx @@ -23,12 +23,12 @@ export const AppRoutes = () => { } > - }> - } /> - } /> - - } /> - } /> + }> + } /> + } /> + + } /> + } /> From 7c5aab7bf35c4fac4b06e3620e91ef4f049e0141 Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Sat, 7 May 2022 22:10:29 +0530 Subject: [PATCH 03/19] all components updated, uncontrolled input error handled --- dashboard/src/App.tsx | 3 + .../components/EnvComponents/AccessToken.tsx | 65 + .../EnvComponents/DatabaseCredentials.tsx | 88 ++ .../EnvComponents/DomainWhitelisting.tsx | 35 + .../EnvComponents/EmailConfiguration.tsx | 114 ++ .../EnvComponents/JWTConfiguration.tsx | 154 +++ .../components/EnvComponents/OAuthConfig.tsx | 191 +++ .../EnvComponents/OrganizationInfo.tsx | 60 + .../src/components/EnvComponents/Roles.tsx | 67 + .../EnvComponents/SecurityAdminSecret.tsx | 138 ++ .../EnvComponents/SessionStorage.tsx | 36 + .../EnvComponents/SocialMediaLogin.tsx | 80 ++ .../EnvComponents/UICustomization.tsx | 80 ++ dashboard/src/components/InputField.tsx | 19 +- dashboard/src/components/Menu.tsx | 539 +++++--- dashboard/src/pages/Environment.tsx | 1139 +++++------------ dashboard/src/routes/index.tsx | 2 + 17 files changed, 1765 insertions(+), 1045 deletions(-) create mode 100644 dashboard/src/components/EnvComponents/AccessToken.tsx create mode 100644 dashboard/src/components/EnvComponents/DatabaseCredentials.tsx create mode 100644 dashboard/src/components/EnvComponents/DomainWhitelisting.tsx create mode 100644 dashboard/src/components/EnvComponents/EmailConfiguration.tsx create mode 100644 dashboard/src/components/EnvComponents/JWTConfiguration.tsx create mode 100644 dashboard/src/components/EnvComponents/OAuthConfig.tsx create mode 100644 dashboard/src/components/EnvComponents/OrganizationInfo.tsx create mode 100644 dashboard/src/components/EnvComponents/Roles.tsx create mode 100644 dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx create mode 100644 dashboard/src/components/EnvComponents/SessionStorage.tsx create mode 100644 dashboard/src/components/EnvComponents/SocialMediaLogin.tsx create mode 100644 dashboard/src/components/EnvComponents/UICustomization.tsx diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx index 001e7a9..c8ac2cf 100644 --- a/dashboard/src/App.tsx +++ b/dashboard/src/App.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { Fragment } from "react" import { ChakraProvider, extendTheme } from '@chakra-ui/react'; import { BrowserRouter } from 'react-router-dom'; import { createClient, Provider } from 'urql'; @@ -36,6 +37,7 @@ const theme = extendTheme({ export default function App() { return ( + @@ -45,5 +47,6 @@ export default function App() { + ); } diff --git a/dashboard/src/components/EnvComponents/AccessToken.tsx b/dashboard/src/components/EnvComponents/AccessToken.tsx new file mode 100644 index 0000000..9fba521 --- /dev/null +++ b/dashboard/src/components/EnvComponents/AccessToken.tsx @@ -0,0 +1,65 @@ +import React from "react"; +import { Flex, Stack, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../../components/InputField"; +import { TextInputType, TextAreaInputType } from "../../constants"; + +const AccessToken = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Access Token + + + + + Access Token Expiry Time: + + + + + + + + Custom Scripts: + + (Used to add custom fields in ID token) + + + + + + + +
+ ); +}; + +export default AccessToken; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/DatabaseCredentials.tsx b/dashboard/src/components/EnvComponents/DatabaseCredentials.tsx new file mode 100644 index 0000000..12c85e1 --- /dev/null +++ b/dashboard/src/components/EnvComponents/DatabaseCredentials.tsx @@ -0,0 +1,88 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; + +import InputField from "../../components/InputField"; +import { TextInputType } from "../../constants"; + +const DatabaseCredentials = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Database Credentials + + + + Note: Database related environment variables cannot be updated from + dashboard :( + + + + DataBase Name: + +
+ +
+ + + + DataBase Type: + +
+ +
+ + + + DataBase URL: + +
+ +
+ + +
+ ); +}; + +export default DatabaseCredentials; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/DomainWhitelisting.tsx b/dashboard/src/components/EnvComponents/DomainWhitelisting.tsx new file mode 100644 index 0000000..d7ed13f --- /dev/null +++ b/dashboard/src/components/EnvComponents/DomainWhitelisting.tsx @@ -0,0 +1,35 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../../components/InputField"; +import { ArrayInputType} from "../../constants"; + +const DomainWhiteListing = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Domain White Listing + + + + + Allowed Origins: + +
+ +
+ + +
+ ); +}; + +export default DomainWhiteListing; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/EmailConfiguration.tsx b/dashboard/src/components/EnvComponents/EmailConfiguration.tsx new file mode 100644 index 0000000..17a1eed --- /dev/null +++ b/dashboard/src/components/EnvComponents/EmailConfiguration.tsx @@ -0,0 +1,114 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../../components/InputField"; +import { TextInputType, HiddenInputType} from "../../constants"; +const EmailConfigurations = ({ + variables, + setVariables, + fieldVisibility, + setFieldVisibility, +}: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Email Configurations + + + + + SMTP Host: + +
+ +
+ + + + SMTP Port: + +
+ +
+ + + + SMTP Username: + +
+ +
+ + + + SMTP Password: + +
+ +
+ + + + From Email: + +
+ +
+ + +
+ ); +}; + +export default EmailConfigurations; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/JWTConfiguration.tsx b/dashboard/src/components/EnvComponents/JWTConfiguration.tsx new file mode 100644 index 0000000..4424725 --- /dev/null +++ b/dashboard/src/components/EnvComponents/JWTConfiguration.tsx @@ -0,0 +1,154 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; +import { + HiddenInputType, + TextInputType, + TextAreaInputType, +} from "../../constants"; +import GenerateKeysModal from "../GenerateKeysModal"; +import InputField from "../InputField"; + +const JSTConfigurations = ({ + variables, + setVariables, + fieldVisibility, + setFieldVisibility, + SelectInputType, + getData, + HMACEncryptionType, + RSAEncryptionType, + ECDSAEncryptionType, +}: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + + return ( +
+ {" "} + + + JWT (JSON Web Tokens) Configurations + + + + + + + + + JWT Type: + + + + + + {Object.values(HMACEncryptionType).includes(variables.JWT_TYPE) ? ( + + + JWT Secret + +
+ +
+ + ) : ( + <> + + + Public Key + +
+ +
+ + + + Private Key + +
+ +
+ + + )} + + + + JWT Role Claim: + + +
+ +
+ + +
+ ); +}; + +export default JSTConfigurations; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/OAuthConfig.tsx b/dashboard/src/components/EnvComponents/OAuthConfig.tsx new file mode 100644 index 0000000..b06d595 --- /dev/null +++ b/dashboard/src/components/EnvComponents/OAuthConfig.tsx @@ -0,0 +1,191 @@ +import React from "react"; +import InputField from "../InputField"; +import { + Flex, + Stack, + Center, + Text, + Box, + Divider, + useMediaQuery, +} from "@chakra-ui/react"; +import { FaGoogle, FaGithub, FaFacebookF } from "react-icons/fa"; +import { TextInputType, HiddenInputType } from "../../constants"; + +const OAuthConfig = ({ + envVariables, + setVariables, + fieldVisibility, + setFieldVisibility, +}: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:667px)"); + return ( +
+ + + Your instance information + + + + + Client ID + +
+ {}} + inputType={TextInputType.CLIENT_ID} + placeholder="Client ID" + readOnly={true} + /> +
+ + + + Client Secret + +
+ +
+ + + + {/* ################ SOCIAL MEDIA LOGIN ################ */} + + Social Media Logins + + + +
+ +
+
+ +
+
+ +
+ + +
+ +
+
+ +
+
+ +
+ + +
+ +
+
+ +
+
+ +
+ + + +
+ ); +}; + +export default OAuthConfig; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/OrganizationInfo.tsx b/dashboard/src/components/EnvComponents/OrganizationInfo.tsx new file mode 100644 index 0000000..c5f7e36 --- /dev/null +++ b/dashboard/src/components/EnvComponents/OrganizationInfo.tsx @@ -0,0 +1,60 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../InputField"; +import { TextInputType } from "../../constants"; + +const OrganizationInfo = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Organization Information + + + + + Organization Name: + +
+ +
+ + + + Organization Logo: + +
+ +
+ + +
+ ); +}; + +export default OrganizationInfo; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/Roles.tsx b/dashboard/src/components/EnvComponents/Roles.tsx new file mode 100644 index 0000000..ac610ab --- /dev/null +++ b/dashboard/src/components/EnvComponents/Roles.tsx @@ -0,0 +1,67 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; +import { ArrayInputType } from "../../constants"; +import InputField from "../InputField"; + +const Roles = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Roles + + + + + Roles: + +
+ +
+ + + + Default Roles: + +
+ +
+ + + + Protected Roles: + +
+ +
+ + +
+ ); +}; + +export default Roles; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx b/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx new file mode 100644 index 0000000..b3e27d8 --- /dev/null +++ b/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx @@ -0,0 +1,138 @@ +import React from "react"; +import { + Flex, + Stack, + Center, + Text, + Input, + InputGroup, + InputRightElement, + useMediaQuery, +} from "@chakra-ui/react"; +import { FaRegEyeSlash, FaRegEye } from "react-icons/fa"; +import InputField from "../InputField"; +import { TextInputType, HiddenInputType } from "../../constants"; +const SecurityAdminSecret = ({ + variables, + setVariables, + fieldVisibility, + setFieldVisibility, + validateAdminSecretHandler, + adminSecret, +}: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Security (Admin Secret) + + + + + Old Admin Secret: + +
+ + validateAdminSecretHandler(event)} + type={ + !fieldVisibility[HiddenInputType.OLD_ADMIN_SECRET] + ? "password" + : "text" + } + /> + + {fieldVisibility[HiddenInputType.OLD_ADMIN_SECRET] ? ( +
+ setFieldVisibility({ + ...fieldVisibility, + [HiddenInputType.OLD_ADMIN_SECRET]: false, + }) + } + > + +
+ ) : ( +
+ setFieldVisibility({ + ...fieldVisibility, + [HiddenInputType.OLD_ADMIN_SECRET]: true, + }) + } + > + +
+ )} + + } + /> + +
+ + + + New Admin Secret: + +
+ +
+ + +
+ ); +}; + +export default SecurityAdminSecret; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/SessionStorage.tsx b/dashboard/src/components/EnvComponents/SessionStorage.tsx new file mode 100644 index 0000000..8570f47 --- /dev/null +++ b/dashboard/src/components/EnvComponents/SessionStorage.tsx @@ -0,0 +1,36 @@ +import React from "react"; +import { Flex, Stack, Center, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../InputField"; + +const SessionStorage = ({ variables, setVariables, RedisURL }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Session Storage + + + + + Redis URL: + +
+ +
+ + +
+ ); +}; + +export default SessionStorage; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx b/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx new file mode 100644 index 0000000..38df534 --- /dev/null +++ b/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx @@ -0,0 +1,80 @@ +import React from "react"; +import { Flex, Stack, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../InputField"; +import { SwitchInputType } from "../../constants"; + +const UICustomization = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Disable Features + + + + + Disable Login Page: + + + + + + + + Disable Email Verification: + + + + + + + + Disable Magic Login Link: + + + + + + + + Disable Basic Authentication: + + + + + + + + Disable Sign Up: + + + + + + +
+ ); +}; + +export default UICustomization; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/UICustomization.tsx b/dashboard/src/components/EnvComponents/UICustomization.tsx new file mode 100644 index 0000000..38df534 --- /dev/null +++ b/dashboard/src/components/EnvComponents/UICustomization.tsx @@ -0,0 +1,80 @@ +import React from "react"; +import { Flex, Stack, Text, useMediaQuery } from "@chakra-ui/react"; +import InputField from "../InputField"; +import { SwitchInputType } from "../../constants"; + +const UICustomization = ({ variables, setVariables }: any) => { + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( +
+ {" "} + + Disable Features + + + + + Disable Login Page: + + + + + + + + Disable Email Verification: + + + + + + + + Disable Magic Login Link: + + + + + + + + Disable Basic Authentication: + + + + + + + + Disable Sign Up: + + + + + + +
+ ); +}; + +export default UICustomization; \ No newline at end of file diff --git a/dashboard/src/components/InputField.tsx b/dashboard/src/components/InputField.tsx index ede074d..8e58189 100644 --- a/dashboard/src/components/InputField.tsx +++ b/dashboard/src/components/InputField.tsx @@ -116,7 +116,7 @@ const InputField = ({ 3 ? "scroll" : "hidden"} + overflowY="hidden" + justifyContent="start" + alignItems="center" > {variables[inputType].map((role: string, index: number) => ( @@ -220,7 +221,7 @@ const InputField = ({ size="xs" minW="150px" placeholder="add a new value" - value={inputData[inputType]} + value={inputData[inputType] ?? ''} onChange={(e: any) => { setInputData({ ...inputData, [inputType]: e.target.value }); }} diff --git a/dashboard/src/components/Menu.tsx b/dashboard/src/components/Menu.tsx index a8e2fdd..8c1883b 100644 --- a/dashboard/src/components/Menu.tsx +++ b/dashboard/src/components/Menu.tsx @@ -1,233 +1,362 @@ -import React, { ReactNode } from 'react'; +import React, { ReactNode } from "react"; import { - IconButton, - Box, - CloseButton, - Flex, - Image, - HStack, - VStack, - Icon, - useColorModeValue, - Link, - Text, - BoxProps, - FlexProps, - Menu, - MenuButton, - MenuItem, - MenuList, -} from '@chakra-ui/react'; + IconButton, + Box, + CloseButton, + Flex, + Image, + HStack, + VStack, + Icon, + useColorModeValue, + Link, + Text, + BoxProps, + FlexProps, + Menu, + MenuButton, + MenuItem, + MenuList, + Accordion, + AccordionButton, + AccordionPanel, + AccordionItem, + AccordionIcon, + useMediaQuery, +} from "@chakra-ui/react"; import { - FiHome, - FiCode, - FiSettings, - FiMenu, - FiUser, - FiUsers, - FiChevronDown, -} from 'react-icons/fi'; -import { IconType } from 'react-icons'; -import { ReactText } from 'react'; -import { useMutation, useQuery } from 'urql'; -import { NavLink, useNavigate, useLocation } from 'react-router-dom'; -import { useAuthContext } from '../contexts/AuthContext'; -import { AdminLogout } from '../graphql/mutation'; -import { MetaQuery } from '../graphql/queries'; + FiHome, + FiUser, + FiGlobe, + FiCode, + FiSettings, + FiMenu, + FiUsers, + FiChevronDown, + FiShieldOff, +} from "react-icons/fi"; +import { BiCustomize } from "react-icons/bi"; +import { FcDatabase } from "react-icons/fc"; +import { AiOutlineKey } from "react-icons/ai"; +import { SiOpenaccess, SiJsonwebtokens } from "react-icons/si"; +import { MdSecurity } from "react-icons/md"; +import { RiSkullLine } from "react-icons/ri"; +import { RiDatabase2Line } from "react-icons/ri"; +import { BsCheck2Circle } from "react-icons/bs"; +import { HiOutlineMail, HiOutlineOfficeBuilding } from "react-icons/hi"; +import { IconType } from "react-icons"; +import { ReactText } from "react"; +import { useMutation, useQuery } from "urql"; +import { NavLink, useNavigate, useLocation } from "react-router-dom"; +import { useAuthContext } from "../contexts/AuthContext"; +import { AdminLogout } from "../graphql/mutation"; +import { MetaQuery } from "../graphql/queries"; + +interface SubRoutes { + name: string; + icon: IconType; + route: string; +} interface LinkItemProps { - name: string; - icon: IconType; - route: string; + name: string; + icon: IconType; + route: string; + subRoutes?: SubRoutes[]; } const LinkItems: Array = [ - // { name: 'Home', icon: FiHome, route: '/' }, - { name: 'Environment Variables', icon: FiSettings, route: '/' }, - { name: 'Users', icon: FiUsers, route: '/users' }, + { + name: "Environment ", + icon: FiSettings, + route: "/", + subRoutes: [ + { + name: "OAuth Config", + icon: AiOutlineKey, + route: "/oauth-setting", + }, + + { name: "Roles", icon: FiUser, route: "/roles" }, + { + name: "JWT Secrets", + icon: SiJsonwebtokens, + route: "/jwt-config", + }, + { + name: "Session Storage", + icon: RiDatabase2Line, + route: "/session-storage", + }, + { + name: "Email Configurations", + icon: HiOutlineMail, + route: "/email-config", + }, + { + name: "Domain White Listing", + icon: BsCheck2Circle, + route: "/whitelist-variables", + }, + { + name: "Organization Info", + icon: HiOutlineOfficeBuilding, + route: "/organization-info", + }, + { name: "Access Token", icon: SiOpenaccess, route: "/access-token" }, + { + name: "UI Customization", + icon: BiCustomize, + route: "/ui-customization", + }, + { name: "Database", icon: RiDatabase2Line, route: "/db-cred" }, + { + name: " Security", + icon: MdSecurity, + route: "/admin-secret", + }, + ], + }, + { name: "Users", icon: FiUsers, route: "/users" }, + // { name: "AUsers", icon: FiUsers, route: "/usersa" }, ]; interface SidebarProps extends BoxProps { - onClose: () => void; + onClose: () => void; } export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { - const { pathname } = useLocation(); - const [{ fetching, data }] = useQuery({ query: MetaQuery }); - return ( - - - - - logo - - AUTHORIZER - - - - - - {LinkItems.map((link) => ( - - - {link.name} - - - ))} + const { pathname } = useLocation(); + const [{ fetching, data }] = useQuery({ query: MetaQuery }); + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + return ( + + + + + logo + + AUTHORIZER + + + + + - - API Playground - + + + {LinkItems.map((link) => + link?.subRoutes ? ( + + + + + {link.name} + + + + + + + + {link.subRoutes?.map((sublink) => ( + + {" "} + + + {sublink.name} + {" "} + + + ))} + + + ) : ( + + {" "} + + + {link.name} + {" "} + + + ) + )} + + API Playground + + + - {data?.meta?.version && ( - - Current Version: {data.meta.version} - - )} - - ); + {data?.meta?.version && ( + + {" "} + + Current Version: {data.meta.version} + + + )} + + ); }; interface NavItemProps extends FlexProps { - icon: IconType; - children: ReactText; + icon: IconType; + children: ReactText; } export const NavItem = ({ icon, children, ...rest }: NavItemProps) => { - return ( - - {icon && ( - - )} - {children} - - ); + return ( + + {icon && ( + + )} + {children} + + ); }; interface MobileProps extends FlexProps { - onOpen: () => void; + onOpen: () => void; } export const MobileNav = ({ onOpen, ...rest }: MobileProps) => { - const [_, logout] = useMutation(AdminLogout); - const { setIsLoggedIn } = useAuthContext(); - const navigate = useNavigate(); + const [_, logout] = useMutation(AdminLogout); + const { setIsLoggedIn } = useAuthContext(); + const navigate = useNavigate(); - const handleLogout = async () => { - await logout(); - setIsLoggedIn(false); - navigate('/', { replace: true }); - }; + const handleLogout = async () => { + await logout(); + setIsLoggedIn(false); + navigate("/", { replace: true }); + }; - return ( - - } - /> + return ( + + } + /> - logo + logo - - - - - - - - Admin - - - - - - - - Sign out - - - - - - ); -}; + + + + + + + + Admin + + + + + + + + Sign out + + + + + + ); +}; \ No newline at end of file diff --git a/dashboard/src/pages/Environment.tsx b/dashboard/src/pages/Environment.tsx index a6ef5a5..db09298 100644 --- a/dashboard/src/pages/Environment.tsx +++ b/dashboard/src/pages/Environment.tsx @@ -1,847 +1,324 @@ -import React, { useEffect } from 'react'; +import React, { useEffect } from "react"; +import { useParams } from "react-router-dom"; +import { Box, Flex, Stack, Button, useToast } from "@chakra-ui/react"; +import { useClient } from "urql"; +import { FaSave } from "react-icons/fa"; +import _ from "lodash"; +import { EnvVariablesQuery } from "../graphql/queries"; import { - Box, - Divider, - Flex, - Stack, - Center, - Text, - Button, - Input, - InputGroup, - InputRightElement, - useToast, -} from '@chakra-ui/react'; -import { useClient } from 'urql'; -import { - FaGoogle, - FaGithub, - FaFacebookF, - FaSave, - FaRegEyeSlash, - FaRegEye, -} from 'react-icons/fa'; -import _ from 'lodash'; -import InputField from '../components/InputField'; -import { EnvVariablesQuery } from '../graphql/queries'; -import { - ArrayInputType, - SelectInputType, - HiddenInputType, - TextInputType, - TextAreaInputType, - SwitchInputType, - HMACEncryptionType, - RSAEncryptionType, - ECDSAEncryptionType, - envVarTypes, -} from '../constants'; -import { UpdateEnvVariables } from '../graphql/mutation'; -import { getObjectDiff, capitalizeFirstLetter } from '../utils'; -import GenerateKeysModal from '../components/GenerateKeysModal'; + SelectInputType, + HiddenInputType, + TextInputType, + HMACEncryptionType, + RSAEncryptionType, + ECDSAEncryptionType, + envVarTypes, +} from "../constants"; +import { UpdateEnvVariables } from "../graphql/mutation"; +import { getObjectDiff, capitalizeFirstLetter } from "../utils"; +// Component inputs +import OAuthConfig from "../components/EnvComponents/OAuthConfig"; +import Roles from "../components/EnvComponents/Roles"; +import JWTConfigurations from "../components/EnvComponents/JWTConfiguration"; +import SessionStorage from "../components/EnvComponents/SessionStorage"; +import EmailConfigurations from "../components/EnvComponents/EmailConfiguration"; +import DomainWhiteListing from "../components/EnvComponents/DomainWhitelisting"; +import OrganizationInfo from "../components/EnvComponents/OrganizationInfo"; +import AccessToken from "../components/EnvComponents/AccessToken"; +import UICustomization from "../components/EnvComponents/UICustomization" +import SecurityAdminSecret from "../components/EnvComponents/SecurityAdminSecret"; +import DatabaseCredentials from "../components/EnvComponents/DatabaseCredentials"; -export default function Environment() { - const client = useClient(); - const toast = useToast(); - const [adminSecret, setAdminSecret] = React.useState< - Record - >({ - value: '', - disableInputField: true, - }); - const [loading, setLoading] = React.useState(true); - const [envVariables, setEnvVariables] = React.useState({ - GOOGLE_CLIENT_ID: '', - GOOGLE_CLIENT_SECRET: '', - GITHUB_CLIENT_ID: '', - GITHUB_CLIENT_SECRET: '', - FACEBOOK_CLIENT_ID: '', - FACEBOOK_CLIENT_SECRET: '', - ROLES: [], - DEFAULT_ROLES: [], - PROTECTED_ROLES: [], - JWT_TYPE: '', - JWT_SECRET: '', - JWT_ROLE_CLAIM: '', - JWT_PRIVATE_KEY: '', - JWT_PUBLIC_KEY: '', - REDIS_URL: '', - SMTP_HOST: '', - SMTP_PORT: '', - SMTP_USERNAME: '', - SMTP_PASSWORD: '', - SENDER_EMAIL: '', - ALLOWED_ORIGINS: [], - ORGANIZATION_NAME: '', - ORGANIZATION_LOGO: '', - CUSTOM_ACCESS_TOKEN_SCRIPT: '', - ADMIN_SECRET: '', - DISABLE_LOGIN_PAGE: false, - DISABLE_MAGIC_LINK_LOGIN: false, - DISABLE_EMAIL_VERIFICATION: false, - DISABLE_BASIC_AUTHENTICATION: false, - DISABLE_SIGN_UP: false, - OLD_ADMIN_SECRET: '', - DATABASE_NAME: '', - DATABASE_TYPE: '', - DATABASE_URL: '', - ACCESS_TOKEN_EXPIRY_TIME: '', - }); +const Environment = () => { + const client = useClient(); + const toast = useToast(); + const [adminSecret, setAdminSecret] = React.useState< + Record + >({ + value: "", + disableInputField: true, + }); + const [loading, setLoading] = React.useState(true); + const [envVariables, setEnvVariables] = React.useState({ + GOOGLE_CLIENT_ID: "", + GOOGLE_CLIENT_SECRET: "", + GITHUB_CLIENT_ID: "", + GITHUB_CLIENT_SECRET: "", + FACEBOOK_CLIENT_ID: "", + FACEBOOK_CLIENT_SECRET: "", + ROLES: [], + DEFAULT_ROLES: [], + PROTECTED_ROLES: [], + JWT_TYPE: "", + JWT_SECRET: "", + JWT_ROLE_CLAIM: "", + JWT_PRIVATE_KEY: "", + JWT_PUBLIC_KEY: "", + REDIS_URL: "", + SMTP_HOST: "", + SMTP_PORT: "", + SMTP_USERNAME: "", + SMTP_PASSWORD: "", + SENDER_EMAIL: "", + ALLOWED_ORIGINS: [], + ORGANIZATION_NAME: "", + ORGANIZATION_LOGO: "", + CUSTOM_ACCESS_TOKEN_SCRIPT: "", + ADMIN_SECRET: "", + DISABLE_LOGIN_PAGE: false, + DISABLE_MAGIC_LINK_LOGIN: false, + DISABLE_EMAIL_VERIFICATION: false, + DISABLE_BASIC_AUTHENTICATION: false, + DISABLE_SIGN_UP: false, + OLD_ADMIN_SECRET: "", + DATABASE_NAME: "", + DATABASE_TYPE: "", + DATABASE_URL: "", + ACCESS_TOKEN_EXPIRY_TIME: "", + }); - const [fieldVisibility, setFieldVisibility] = React.useState< - Record - >({ - GOOGLE_CLIENT_SECRET: false, - GITHUB_CLIENT_SECRET: false, - FACEBOOK_CLIENT_SECRET: false, - JWT_SECRET: false, - SMTP_PASSWORD: false, - ADMIN_SECRET: false, - OLD_ADMIN_SECRET: false, - }); + const [fieldVisibility, setFieldVisibility] = React.useState< + Record + >({ + GOOGLE_CLIENT_SECRET: false, + GITHUB_CLIENT_SECRET: false, + FACEBOOK_CLIENT_SECRET: false, + JWT_SECRET: false, + SMTP_PASSWORD: false, + ADMIN_SECRET: false, + OLD_ADMIN_SECRET: false, + }); - async function getData() { - const { - data: { _env: envData }, - } = await client.query(EnvVariablesQuery).toPromise(); - setLoading(false); - setEnvVariables({ - ...envData, - OLD_ADMIN_SECRET: envData.ADMIN_SECRET, - ADMIN_SECRET: '', - }); - setAdminSecret({ - value: '', - disableInputField: true, - }); - } + const { sec } = useParams(); - useEffect(() => { - getData(); - }, []); + async function getData() { + const { + data: { _env: envData }, + } = await client.query(EnvVariablesQuery).toPromise(); + setLoading(false); - const validateAdminSecretHandler = (event: any) => { - if (envVariables.OLD_ADMIN_SECRET === event.target.value) { - setAdminSecret({ - ...adminSecret, - value: event.target.value, - disableInputField: false, - }); - } else { - setAdminSecret({ - ...adminSecret, - value: event.target.value, - disableInputField: true, - }); - } - if (envVariables.ADMIN_SECRET !== '') { - setEnvVariables({ ...envVariables, ADMIN_SECRET: '' }); - } - }; + setEnvVariables({ + ...envData, + OLD_ADMIN_SECRET: envData.ADMIN_SECRET, + ADMIN_SECRET: "", + }); + setAdminSecret({ + value: "", + disableInputField: true, + }); + } - const saveHandler = async () => { - setLoading(true); - const { - data: { _env: envData }, - } = await client.query(EnvVariablesQuery).toPromise(); - const diff = getObjectDiff(envVariables, envData); - const updatedEnvVariables = diff.reduce( - (acc: any, property: string) => ({ - ...acc, - // @ts-ignore - [property]: envVariables[property], - }), - {} - ); - if ( - updatedEnvVariables[HiddenInputType.ADMIN_SECRET] === '' || - updatedEnvVariables[HiddenInputType.OLD_ADMIN_SECRET] !== - envData.ADMIN_SECRET - ) { - delete updatedEnvVariables.OLD_ADMIN_SECRET; - delete updatedEnvVariables.ADMIN_SECRET; - } + useEffect(() => { + getData(); + }, [sec]); - delete updatedEnvVariables.DATABASE_URL; - delete updatedEnvVariables.DATABASE_TYPE; - delete updatedEnvVariables.DATABASE_NAME; + const validateAdminSecretHandler = (event: any) => { + if (envVariables.OLD_ADMIN_SECRET === event.target.value) { + setAdminSecret({ + ...adminSecret, + value: event.target.value, + disableInputField: false, + }); + } else { + setAdminSecret({ + ...adminSecret, + value: event.target.value, + disableInputField: true, + }); + } + if (envVariables.ADMIN_SECRET !== "") { + setEnvVariables({ ...envVariables, ADMIN_SECRET: "" }); + } + }; - const res = await client - .mutation(UpdateEnvVariables, { params: updatedEnvVariables }) - .toPromise(); + const saveHandler = async () => { + setLoading(true); + const { + data: { _env: envData }, + } = await client.query(EnvVariablesQuery).toPromise(); + const diff = getObjectDiff(envVariables, envData); + const updatedEnvVariables = diff.reduce( + (acc: any, property: string) => ({ + ...acc, + // @ts-ignore + [property]: envVariables[property], + }), + {} + ); + if ( + updatedEnvVariables[HiddenInputType.ADMIN_SECRET] === "" || + updatedEnvVariables[HiddenInputType.OLD_ADMIN_SECRET] !== + envData.ADMIN_SECRET + ) { + delete updatedEnvVariables.OLD_ADMIN_SECRET; + delete updatedEnvVariables.ADMIN_SECRET; + } - setLoading(false); + delete updatedEnvVariables.DATABASE_URL; + delete updatedEnvVariables.DATABASE_TYPE; + delete updatedEnvVariables.DATABASE_NAME; - if (res.error) { - toast({ - title: capitalizeFirstLetter(res.error.message), - isClosable: true, - status: 'error', - position: 'bottom-right', - }); + const res = await client + .mutation(UpdateEnvVariables, { params: updatedEnvVariables }) + .toPromise(); - return; - } + setLoading(false); - setAdminSecret({ - value: '', - disableInputField: true, - }); + if (res.error) { + toast({ + title: capitalizeFirstLetter(res.error.message), + isClosable: true, + status: "error", + position: "bottom-right", + }); - getData(); + return; + } - toast({ - title: `Successfully updated ${ - Object.keys(updatedEnvVariables).length - } variables`, - isClosable: true, - status: 'success', - position: 'bottom-right', - }); - }; + setAdminSecret({ + value: "", + disableInputField: true, + }); - return ( - - - Your instance information - - - - - Client ID - -
- {}} - inputType={TextInputType.CLIENT_ID} - placeholder="Client ID" - readOnly={true} - /> -
- - - - Client Secret - -
- -
- - - - - Social Media Logins - - - -
- -
-
- -
-
- -
- - -
- -
-
- -
-
- -
- - -
- -
-
- -
-
- -
- - - - - Roles - - - - - Roles: - -
- -
- - - - Default Roles: - -
- -
- - - - Protected Roles: - -
- -
- - - - - - JWT (JSON Web Tokens) Configurations - - - - - - - - - JWT Type: - - - - - - {Object.values(HMACEncryptionType).includes(envVariables.JWT_TYPE) ? ( - - - JWT Secret - -
- -
- - ) : ( - <> - - - Public Key - -
- -
- - - - Private Key - -
- -
- - - )} - - - JWT Role Claim: - -
- -
- - - - - Session Storage - - - - - Redis URL: - -
- -
- - - - - Email Configurations - - - - - SMTP Host: - -
- -
- - - - SMTP Port: - -
- -
- - - - SMTP Username: - -
- -
- - - - SMTP Password: - -
- -
- - - - From Email: - -
- -
- - - - - White Listing - - - - - Allowed Origins: - -
- -
- - - - - Organization Information - - - - - Organization Name: - -
- -
- - - - Organization Logo: - -
- -
- - - - - Access Token - - - - - Access Token Expiry Time: - - - - - - - - Custom Scripts: - Used to add custom fields in ID token - - - - - - - - - Disable Features - - - - - Disable Login Page: - - - - - - - - Disable Email Verification: - - - - - - - - Disable Magic Login Link: - - - - - - - - Disable Basic Authentication: - - - - - - - - Disable Sign Up: - - - - - - - - - Danger - - - - - Note: Database related environment variables cannot be updated from - dashboard :( - - - - DataBase Name: - -
- -
- - - - DataBase Type: - -
- -
- - - - DataBase URL: - -
- -
- - - - - Old Admin Secret: - -
- - validateAdminSecretHandler(event)} - type={ - !fieldVisibility[HiddenInputType.OLD_ADMIN_SECRET] - ? 'password' - : 'text' - } - /> - - {fieldVisibility[HiddenInputType.OLD_ADMIN_SECRET] ? ( -
- setFieldVisibility({ - ...fieldVisibility, - [HiddenInputType.OLD_ADMIN_SECRET]: false, - }) - } - > - -
- ) : ( -
- setFieldVisibility({ - ...fieldVisibility, - [HiddenInputType.OLD_ADMIN_SECRET]: true, - }) - } - > - -
- )} - - } - /> - -
- - - - New Admin Secret: - -
- -
- - - - - - - - - - ); -} + getData(); + + toast({ + title: `Successfully updated ${ + Object.keys(updatedEnvVariables).length + } variables`, + isClosable: true, + status: "success", + position: "bottom-right", + }); + }; + + const getCorrectScreen = (tab: any) => { + switch (tab) { + case "instance-info": + return ( + + ); + + case "roles": + return ( + + ); + case "jwt-config": + return ( + + ); + case "session-storage": + return ( + + ); + case "email-config": + return ( + + ); + case "whitelist-variables": + return ( + + ); + case "organization-info": + return ( + + ); + case "access-token": + return ( + + ); + case "ui-customization": + return ( + + ); + case "admin-secret": + return ( + + ); + case "db-cred": + return ( + + ); + default: + return ( + + ); + } + }; + return ( + + {getCorrectScreen(sec)} + + + + + + + ); +}; + +export default Environment; \ No newline at end of file diff --git a/dashboard/src/routes/index.tsx b/dashboard/src/routes/index.tsx index 8443372..f611e92 100644 --- a/dashboard/src/routes/index.tsx +++ b/dashboard/src/routes/index.tsx @@ -14,6 +14,7 @@ export const AppRoutes = () => { if (isLoggedIn) { return ( +
}> { +
); } return ( From d9b49ca93284670d3b2048ad4832ef79757fd6d4 Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Sat, 7 May 2022 22:18:04 +0530 Subject: [PATCH 04/19] login page responsive --- dashboard/src/layouts/AuthLayout.tsx | 29 +++++++++++++++++++--------- 1 file changed, 20 insertions(+), 9 deletions(-) diff --git a/dashboard/src/layouts/AuthLayout.tsx b/dashboard/src/layouts/AuthLayout.tsx index dbe51ff..4c2a5c6 100644 --- a/dashboard/src/layouts/AuthLayout.tsx +++ b/dashboard/src/layouts/AuthLayout.tsx @@ -1,18 +1,19 @@ -import { Box, Flex, Image, Text, Spinner } from '@chakra-ui/react'; +import { Box, Flex, Image, Text, Spinner, useMediaQuery, } from '@chakra-ui/react'; import React from 'react'; import { useQuery } from 'urql'; import { MetaQuery } from '../graphql/queries'; export function AuthLayout({ children }: { children: React.ReactNode }) { const [{ fetching, data }] = useQuery({ query: MetaQuery }); + const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); return ( logo - + AUTHORIZER @@ -29,7 +33,14 @@ export function AuthLayout({ children }: { children: React.ReactNode }) { ) : ( <> - + {children} From d5ad4a6e5588aee85140fa9b30beb1161c0fe01b Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Sat, 7 May 2022 22:34:26 +0530 Subject: [PATCH 05/19] blue border on navlink removed --- dashboard/package-lock.json | 34 +++++++++++++++++++++++-------- dashboard/package.json | 2 ++ dashboard/src/App.tsx | 10 ++++++--- dashboard/src/components/Menu.tsx | 13 ++++++------ dashboard/src/index.tsx | 1 + 5 files changed, 43 insertions(+), 17 deletions(-) diff --git a/dashboard/package-lock.json b/dashboard/package-lock.json index 7917cfa..41d31f9 100644 --- a/dashboard/package-lock.json +++ b/dashboard/package-lock.json @@ -10,6 +10,7 @@ "license": "ISC", "dependencies": { "@chakra-ui/react": "^1.7.3", + "@emotion/core": "^11.0.0", "@emotion/react": "^11.7.1", "@emotion/styled": "^11.6.0", "@types/react": "^17.0.38", @@ -17,6 +18,7 @@ "@types/react-router-dom": "^5.3.2", "dayjs": "^1.10.7", "esbuild": "^0.14.9", + "focus-visible": "^5.2.0", "framer-motion": "^5.5.5", "graphql": "^16.2.0", "lodash": "^4.17.21", @@ -978,6 +980,11 @@ "stylis": "4.0.13" } }, + "node_modules/@emotion/core": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/@emotion/core/-/core-11.0.0.tgz", + "integrity": "sha512-w4sE3AmHmyG6RDKf6mIbtHpgJUSJ2uGvPQb8VXFL7hFjMPibE8IiehG8cMX3Ztm4svfCQV6KqusQbeIOkurBcA==" + }, "node_modules/@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", @@ -1667,6 +1674,11 @@ "node": ">=10" } }, + "node_modules/focus-visible": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/focus-visible/-/focus-visible-5.2.0.tgz", + "integrity": "sha512-Rwix9pBtC1Nuy5wysTmKy+UjbDJpIfg8eHjw0rjZ1mX4GNLz1Bmd16uDpI3Gk1i70Fgcs8Csg2lPm8HULFg9DQ==" + }, "node_modules/framer-motion": { "version": "5.5.5", "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-5.5.5.tgz", @@ -2517,8 +2529,7 @@ "@chakra-ui/css-reset": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@chakra-ui/css-reset/-/css-reset-1.1.1.tgz", - "integrity": "sha512-+KNNHL4OWqeKia5SL858K3Qbd8WxMij9mWIilBzLD4j2KFrl/+aWFw8syMKth3NmgIibrjsljo+PU3fy2o50dg==", - "requires": {} + "integrity": "sha512-+KNNHL4OWqeKia5SL858K3Qbd8WxMij9mWIilBzLD4j2KFrl/+aWFw8syMKth3NmgIibrjsljo+PU3fy2o50dg==" }, "@chakra-ui/descendant": { "version": "2.1.1", @@ -3038,6 +3049,11 @@ "stylis": "4.0.13" } }, + "@emotion/core": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/@emotion/core/-/core-11.0.0.tgz", + "integrity": "sha512-w4sE3AmHmyG6RDKf6mIbtHpgJUSJ2uGvPQb8VXFL7hFjMPibE8IiehG8cMX3Ztm4svfCQV6KqusQbeIOkurBcA==" + }, "@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", @@ -3117,8 +3133,7 @@ "@graphql-typed-document-node/core": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/@graphql-typed-document-node/core/-/core-3.1.1.tgz", - "integrity": "sha512-NQ17ii0rK1b34VZonlmT2QMJFI70m0TRwbknO/ihlbatXyaktDhN/98vBiUU6kNBPljqGqyIrl2T4nY2RpFANg==", - "requires": {} + "integrity": "sha512-NQ17ii0rK1b34VZonlmT2QMJFI70m0TRwbknO/ihlbatXyaktDhN/98vBiUU6kNBPljqGqyIrl2T4nY2RpFANg==" }, "@popperjs/core": { "version": "2.11.0", @@ -3540,6 +3555,11 @@ "tslib": "^2.0.3" } }, + "focus-visible": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/focus-visible/-/focus-visible-5.2.0.tgz", + "integrity": "sha512-Rwix9pBtC1Nuy5wysTmKy+UjbDJpIfg8eHjw0rjZ1mX4GNLz1Bmd16uDpI3Gk1i70Fgcs8Csg2lPm8HULFg9DQ==" + }, "framer-motion": { "version": "5.5.5", "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-5.5.5.tgz", @@ -3823,8 +3843,7 @@ "react-icons": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz", - "integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==", - "requires": {} + "integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==" }, "react-is": { "version": "16.13.1", @@ -4010,8 +4029,7 @@ "use-callback-ref": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.2.5.tgz", - "integrity": "sha512-gN3vgMISAgacF7sqsLPByqoePooY3n2emTH59Ur5d/M8eg4WTWu1xp8i8DHjohftIyEx0S08RiYxbffr4j8Peg==", - "requires": {} + "integrity": "sha512-gN3vgMISAgacF7sqsLPByqoePooY3n2emTH59Ur5d/M8eg4WTWu1xp8i8DHjohftIyEx0S08RiYxbffr4j8Peg==" }, "use-sidecar": { "version": "1.0.5", diff --git a/dashboard/package.json b/dashboard/package.json index 9f854ba..0762191 100644 --- a/dashboard/package.json +++ b/dashboard/package.json @@ -12,6 +12,7 @@ "license": "ISC", "dependencies": { "@chakra-ui/react": "^1.7.3", + "@emotion/core": "^11.0.0", "@emotion/react": "^11.7.1", "@emotion/styled": "^11.6.0", "@types/react": "^17.0.38", @@ -19,6 +20,7 @@ "@types/react-router-dom": "^5.3.2", "dayjs": "^1.10.7", "esbuild": "^0.14.9", + "focus-visible": "^5.2.0", "framer-motion": "^5.5.5", "graphql": "^16.2.0", "lodash": "^4.17.21", diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx index c8ac2cf..2046232 100644 --- a/dashboard/src/App.tsx +++ b/dashboard/src/App.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; import { Fragment } from "react" +import { Global, css } from '@emotion/core' import { ChakraProvider, extendTheme } from '@chakra-ui/react'; import { BrowserRouter } from 'react-router-dom'; import { createClient, Provider } from 'urql'; @@ -19,12 +20,15 @@ const queryClient = createClient({ requestPolicy: 'network-only', }); + + const theme = extendTheme({ styles: { global: { 'html, body, #root': { fontFamily: 'Avenir, Helvetica, Arial, sans-serif', height: '100%', + outline: "none" }, }, }, @@ -38,10 +42,10 @@ const theme = extendTheme({ export default function App() { return ( - - + + - + diff --git a/dashboard/src/components/Menu.tsx b/dashboard/src/components/Menu.tsx index 8c1883b..937893d 100644 --- a/dashboard/src/components/Menu.tsx +++ b/dashboard/src/components/Menu.tsx @@ -140,7 +140,7 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { {...rest} > - + { AUTHORIZER - + @@ -159,12 +159,13 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { {LinkItems.map((link) => link?.subRoutes ? ( - + { ))} - + ) : ( - + {" "} { {link.name} {" "} - + ) )} , document.getElementById('root')); From f519f0eb0ec6b8b27639df07f6c0749b0e4e9aa5 Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Sun, 8 May 2022 09:35:50 +0530 Subject: [PATCH 06/19] tooltiip added to Invite member button --- dashboard/src/App.tsx | 1 - .../src/components/InviteMembersModal.tsx | 18 +++++++++++++++++- 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx index 2046232..1c71c94 100644 --- a/dashboard/src/App.tsx +++ b/dashboard/src/App.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; import { Fragment } from "react" -import { Global, css } from '@emotion/core' import { ChakraProvider, extendTheme } from '@chakra-ui/react'; import { BrowserRouter } from 'react-router-dom'; import { createClient, Provider } from 'urql'; diff --git a/dashboard/src/components/InviteMembersModal.tsx b/dashboard/src/components/InviteMembersModal.tsx index 8107669..2878722 100644 --- a/dashboard/src/components/InviteMembersModal.tsx +++ b/dashboard/src/components/InviteMembersModal.tsx @@ -22,6 +22,7 @@ import { InputRightElement, Text, Link, + Tooltip } from '@chakra-ui/react'; import { useClient } from 'urql'; import { FaUserPlus, FaMinusCircle, FaPlus, FaUpload } from 'react-icons/fa'; @@ -186,7 +187,22 @@ const InviteMembersModal = ({ isDisabled={disabled} size="sm" > -
Invite Members
+
+ {disabled ? ( + + Invite Members + + ) : ( + "Invite Members" + )} +
{" "} From 538a2d0b5929d7baf40a8c82cf72c7f8c0de4e04 Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Sun, 8 May 2022 12:43:52 +0530 Subject: [PATCH 07/19] tooltiip added to Invite member button --- dashboard/src/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dashboard/src/index.tsx b/dashboard/src/index.tsx index 4b52cf0..301ec74 100644 --- a/dashboard/src/index.tsx +++ b/dashboard/src/index.tsx @@ -3,4 +3,4 @@ import ReactDOM from 'react-dom'; import App from './App'; import 'focus-visible/dist/focus-visible'; -ReactDOM.render(, document.getElementById('root')); +ReactDOM.render(
, document.getElementById('root')); From a7fa988bf07089d96b09c2e6d6136584b5e39cea Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Sun, 8 May 2022 12:48:26 +0530 Subject: [PATCH 08/19] tooltiip added to Invite member button --- .../src/components/EnvComponents/SecurityAdminSecret.tsx | 2 +- dashboard/src/components/EnvComponents/SocialMediaLogin.tsx | 3 +-- dashboard/src/components/Menu.tsx | 3 --- dashboard/src/pages/Environment.tsx | 5 ----- 4 files changed, 2 insertions(+), 11 deletions(-) diff --git a/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx b/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx index b3e27d8..cf39f6c 100644 --- a/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx +++ b/dashboard/src/components/EnvComponents/SecurityAdminSecret.tsx @@ -11,7 +11,7 @@ import { } from "@chakra-ui/react"; import { FaRegEyeSlash, FaRegEye } from "react-icons/fa"; import InputField from "../InputField"; -import { TextInputType, HiddenInputType } from "../../constants"; +import { HiddenInputType } from "../../constants"; const SecurityAdminSecret = ({ variables, setVariables, diff --git a/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx b/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx index 38df534..bfc0101 100644 --- a/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx +++ b/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx @@ -1,10 +1,9 @@ import React from "react"; -import { Flex, Stack, Text, useMediaQuery } from "@chakra-ui/react"; +import { Flex, Stack, Text } from "@chakra-ui/react"; import InputField from "../InputField"; import { SwitchInputType } from "../../constants"; const UICustomization = ({ variables, setVariables }: any) => { - const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); return (
{" "} diff --git a/dashboard/src/components/Menu.tsx b/dashboard/src/components/Menu.tsx index 937893d..637f414 100644 --- a/dashboard/src/components/Menu.tsx +++ b/dashboard/src/components/Menu.tsx @@ -36,11 +36,9 @@ import { FiShieldOff, } from "react-icons/fi"; import { BiCustomize } from "react-icons/bi"; -import { FcDatabase } from "react-icons/fc"; import { AiOutlineKey } from "react-icons/ai"; import { SiOpenaccess, SiJsonwebtokens } from "react-icons/si"; import { MdSecurity } from "react-icons/md"; -import { RiSkullLine } from "react-icons/ri"; import { RiDatabase2Line } from "react-icons/ri"; import { BsCheck2Circle } from "react-icons/bs"; import { HiOutlineMail, HiOutlineOfficeBuilding } from "react-icons/hi"; @@ -117,7 +115,6 @@ const LinkItems: Array = [ ], }, { name: "Users", icon: FiUsers, route: "/users" }, - // { name: "AUsers", icon: FiUsers, route: "/usersa" }, ]; interface SidebarProps extends BoxProps { diff --git a/dashboard/src/pages/Environment.tsx b/dashboard/src/pages/Environment.tsx index db09298..cf6d786 100644 --- a/dashboard/src/pages/Environment.tsx +++ b/dashboard/src/pages/Environment.tsx @@ -216,7 +216,6 @@ const Environment = () => { fieldVisibility={fieldVisibility} setFieldVisibility={setFieldVisibility} SelectInputType={SelectInputType.JWT_TYPE} - // value={SelectInputType.JWT_TYPE} HMACEncryptionType={HMACEncryptionType} RSAEncryptionType={RSAEncryptionType} ECDSAEncryptionType={ECDSAEncryptionType} @@ -284,10 +283,6 @@ const Environment = () => { ); default: From de44c40de5605962f0221ba071bd97b7bdf7404d Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Mon, 9 May 2022 15:46:42 +0530 Subject: [PATCH 09/19] login page fixed --- dashboard/src/layouts/AuthLayout.tsx | 37 ++++++---------------------- 1 file changed, 8 insertions(+), 29 deletions(-) diff --git a/dashboard/src/layouts/AuthLayout.tsx b/dashboard/src/layouts/AuthLayout.tsx index 4c2a5c6..ff179e9 100644 --- a/dashboard/src/layouts/AuthLayout.tsx +++ b/dashboard/src/layouts/AuthLayout.tsx @@ -1,30 +1,16 @@ -import { Box, Flex, Image, Text, Spinner, useMediaQuery, } from '@chakra-ui/react'; +import { Box, Flex, Image, Text, Spinner, useMediaQuery } from '@chakra-ui/react'; import React from 'react'; import { useQuery } from 'urql'; import { MetaQuery } from '../graphql/queries'; export function AuthLayout({ children }: { children: React.ReactNode }) { const [{ fetching, data }] = useQuery({ query: MetaQuery }); - const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); + const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); return ( - - - logo - + + + logo + AUTHORIZER @@ -33,17 +19,10 @@ export function AuthLayout({ children }: { children: React.ReactNode }) { ) : ( <> - + {children} - + Current Version: {data.meta.version} From 0433d6473738ef5e141c45bea614b71cb078a460 Mon Sep 17 00:00:00 2001 From: anik-ghosh-au7 Date: Thu, 12 May 2022 12:27:25 +0530 Subject: [PATCH 10/19] fix: dom nesting bugs --- dashboard/src/components/Menu.tsx | 658 +++++++++++++++--------------- 1 file changed, 330 insertions(+), 328 deletions(-) diff --git a/dashboard/src/components/Menu.tsx b/dashboard/src/components/Menu.tsx index 637f414..e49f2df 100644 --- a/dashboard/src/components/Menu.tsx +++ b/dashboard/src/components/Menu.tsx @@ -1,360 +1,362 @@ -import React, { ReactNode } from "react"; +import React, { Fragment, ReactNode } from 'react'; import { - IconButton, - Box, - CloseButton, - Flex, - Image, - HStack, - VStack, - Icon, - useColorModeValue, - Link, - Text, - BoxProps, - FlexProps, - Menu, - MenuButton, - MenuItem, - MenuList, - Accordion, - AccordionButton, - AccordionPanel, - AccordionItem, - AccordionIcon, - useMediaQuery, -} from "@chakra-ui/react"; + IconButton, + Box, + CloseButton, + Flex, + Image, + HStack, + VStack, + Icon, + useColorModeValue, + Link, + Text, + BoxProps, + FlexProps, + Menu, + MenuButton, + MenuItem, + MenuList, + Accordion, + AccordionButton, + AccordionPanel, + AccordionItem, + AccordionIcon, + useMediaQuery, +} from '@chakra-ui/react'; import { - FiHome, - FiUser, - FiGlobe, - FiCode, - FiSettings, - FiMenu, - FiUsers, - FiChevronDown, - FiShieldOff, -} from "react-icons/fi"; -import { BiCustomize } from "react-icons/bi"; -import { AiOutlineKey } from "react-icons/ai"; -import { SiOpenaccess, SiJsonwebtokens } from "react-icons/si"; -import { MdSecurity } from "react-icons/md"; -import { RiDatabase2Line } from "react-icons/ri"; -import { BsCheck2Circle } from "react-icons/bs"; -import { HiOutlineMail, HiOutlineOfficeBuilding } from "react-icons/hi"; -import { IconType } from "react-icons"; -import { ReactText } from "react"; -import { useMutation, useQuery } from "urql"; -import { NavLink, useNavigate, useLocation } from "react-router-dom"; -import { useAuthContext } from "../contexts/AuthContext"; -import { AdminLogout } from "../graphql/mutation"; -import { MetaQuery } from "../graphql/queries"; + FiHome, + FiUser, + FiGlobe, + FiCode, + FiSettings, + FiMenu, + FiUsers, + FiChevronDown, + FiShieldOff, +} from 'react-icons/fi'; +import { BiCustomize } from 'react-icons/bi'; +import { AiOutlineKey } from 'react-icons/ai'; +import { SiOpenaccess, SiJsonwebtokens } from 'react-icons/si'; +import { MdSecurity } from 'react-icons/md'; +import { RiDatabase2Line } from 'react-icons/ri'; +import { BsCheck2Circle } from 'react-icons/bs'; +import { HiOutlineMail, HiOutlineOfficeBuilding } from 'react-icons/hi'; +import { IconType } from 'react-icons'; +import { ReactText } from 'react'; +import { useMutation, useQuery } from 'urql'; +import { NavLink, useNavigate, useLocation } from 'react-router-dom'; +import { useAuthContext } from '../contexts/AuthContext'; +import { AdminLogout } from '../graphql/mutation'; +import { MetaQuery } from '../graphql/queries'; interface SubRoutes { - name: string; - icon: IconType; - route: string; + name: string; + icon: IconType; + route: string; } interface LinkItemProps { - name: string; - icon: IconType; - route: string; - subRoutes?: SubRoutes[]; + name: string; + icon: IconType; + route: string; + subRoutes?: SubRoutes[]; } const LinkItems: Array = [ - { - name: "Environment ", - icon: FiSettings, - route: "/", - subRoutes: [ - { - name: "OAuth Config", - icon: AiOutlineKey, - route: "/oauth-setting", - }, + { + name: 'Environment ', + icon: FiSettings, + route: '/', + subRoutes: [ + { + name: 'OAuth Config', + icon: AiOutlineKey, + route: '/oauth-setting', + }, - { name: "Roles", icon: FiUser, route: "/roles" }, - { - name: "JWT Secrets", - icon: SiJsonwebtokens, - route: "/jwt-config", - }, - { - name: "Session Storage", - icon: RiDatabase2Line, - route: "/session-storage", - }, - { - name: "Email Configurations", - icon: HiOutlineMail, - route: "/email-config", - }, - { - name: "Domain White Listing", - icon: BsCheck2Circle, - route: "/whitelist-variables", - }, - { - name: "Organization Info", - icon: HiOutlineOfficeBuilding, - route: "/organization-info", - }, - { name: "Access Token", icon: SiOpenaccess, route: "/access-token" }, - { - name: "UI Customization", - icon: BiCustomize, - route: "/ui-customization", - }, - { name: "Database", icon: RiDatabase2Line, route: "/db-cred" }, - { - name: " Security", - icon: MdSecurity, - route: "/admin-secret", - }, - ], - }, - { name: "Users", icon: FiUsers, route: "/users" }, + { name: 'Roles', icon: FiUser, route: '/roles' }, + { + name: 'JWT Secrets', + icon: SiJsonwebtokens, + route: '/jwt-config', + }, + { + name: 'Session Storage', + icon: RiDatabase2Line, + route: '/session-storage', + }, + { + name: 'Email Configurations', + icon: HiOutlineMail, + route: '/email-config', + }, + { + name: 'Domain White Listing', + icon: BsCheck2Circle, + route: '/whitelist-variables', + }, + { + name: 'Organization Info', + icon: HiOutlineOfficeBuilding, + route: '/organization-info', + }, + { name: 'Access Token', icon: SiOpenaccess, route: '/access-token' }, + { + name: 'UI Customization', + icon: BiCustomize, + route: '/ui-customization', + }, + { name: 'Database', icon: RiDatabase2Line, route: '/db-cred' }, + { + name: ' Security', + icon: MdSecurity, + route: '/admin-secret', + }, + ], + }, + { name: 'Users', icon: FiUsers, route: '/users' }, ]; interface SidebarProps extends BoxProps { - onClose: () => void; + onClose: () => void; } export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { - const { pathname } = useLocation(); - const [{ fetching, data }] = useQuery({ query: MetaQuery }); - const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); - return ( - - - - - logo - - AUTHORIZER - - - - - + const { pathname } = useLocation(); + const [{ fetching, data }] = useQuery({ query: MetaQuery }); + const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); + return ( + + + + + logo + + AUTHORIZER + + + + + - - - {LinkItems.map((link) => - link?.subRoutes ? ( - - - - - {link.name} - - - - - - - - {link.subRoutes?.map((sublink) => ( - - {" "} - - - {sublink.name} - {" "} - - - ))} - - - ) : ( - - {" "} - - - {link.name} - {" "} - - - ) - )} - - API Playground - - - + + + {LinkItems.map((link) => + link?.subRoutes ? ( +
+ + + + + {link.name} + + + + + + + + + {link.subRoutes?.map((sublink) => ( + + {' '} + + + {sublink.name} + {' '} + + + ))} + +
+ ) : ( + + {' '} + + + {link.name} + {' '} + + + ) + )} + + API Playground + + + - {data?.meta?.version && ( - - {" "} - - Current Version: {data.meta.version} - - - )} - - ); + {data?.meta?.version && ( + + {' '} + + Current Version: {data.meta.version} + + + )} + + ); }; interface NavItemProps extends FlexProps { - icon: IconType; - children: ReactText; + icon: IconType; + children: ReactText | JSX.Element | JSX.Element[]; } export const NavItem = ({ icon, children, ...rest }: NavItemProps) => { - return ( - - {icon && ( - - )} - {children} - - ); + return ( + + {icon && ( + + )} + {children} + + ); }; interface MobileProps extends FlexProps { - onOpen: () => void; + onOpen: () => void; } export const MobileNav = ({ onOpen, ...rest }: MobileProps) => { - const [_, logout] = useMutation(AdminLogout); - const { setIsLoggedIn } = useAuthContext(); - const navigate = useNavigate(); + const [_, logout] = useMutation(AdminLogout); + const { setIsLoggedIn } = useAuthContext(); + const navigate = useNavigate(); - const handleLogout = async () => { - await logout(); - setIsLoggedIn(false); - navigate("/", { replace: true }); - }; + const handleLogout = async () => { + await logout(); + setIsLoggedIn(false); + navigate('/', { replace: true }); + }; - return ( - - } - /> + return ( + + } + /> - logo + logo - - - - - - - - Admin - - - - - - - - Sign out - - - - - - ); -}; \ No newline at end of file + + + + + + + + Admin + + + + + + + + Sign out + + + + + + ); +}; From 28bed69b2e7f0526f5197032b442c9f77a15a998 Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Thu, 12 May 2022 15:10:24 +0530 Subject: [PATCH 11/19] login page vertically responsive --- dashboard/src/layouts/AuthLayout.tsx | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/dashboard/src/layouts/AuthLayout.tsx b/dashboard/src/layouts/AuthLayout.tsx index ff179e9..5f551bb 100644 --- a/dashboard/src/layouts/AuthLayout.tsx +++ b/dashboard/src/layouts/AuthLayout.tsx @@ -1,4 +1,4 @@ -import { Box, Flex, Image, Text, Spinner, useMediaQuery } from '@chakra-ui/react'; +import { Box, Flex, Image, Text, Spinner, useMediaQuery, Stack } from '@chakra-ui/react'; import React from 'react'; import { useQuery } from 'urql'; import { MetaQuery } from '../graphql/queries'; @@ -6,8 +6,16 @@ import { MetaQuery } from '../graphql/queries'; export function AuthLayout({ children }: { children: React.ReactNode }) { const [{ fetching, data }] = useQuery({ query: MetaQuery }); const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); + const [isVerticalRes] = useMediaQuery('(max-height:600px)'); return ( - + logo @@ -27,6 +35,6 @@ export function AuthLayout({ children }: { children: React.ReactNode }) { )} - + ); } From 3e51a7bd01efee5f5331009ca4930b0cc4926e2b Mon Sep 17 00:00:00 2001 From: "akash.dutta" Date: Thu, 12 May 2022 17:06:18 +0530 Subject: [PATCH 12/19] login page vertically responsive --- dashboard/src/components/Menu.tsx | 122 +++++++++------------------ dashboard/src/layouts/AuthLayout.tsx | 14 +-- 2 files changed, 46 insertions(+), 90 deletions(-) diff --git a/dashboard/src/components/Menu.tsx b/dashboard/src/components/Menu.tsx index e49f2df..c099b96 100644 --- a/dashboard/src/components/Menu.tsx +++ b/dashboard/src/components/Menu.tsx @@ -24,17 +24,7 @@ import { AccordionIcon, useMediaQuery, } from '@chakra-ui/react'; -import { - FiHome, - FiUser, - FiGlobe, - FiCode, - FiSettings, - FiMenu, - FiUsers, - FiChevronDown, - FiShieldOff, -} from 'react-icons/fi'; +import { FiUser, FiCode, FiSettings, FiMenu, FiUsers, FiChevronDown } from 'react-icons/fi'; import { BiCustomize } from 'react-icons/bi'; import { AiOutlineKey } from 'react-icons/ai'; import { SiOpenaccess, SiJsonwebtokens } from 'react-icons/si'; @@ -127,24 +117,20 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); return ( - - - - logo - + + + + logo + AUTHORIZER @@ -153,12 +139,12 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { - + {LinkItems.map((link) => link?.subRoutes ? (
- + { {link.subRoutes?.map((sublink) => ( - + {' '} - - + + {sublink.name} {' '} @@ -201,7 +179,7 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { ) : ( {' '} - + { ) )} { {data?.meta?.version && ( - + {' '} - + Current Version: {data.meta.version} @@ -253,12 +224,12 @@ interface NavItemProps extends FlexProps { export const NavItem = ({ icon, children, ...rest }: NavItemProps) => { return ( { > {icon && ( { { } /> logo - + - - Admin + + Admin diff --git a/dashboard/src/layouts/AuthLayout.tsx b/dashboard/src/layouts/AuthLayout.tsx index 5f551bb..636f0ee 100644 --- a/dashboard/src/layouts/AuthLayout.tsx +++ b/dashboard/src/layouts/AuthLayout.tsx @@ -6,16 +6,9 @@ import { MetaQuery } from '../graphql/queries'; export function AuthLayout({ children }: { children: React.ReactNode }) { const [{ fetching, data }] = useQuery({ query: MetaQuery }); const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); - const [isVerticalRes] = useMediaQuery('(max-height:600px)'); return ( - + + {/* */} logo @@ -35,6 +28,7 @@ export function AuthLayout({ children }: { children: React.ReactNode }) { )} - + {/* */} + ); } From 9edc8d0fb57a54dcdf7f3d5e0647ba5761111c68 Mon Sep 17 00:00:00 2001 From: Vicg853 Date: Thu, 12 May 2022 16:40:19 -0300 Subject: [PATCH 13/19] Inverted userRoles by role fix. Roles can now be updated --- server/resolvers/update_user.go | 3 +++ server/utils/validator.go | 4 ++-- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/server/resolvers/update_user.go b/server/resolvers/update_user.go index a759399..618a60d 100644 --- a/server/resolvers/update_user.go +++ b/server/resolvers/update_user.go @@ -26,6 +26,7 @@ func UpdateUserResolver(ctx context.Context, params model.UpdateUserInput) (*mod if err != nil { return res, err } + fmt.Println(token.IsSuperAdmin(gc)) if !token.IsSuperAdmin(gc) { return res, fmt.Errorf("unauthorized") @@ -133,6 +134,8 @@ func UpdateUserResolver(ctx context.Context, params model.UpdateUserInput) (*mod inputRoles = append(inputRoles, *item) } + fmt.Println(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles)) + fmt.Println(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyProtectedRoles)) if !utils.IsValidRoles(inputRoles, append([]string{}, append(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles), envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyProtectedRoles)...)...)) { return res, fmt.Errorf("invalid list of roles") } diff --git a/server/utils/validator.go b/server/utils/validator.go index f3ac062..280d611 100644 --- a/server/utils/validator.go +++ b/server/utils/validator.go @@ -54,8 +54,8 @@ func IsValidOrigin(url string) bool { // IsValidRoles validates roles func IsValidRoles(userRoles []string, roles []string) bool { valid := true - for _, role := range roles { - if !StringSliceContains(userRoles, role) { + for _, userRole := range userRoles { + if !StringSliceContains(roles, userRole) { valid = false break } From 4ceb6db4ba4920514f09866fe881ce8021ec1e2e Mon Sep 17 00:00:00 2001 From: Vicg853 Date: Thu, 12 May 2022 16:40:49 -0300 Subject: [PATCH 14/19] Adding possible test error cause comment --- server/test/update_user_test.go | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/server/test/update_user_test.go b/server/test/update_user_test.go index d072a27..d1f55de 100644 --- a/server/test/update_user_test.go +++ b/server/test/update_user_test.go @@ -24,6 +24,12 @@ func updateUserTest(t *testing.T, s TestSetup) { }) user := *signupRes.User + //! - Found out by testing + //! that the 'supplier' role was being accepted by the server + //! even though that it doesn't exist in the database. + //! (checked it by doing fmt.Println() on role envs) + //! But I'm not removing it as there is maybe a reason for it to be be here... + //! - Appart from that, by removing it test returns 'unauthorized' successfully adminRole := "supplier" userRole := "user" newRoles := []*string{&adminRole, &userRole} From 1efa419cdf9cfbe97f26b2d6b3e7530867f9fcbb Mon Sep 17 00:00:00 2001 From: Vicg853 Date: Thu, 12 May 2022 16:43:07 -0300 Subject: [PATCH 15/19] Clean up --- server/resolvers/update_user.go | 3 --- 1 file changed, 3 deletions(-) diff --git a/server/resolvers/update_user.go b/server/resolvers/update_user.go index 618a60d..a759399 100644 --- a/server/resolvers/update_user.go +++ b/server/resolvers/update_user.go @@ -26,7 +26,6 @@ func UpdateUserResolver(ctx context.Context, params model.UpdateUserInput) (*mod if err != nil { return res, err } - fmt.Println(token.IsSuperAdmin(gc)) if !token.IsSuperAdmin(gc) { return res, fmt.Errorf("unauthorized") @@ -134,8 +133,6 @@ func UpdateUserResolver(ctx context.Context, params model.UpdateUserInput) (*mod inputRoles = append(inputRoles, *item) } - fmt.Println(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles)) - fmt.Println(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyProtectedRoles)) if !utils.IsValidRoles(inputRoles, append([]string{}, append(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles), envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyProtectedRoles)...)...)) { return res, fmt.Errorf("invalid list of roles") } From ab717d956a47805d5a433982aaf48c4f676be12c Mon Sep 17 00:00:00 2001 From: Lakhan Samani Date: Fri, 13 May 2022 07:49:45 +0530 Subject: [PATCH 16/19] fix: update role test --- server/test/resolvers_test.go | 4 ++-- server/test/update_user_test.go | 16 ++++++++++------ 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/server/test/resolvers_test.go b/server/test/resolvers_test.go index 84a5c76..513c1b0 100644 --- a/server/test/resolvers_test.go +++ b/server/test/resolvers_test.go @@ -11,10 +11,10 @@ import ( func TestResolvers(t *testing.T) { databases := map[string]string{ - // constants.DbTypeSqlite: "../../data.db", + constants.DbTypeSqlite: "../../data.db", // constants.DbTypeArangodb: "http://localhost:8529", // constants.DbTypeMongodb: "mongodb://localhost:27017", - constants.DbTypeCassandraDB: "127.0.0.1:9042", + // constants.DbTypeCassandraDB: "127.0.0.1:9042", } for dbType, dbURL := range databases { diff --git a/server/test/update_user_test.go b/server/test/update_user_test.go index d1f55de..fd76653 100644 --- a/server/test/update_user_test.go +++ b/server/test/update_user_test.go @@ -24,12 +24,7 @@ func updateUserTest(t *testing.T, s TestSetup) { }) user := *signupRes.User - //! - Found out by testing - //! that the 'supplier' role was being accepted by the server - //! even though that it doesn't exist in the database. - //! (checked it by doing fmt.Println() on role envs) - //! But I'm not removing it as there is maybe a reason for it to be be here... - //! - Appart from that, by removing it test returns 'unauthorized' successfully + adminRole := "supplier" userRole := "user" newRoles := []*string{&adminRole, &userRole} @@ -46,6 +41,15 @@ func updateUserTest(t *testing.T, s TestSetup) { ID: user.ID, Roles: newRoles, }) + // supplier is not part of envs + assert.Error(t, err) + adminRole = "admin" + envstore.EnvStoreObj.UpdateEnvVariable(constants.SliceStoreIdentifier, constants.EnvKeyProtectedRoles, []string{adminRole}) + newRoles = []*string{&adminRole, &userRole} + _, err = resolvers.UpdateUserResolver(ctx, model.UpdateUserInput{ + ID: user.ID, + Roles: newRoles, + }) assert.Nil(t, err) cleanData(email) }) From 5e4f34c88920cb348889a409729950b2996bf74f Mon Sep 17 00:00:00 2001 From: Vicg853 Date: Sat, 14 May 2022 04:37:36 -0300 Subject: [PATCH 17/19] Fixing login isValidRole usage --- server/resolvers/login.go | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/server/resolvers/login.go b/server/resolvers/login.go index 15acddd..d27cf90 100644 --- a/server/resolvers/login.go +++ b/server/resolvers/login.go @@ -58,7 +58,7 @@ func LoginResolver(ctx context.Context, params model.LoginInput) (*model.AuthRes roles := envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyDefaultRoles) currentRoles := strings.Split(user.Roles, ",") if len(params.Roles) > 0 { - if !utils.IsValidRoles(currentRoles, params.Roles) { + if !utils.IsValidRoles(params.Roles, currentRoles) { return res, fmt.Errorf(`invalid roles`) } From ed855a274a08f9921f6b04754235c7dbdf1f147f Mon Sep 17 00:00:00 2001 From: anik-ghosh-au7 Date: Sat, 14 May 2022 20:20:21 +0530 Subject: [PATCH 18/19] fix: app style remove unnecessary code --- dashboard/src/App.tsx | 24 +- .../components/EnvComponents/OAuthConfig.tsx | 366 +++++------ .../EnvComponents/SocialMediaLogin.tsx | 79 --- .../EnvComponents/UICustomization.tsx | 151 +++-- dashboard/src/components/Menu.tsx | 128 ++-- dashboard/src/constants.ts | 14 + dashboard/src/index.tsx | 8 +- dashboard/src/layouts/AuthLayout.tsx | 41 +- dashboard/src/pages/Environment.tsx | 595 +++++++++--------- 9 files changed, 702 insertions(+), 704 deletions(-) delete mode 100644 dashboard/src/components/EnvComponents/SocialMediaLogin.tsx diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx index 1c71c94..1f62166 100644 --- a/dashboard/src/App.tsx +++ b/dashboard/src/App.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { Fragment } from "react" +import { Fragment } from 'react'; import { ChakraProvider, extendTheme } from '@chakra-ui/react'; import { BrowserRouter } from 'react-router-dom'; import { createClient, Provider } from 'urql'; @@ -19,15 +19,13 @@ const queryClient = createClient({ requestPolicy: 'network-only', }); - - const theme = extendTheme({ styles: { global: { 'html, body, #root': { fontFamily: 'Avenir, Helvetica, Arial, sans-serif', height: '100%', - outline: "none" + outline: 'none', }, }, }, @@ -41,15 +39,15 @@ const theme = extendTheme({ export default function App() { return ( - - - - - - - - - + + + + + + + + + ); } diff --git a/dashboard/src/components/EnvComponents/OAuthConfig.tsx b/dashboard/src/components/EnvComponents/OAuthConfig.tsx index b06d595..a235e09 100644 --- a/dashboard/src/components/EnvComponents/OAuthConfig.tsx +++ b/dashboard/src/components/EnvComponents/OAuthConfig.tsx @@ -1,191 +1,191 @@ -import React from "react"; -import InputField from "../InputField"; +import React from 'react'; +import InputField from '../InputField'; import { - Flex, - Stack, - Center, - Text, - Box, - Divider, - useMediaQuery, -} from "@chakra-ui/react"; -import { FaGoogle, FaGithub, FaFacebookF } from "react-icons/fa"; -import { TextInputType, HiddenInputType } from "../../constants"; + Flex, + Stack, + Center, + Text, + Box, + Divider, + useMediaQuery, +} from '@chakra-ui/react'; +import { FaGoogle, FaGithub, FaFacebookF } from 'react-icons/fa'; +import { TextInputType, HiddenInputType } from '../../constants'; const OAuthConfig = ({ - envVariables, - setVariables, - fieldVisibility, - setFieldVisibility, + envVariables, + setVariables, + fieldVisibility, + setFieldVisibility, }: any) => { - const [isNotSmallerScreen] = useMediaQuery("(min-width:667px)"); - return ( -
- - - Your instance information - - - - - Client ID + const [isNotSmallerScreen] = useMediaQuery('(min-width:667px)'); + return ( +
+ + + Your instance information + + + + + Client ID + +
+ {}} + inputType={TextInputType.CLIENT_ID} + placeholder="Client ID" + readOnly={true} + /> +
-
- {}} - inputType={TextInputType.CLIENT_ID} - placeholder="Client ID" - readOnly={true} - /> -
- - - - Client Secret + + + Client Secret + +
+ +
-
- -
- - - - {/* ################ SOCIAL MEDIA LOGIN ################ */} - - Social Media Logins - - - -
- -
-
- -
-
- -
- - -
- -
-
- -
-
- -
- - -
- -
-
- -
-
- -
- - - -
- ); + + + + Social Media Logins + + + +
+ +
+
+ +
+
+ +
+ + +
+ +
+
+ +
+
+ +
+ + +
+ +
+
+ +
+
+ +
+ + + +
+ ); }; -export default OAuthConfig; \ No newline at end of file +export default OAuthConfig; diff --git a/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx b/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx deleted file mode 100644 index bfc0101..0000000 --- a/dashboard/src/components/EnvComponents/SocialMediaLogin.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import React from "react"; -import { Flex, Stack, Text } from "@chakra-ui/react"; -import InputField from "../InputField"; -import { SwitchInputType } from "../../constants"; - -const UICustomization = ({ variables, setVariables }: any) => { - return ( -
- {" "} - - Disable Features - - - - - Disable Login Page: - - - - - - - - Disable Email Verification: - - - - - - - - Disable Magic Login Link: - - - - - - - - Disable Basic Authentication: - - - - - - - - Disable Sign Up: - - - - - - -
- ); -}; - -export default UICustomization; \ No newline at end of file diff --git a/dashboard/src/components/EnvComponents/UICustomization.tsx b/dashboard/src/components/EnvComponents/UICustomization.tsx index 38df534..756c739 100644 --- a/dashboard/src/components/EnvComponents/UICustomization.tsx +++ b/dashboard/src/components/EnvComponents/UICustomization.tsx @@ -1,80 +1,79 @@ -import React from "react"; -import { Flex, Stack, Text, useMediaQuery } from "@chakra-ui/react"; -import InputField from "../InputField"; -import { SwitchInputType } from "../../constants"; +import React from 'react'; +import { Flex, Stack, Text } from '@chakra-ui/react'; +import InputField from '../InputField'; +import { SwitchInputType } from '../../constants'; const UICustomization = ({ variables, setVariables }: any) => { - const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)"); - return ( -
- {" "} - - Disable Features - - - - - Disable Login Page: - - - - - - - - Disable Email Verification: - - - - - - - - Disable Magic Login Link: - - - - - - - - Disable Basic Authentication: - - - - - - - - Disable Sign Up: - - - - - - -
- ); + return ( +
+ {' '} + + Disable Features + + + + + Disable Login Page: + + + + + + + + Disable Email Verification: + + + + + + + + Disable Magic Login Link: + + + + + + + + Disable Basic Authentication: + + + + + + + + Disable Sign Up: + + + + + + +
+ ); }; -export default UICustomization; \ No newline at end of file +export default UICustomization; diff --git a/dashboard/src/components/Menu.tsx b/dashboard/src/components/Menu.tsx index c099b96..819c665 100644 --- a/dashboard/src/components/Menu.tsx +++ b/dashboard/src/components/Menu.tsx @@ -21,10 +21,16 @@ import { AccordionButton, AccordionPanel, AccordionItem, - AccordionIcon, useMediaQuery, } from '@chakra-ui/react'; -import { FiUser, FiCode, FiSettings, FiMenu, FiUsers, FiChevronDown } from 'react-icons/fi'; +import { + FiUser, + FiCode, + FiSettings, + FiMenu, + FiUsers, + FiChevronDown, +} from 'react-icons/fi'; import { BiCustomize } from 'react-icons/bi'; import { AiOutlineKey } from 'react-icons/ai'; import { SiOpenaccess, SiJsonwebtokens } from 'react-icons/si'; @@ -117,20 +123,30 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); return ( - - - - logo - + + + + logo + AUTHORIZER @@ -139,12 +155,12 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { - + {LinkItems.map((link) => link?.subRoutes ? (
- - + + { {link.subRoutes?.map((sublink) => ( - + {' '} - - + + {sublink.name} {' '} @@ -179,7 +203,7 @@ export const Sidebar = ({ onClose, ...rest }: SidebarProps) => { ) : ( {' '} - + { ) )} { {data?.meta?.version && ( - + {' '} - + Current Version: {data.meta.version} @@ -224,12 +255,12 @@ interface NavItemProps extends FlexProps { export const NavItem = ({ icon, children, ...rest }: NavItemProps) => { return ( { > {icon && ( { { } /> logo - + - - Admin + + Admin diff --git a/dashboard/src/constants.ts b/dashboard/src/constants.ts index e4737e5..3b9986f 100644 --- a/dashboard/src/constants.ts +++ b/dashboard/src/constants.ts @@ -128,3 +128,17 @@ export interface envVarTypes { DATABASE_URL: string; ACCESS_TOKEN_EXPIRY_TIME: string; } + +export const envSubViews = { + INSTANCE_INFO: 'instance-info', + ROLES: 'roles', + JWT_CONFIG: 'jwt-config', + SESSION_STORAGE: 'session-storage', + EMAIL_CONFIG: 'email-config', + WHITELIST_VARIABLES: 'whitelist-variables', + ORGANIZATION_INFO: 'organization-info', + ACCESS_TOKEN: 'access-token', + UI_CUSTOMIZATION: 'ui-customization', + ADMIN_SECRET: 'admin-secret', + DB_CRED: 'db-cred', +}; diff --git a/dashboard/src/index.tsx b/dashboard/src/index.tsx index 301ec74..16111ab 100644 --- a/dashboard/src/index.tsx +++ b/dashboard/src/index.tsx @@ -1,6 +1,10 @@ import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; -import 'focus-visible/dist/focus-visible'; -ReactDOM.render(
, document.getElementById('root')); +ReactDOM.render( +
+ +
, + document.getElementById('root') +); diff --git a/dashboard/src/layouts/AuthLayout.tsx b/dashboard/src/layouts/AuthLayout.tsx index 636f0ee..4c1c01f 100644 --- a/dashboard/src/layouts/AuthLayout.tsx +++ b/dashboard/src/layouts/AuthLayout.tsx @@ -1,4 +1,11 @@ -import { Box, Flex, Image, Text, Spinner, useMediaQuery, Stack } from '@chakra-ui/react'; +import { + Box, + Flex, + Image, + Text, + Spinner, + useMediaQuery, +} from '@chakra-ui/react'; import React from 'react'; import { useQuery } from 'urql'; import { MetaQuery } from '../graphql/queries'; @@ -7,11 +14,20 @@ export function AuthLayout({ children }: { children: React.ReactNode }) { const [{ fetching, data }] = useQuery({ query: MetaQuery }); const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)'); return ( - - {/* */} - - logo - + + + logo + AUTHORIZER @@ -20,15 +36,22 @@ export function AuthLayout({ children }: { children: React.ReactNode }) { ) : ( <> - + {children} - + Current Version: {data.meta.version} )} - {/* */} ); } diff --git a/dashboard/src/pages/Environment.tsx b/dashboard/src/pages/Environment.tsx index cf6d786..78f79c4 100644 --- a/dashboard/src/pages/Environment.tsx +++ b/dashboard/src/pages/Environment.tsx @@ -1,319 +1,318 @@ -import React, { useEffect } from "react"; -import { useParams } from "react-router-dom"; -import { Box, Flex, Stack, Button, useToast } from "@chakra-ui/react"; -import { useClient } from "urql"; -import { FaSave } from "react-icons/fa"; -import _ from "lodash"; -import { EnvVariablesQuery } from "../graphql/queries"; +import React, { useEffect } from 'react'; +import { useParams } from 'react-router-dom'; +import { Box, Flex, Stack, Button, useToast } from '@chakra-ui/react'; +import { useClient } from 'urql'; +import { FaSave } from 'react-icons/fa'; +import _ from 'lodash'; +import { EnvVariablesQuery } from '../graphql/queries'; import { - SelectInputType, - HiddenInputType, - TextInputType, - HMACEncryptionType, - RSAEncryptionType, - ECDSAEncryptionType, - envVarTypes, -} from "../constants"; -import { UpdateEnvVariables } from "../graphql/mutation"; -import { getObjectDiff, capitalizeFirstLetter } from "../utils"; -// Component inputs -import OAuthConfig from "../components/EnvComponents/OAuthConfig"; -import Roles from "../components/EnvComponents/Roles"; -import JWTConfigurations from "../components/EnvComponents/JWTConfiguration"; -import SessionStorage from "../components/EnvComponents/SessionStorage"; -import EmailConfigurations from "../components/EnvComponents/EmailConfiguration"; -import DomainWhiteListing from "../components/EnvComponents/DomainWhitelisting"; -import OrganizationInfo from "../components/EnvComponents/OrganizationInfo"; -import AccessToken from "../components/EnvComponents/AccessToken"; -import UICustomization from "../components/EnvComponents/UICustomization" -import SecurityAdminSecret from "../components/EnvComponents/SecurityAdminSecret"; -import DatabaseCredentials from "../components/EnvComponents/DatabaseCredentials"; + SelectInputType, + HiddenInputType, + TextInputType, + HMACEncryptionType, + RSAEncryptionType, + ECDSAEncryptionType, + envVarTypes, + envSubViews, +} from '../constants'; +import { UpdateEnvVariables } from '../graphql/mutation'; +import { getObjectDiff, capitalizeFirstLetter } from '../utils'; +import OAuthConfig from '../components/EnvComponents/OAuthConfig'; +import Roles from '../components/EnvComponents/Roles'; +import JWTConfigurations from '../components/EnvComponents/JWTConfiguration'; +import SessionStorage from '../components/EnvComponents/SessionStorage'; +import EmailConfigurations from '../components/EnvComponents/EmailConfiguration'; +import DomainWhiteListing from '../components/EnvComponents/DomainWhitelisting'; +import OrganizationInfo from '../components/EnvComponents/OrganizationInfo'; +import AccessToken from '../components/EnvComponents/AccessToken'; +import UICustomization from '../components/EnvComponents/UICustomization'; +import SecurityAdminSecret from '../components/EnvComponents/SecurityAdminSecret'; +import DatabaseCredentials from '../components/EnvComponents/DatabaseCredentials'; const Environment = () => { - const client = useClient(); - const toast = useToast(); - const [adminSecret, setAdminSecret] = React.useState< - Record - >({ - value: "", - disableInputField: true, - }); - const [loading, setLoading] = React.useState(true); - const [envVariables, setEnvVariables] = React.useState({ - GOOGLE_CLIENT_ID: "", - GOOGLE_CLIENT_SECRET: "", - GITHUB_CLIENT_ID: "", - GITHUB_CLIENT_SECRET: "", - FACEBOOK_CLIENT_ID: "", - FACEBOOK_CLIENT_SECRET: "", - ROLES: [], - DEFAULT_ROLES: [], - PROTECTED_ROLES: [], - JWT_TYPE: "", - JWT_SECRET: "", - JWT_ROLE_CLAIM: "", - JWT_PRIVATE_KEY: "", - JWT_PUBLIC_KEY: "", - REDIS_URL: "", - SMTP_HOST: "", - SMTP_PORT: "", - SMTP_USERNAME: "", - SMTP_PASSWORD: "", - SENDER_EMAIL: "", - ALLOWED_ORIGINS: [], - ORGANIZATION_NAME: "", - ORGANIZATION_LOGO: "", - CUSTOM_ACCESS_TOKEN_SCRIPT: "", - ADMIN_SECRET: "", - DISABLE_LOGIN_PAGE: false, - DISABLE_MAGIC_LINK_LOGIN: false, - DISABLE_EMAIL_VERIFICATION: false, - DISABLE_BASIC_AUTHENTICATION: false, - DISABLE_SIGN_UP: false, - OLD_ADMIN_SECRET: "", - DATABASE_NAME: "", - DATABASE_TYPE: "", - DATABASE_URL: "", - ACCESS_TOKEN_EXPIRY_TIME: "", - }); + const client = useClient(); + const toast = useToast(); + const [adminSecret, setAdminSecret] = React.useState< + Record + >({ + value: '', + disableInputField: true, + }); + const [loading, setLoading] = React.useState(true); + const [envVariables, setEnvVariables] = React.useState({ + GOOGLE_CLIENT_ID: '', + GOOGLE_CLIENT_SECRET: '', + GITHUB_CLIENT_ID: '', + GITHUB_CLIENT_SECRET: '', + FACEBOOK_CLIENT_ID: '', + FACEBOOK_CLIENT_SECRET: '', + ROLES: [], + DEFAULT_ROLES: [], + PROTECTED_ROLES: [], + JWT_TYPE: '', + JWT_SECRET: '', + JWT_ROLE_CLAIM: '', + JWT_PRIVATE_KEY: '', + JWT_PUBLIC_KEY: '', + REDIS_URL: '', + SMTP_HOST: '', + SMTP_PORT: '', + SMTP_USERNAME: '', + SMTP_PASSWORD: '', + SENDER_EMAIL: '', + ALLOWED_ORIGINS: [], + ORGANIZATION_NAME: '', + ORGANIZATION_LOGO: '', + CUSTOM_ACCESS_TOKEN_SCRIPT: '', + ADMIN_SECRET: '', + DISABLE_LOGIN_PAGE: false, + DISABLE_MAGIC_LINK_LOGIN: false, + DISABLE_EMAIL_VERIFICATION: false, + DISABLE_BASIC_AUTHENTICATION: false, + DISABLE_SIGN_UP: false, + OLD_ADMIN_SECRET: '', + DATABASE_NAME: '', + DATABASE_TYPE: '', + DATABASE_URL: '', + ACCESS_TOKEN_EXPIRY_TIME: '', + }); - const [fieldVisibility, setFieldVisibility] = React.useState< - Record - >({ - GOOGLE_CLIENT_SECRET: false, - GITHUB_CLIENT_SECRET: false, - FACEBOOK_CLIENT_SECRET: false, - JWT_SECRET: false, - SMTP_PASSWORD: false, - ADMIN_SECRET: false, - OLD_ADMIN_SECRET: false, - }); + const [fieldVisibility, setFieldVisibility] = React.useState< + Record + >({ + GOOGLE_CLIENT_SECRET: false, + GITHUB_CLIENT_SECRET: false, + FACEBOOK_CLIENT_SECRET: false, + JWT_SECRET: false, + SMTP_PASSWORD: false, + ADMIN_SECRET: false, + OLD_ADMIN_SECRET: false, + }); - const { sec } = useParams(); + const { sec } = useParams(); - async function getData() { - const { - data: { _env: envData }, - } = await client.query(EnvVariablesQuery).toPromise(); - setLoading(false); + async function getData() { + const { + data: { _env: envData }, + } = await client.query(EnvVariablesQuery).toPromise(); + setLoading(false); - setEnvVariables({ - ...envData, - OLD_ADMIN_SECRET: envData.ADMIN_SECRET, - ADMIN_SECRET: "", - }); - setAdminSecret({ - value: "", - disableInputField: true, - }); - } + setEnvVariables({ + ...envData, + OLD_ADMIN_SECRET: envData.ADMIN_SECRET, + ADMIN_SECRET: '', + }); + setAdminSecret({ + value: '', + disableInputField: true, + }); + } - useEffect(() => { - getData(); - }, [sec]); + useEffect(() => { + getData(); + }, [sec]); - const validateAdminSecretHandler = (event: any) => { - if (envVariables.OLD_ADMIN_SECRET === event.target.value) { - setAdminSecret({ - ...adminSecret, - value: event.target.value, - disableInputField: false, - }); - } else { - setAdminSecret({ - ...adminSecret, - value: event.target.value, - disableInputField: true, - }); - } - if (envVariables.ADMIN_SECRET !== "") { - setEnvVariables({ ...envVariables, ADMIN_SECRET: "" }); - } - }; + const validateAdminSecretHandler = (event: any) => { + if (envVariables.OLD_ADMIN_SECRET === event.target.value) { + setAdminSecret({ + ...adminSecret, + value: event.target.value, + disableInputField: false, + }); + } else { + setAdminSecret({ + ...adminSecret, + value: event.target.value, + disableInputField: true, + }); + } + if (envVariables.ADMIN_SECRET !== '') { + setEnvVariables({ ...envVariables, ADMIN_SECRET: '' }); + } + }; - const saveHandler = async () => { - setLoading(true); - const { - data: { _env: envData }, - } = await client.query(EnvVariablesQuery).toPromise(); - const diff = getObjectDiff(envVariables, envData); - const updatedEnvVariables = diff.reduce( - (acc: any, property: string) => ({ - ...acc, - // @ts-ignore - [property]: envVariables[property], - }), - {} - ); - if ( - updatedEnvVariables[HiddenInputType.ADMIN_SECRET] === "" || - updatedEnvVariables[HiddenInputType.OLD_ADMIN_SECRET] !== - envData.ADMIN_SECRET - ) { - delete updatedEnvVariables.OLD_ADMIN_SECRET; - delete updatedEnvVariables.ADMIN_SECRET; - } + const saveHandler = async () => { + setLoading(true); + const { + data: { _env: envData }, + } = await client.query(EnvVariablesQuery).toPromise(); + const diff = getObjectDiff(envVariables, envData); + const updatedEnvVariables = diff.reduce( + (acc: any, property: string) => ({ + ...acc, + // @ts-ignore + [property]: envVariables[property], + }), + {} + ); + if ( + updatedEnvVariables[HiddenInputType.ADMIN_SECRET] === '' || + updatedEnvVariables[HiddenInputType.OLD_ADMIN_SECRET] !== + envData.ADMIN_SECRET + ) { + delete updatedEnvVariables.OLD_ADMIN_SECRET; + delete updatedEnvVariables.ADMIN_SECRET; + } - delete updatedEnvVariables.DATABASE_URL; - delete updatedEnvVariables.DATABASE_TYPE; - delete updatedEnvVariables.DATABASE_NAME; + delete updatedEnvVariables.DATABASE_URL; + delete updatedEnvVariables.DATABASE_TYPE; + delete updatedEnvVariables.DATABASE_NAME; - const res = await client - .mutation(UpdateEnvVariables, { params: updatedEnvVariables }) - .toPromise(); + const res = await client + .mutation(UpdateEnvVariables, { params: updatedEnvVariables }) + .toPromise(); - setLoading(false); + setLoading(false); - if (res.error) { - toast({ - title: capitalizeFirstLetter(res.error.message), - isClosable: true, - status: "error", - position: "bottom-right", - }); + if (res.error) { + toast({ + title: capitalizeFirstLetter(res.error.message), + isClosable: true, + status: 'error', + position: 'bottom-right', + }); - return; - } + return; + } - setAdminSecret({ - value: "", - disableInputField: true, - }); + setAdminSecret({ + value: '', + disableInputField: true, + }); - getData(); + getData(); - toast({ - title: `Successfully updated ${ - Object.keys(updatedEnvVariables).length - } variables`, - isClosable: true, - status: "success", - position: "bottom-right", - }); - }; + toast({ + title: `Successfully updated ${ + Object.keys(updatedEnvVariables).length + } variables`, + isClosable: true, + status: 'success', + position: 'bottom-right', + }); + }; - const getCorrectScreen = (tab: any) => { - switch (tab) { - case "instance-info": - return ( - - ); - - case "roles": - return ( - - ); - case "jwt-config": - return ( - - ); - case "session-storage": - return ( - - ); - case "email-config": - return ( - - ); - case "whitelist-variables": - return ( - - ); - case "organization-info": - return ( - - ); - case "access-token": - return ( - - ); - case "ui-customization": - return ( - - ); - case "admin-secret": - return ( - - ); - case "db-cred": - return ( - - ); - default: - return ( - - ); - } - }; - return ( - - {getCorrectScreen(sec)} - - - - - - - ); + const renderComponent = (tab: any) => { + switch (tab) { + case envSubViews.INSTANCE_INFO: + return ( + + ); + case envSubViews.ROLES: + return ( + + ); + case envSubViews.JWT_CONFIG: + return ( + + ); + case envSubViews.SESSION_STORAGE: + return ( + + ); + case envSubViews.EMAIL_CONFIG: + return ( + + ); + case envSubViews.WHITELIST_VARIABLES: + return ( + + ); + case envSubViews.ORGANIZATION_INFO: + return ( + + ); + case envSubViews.ACCESS_TOKEN: + return ( + + ); + case envSubViews.UI_CUSTOMIZATION: + return ( + + ); + case envSubViews.ADMIN_SECRET: + return ( + + ); + case envSubViews.DB_CRED: + return ( + + ); + default: + return ( + + ); + } + }; + return ( + + {renderComponent(sec)} + + + + + + + ); }; -export default Environment; \ No newline at end of file +export default Environment; From 241f977b2a38b6e0fd132c36cd4e529dbc1a4dd8 Mon Sep 17 00:00:00 2001 From: Vicg853 Date: Sat, 14 May 2022 23:21:45 -0300 Subject: [PATCH 19/19] Fixing related files --- server/handlers/oauth_login.go | 2 +- server/resolvers/magic_link_login.go | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/server/handlers/oauth_login.go b/server/handlers/oauth_login.go index a2ce229..f2683a8 100644 --- a/server/handlers/oauth_login.go +++ b/server/handlers/oauth_login.go @@ -52,7 +52,7 @@ func OAuthLoginHandler() gin.HandlerFunc { // use protected roles verification for admin login only. // though if not associated with user, it will be rejected from oauth_callback - if !utils.IsValidRoles(append([]string{}, append(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles), envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyProtectedRoles)...)...), rolesSplit) { + if !utils.IsValidRoles(rolesSplit, append([]string{}, append(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles), envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyProtectedRoles)...)...)) { c.JSON(400, gin.H{ "error": "invalid role", }) diff --git a/server/resolvers/magic_link_login.go b/server/resolvers/magic_link_login.go index 1c9d0bc..cba2c43 100644 --- a/server/resolvers/magic_link_login.go +++ b/server/resolvers/magic_link_login.go @@ -52,7 +52,7 @@ func MagicLinkLoginResolver(ctx context.Context, params model.MagicLinkLoginInpu // define roles for new user if len(params.Roles) > 0 { // check if roles exists - if !utils.IsValidRoles(envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles), params.Roles) { + if !utils.IsValidRoles(params.Roles, envstore.EnvStoreObj.GetSliceStoreEnvVariable(constants.EnvKeyRoles)) { return res, fmt.Errorf(`invalid roles`) } else { inputRoles = params.Roles