Open repo button

src/parking-place/react-app/.gitignore

@@ -13,6 +13,7 @@
 
 # misc
 .DS_Store
+.env
 .env.local
 .env.development.local
 .env.test.local

src/parking-place/react-app/src/components/Header/NavBar.tsx

@@ -2,7 +2,7 @@ import AppBar from "@mui/material/AppBar";
 import Toolbar from "@mui/material/Toolbar";
 import IconButton from "@mui/material/IconButton";
 import MenuIcon from "@mui/icons-material/Menu";
-import LoginButton from "./LoginButton";
+import PageFunctionsButton from "./PageFunctionButton";
 import { NavBarStyles } from "./styles";
 import { useTheme } from "@mui/material";
 
@@ -31,7 +31,7 @@ export default function NavBar() {
           loading="eager"
         />
 
-        <LoginButton />
+        <PageFunctionsButton />
       </Toolbar>
     </AppBar>
   );

src/parking-place/react-app/src/components/Header/LoginButton.tsx → src/parking-place/react-app/src/components/Header/PageFunctionButton.tsx

@@ -3,12 +3,16 @@ import { useOidcAuthentication } from "@sensenet/authentication-oidc-react";
 import { Button, IconButton, Menu, MenuItem, useTheme } from "@mui/material";
 import AccountCircle from "@mui/icons-material/AccountCircle";
 import { LoginButtonStyle } from "./styles";
+import { useRepository } from "@sensenet/hooks-react";
+import { sensenetAdminUrl } from "../../utils/configurations";
 
-function LoginButton() {
+function PageFunctionsButton() {
   const { oidcUser, login, logout } = useOidcAuthentication();
   const theme = useTheme();
   const styles = LoginButtonStyle(theme);
 
+  const repository = useRepository();
+
   const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
 
   const handleMenu = (event: React.MouseEvent<HTMLElement>) => {
@@ -19,6 +23,18 @@ function LoginButton() {
     setAnchorEl(null);
   };
 
+  const handleOpenRepo = () => {
+    const url = new URL(process.env.REACT_APP_AdminUrl || sensenetAdminUrl);
+
+    url.searchParams.append(
+      "repoUrl",
+      encodeURI(repository.configuration.repositoryUrl)
+    );
+
+    window.open(url.toString(), "_blank");
+    setAnchorEl(null);
+  };
+
   if (!oidcUser) {
     return (
       <Button variant="outlined" onClick={login} sx={styles.LoginButton}>
@@ -54,11 +70,11 @@ function LoginButton() {
         open={Boolean(anchorEl)}
         onClose={handleClose}
       >
-        <MenuItem onClick={handleClose}>Open Repository</MenuItem>
+        <MenuItem onClick={handleOpenRepo}>Open Repository</MenuItem>
         <MenuItem onClick={logout}>Log out</MenuItem>
       </Menu>
     </>
   );
 }
 
-export default LoginButton;
+export default PageFunctionsButton;

src/parking-place/react-app/src/components/auth/NotAutheticated.tsx

@@ -1,10 +1,7 @@
-import { useEffect } from "react";
+import { redirect } from "react-router";
 
 export const NotAuthenticatedOverride = () => {
-  useEffect(() => {
-    console.log("Redirecting");
-    window.location.replace("/");
-  }, []);
+  redirect("/");
 
   return null;
 };

src/parking-place/react-app/src/utils/configurations.tsx

@@ -1,13 +1,19 @@
-export const repositoryUrl = "https://sampleapps.test.sensenet.cloud";
+export const repositoryUrl =
+  process.env.REACT_APP_RepoUrl || "https://sampleapps.test.sensenet.cloud";
 
 export const configuration = {
-  client_id: "TdDZR9am6OVoYQgZ", // clientID of your repository
+  client_id: process.env.REACT_APP_ClientId || "TdDZR9am6OVoYQgZ", // clientID of your repository
   automaticSilentRenew: true,
   redirect_uri: `${window.location.origin}/authentication/login_callback`,
   response_type: "code",
   post_logout_redirect_uri: `${window.location.origin}/`,
   scope: "openid profile sensenet",
-  authority: "https://sampleapps-is.test.sensenet.cloud",
+  authority:
+    process.env.REACT_APP_Authority ||
+    "https://sampleapps-is.test.sensenet.cloud",
   silent_redirect_uri: `${window.location.origin}/authentication/silent_callback`,
   extraQueryParams: { snrepo: repositoryUrl },
 };
+
+export const sensenetAdminUrl =
+  process.env.REACT_APP_AdminUrl || "https://admin.sensenet.com/";