Layout Hub foundation

gui/rpk-gui/src/components/auth/ForgotPassword.tsx

@@ -0,0 +1,5 @@
+import { AuthPage } from "@refinedev/mui";
+
+export const ForgotPassword = () => {
+  return <AuthPage type="forgotPassword" />;
+};

gui/rpk-gui/src/components/auth/Login.tsx

@@ -0,0 +1,32 @@
+import { AuthPage } from "@refinedev/mui";
+
+import GoogleIcon from "@mui/icons-material/Google";
+import DiscordIcon from "../../components/DiscordIcon";
+import { useSearchParams, Navigate } from "react-router";
+
+export const Login = () => {
+  const [searchParams] = useSearchParams();
+  if (searchParams.get("oauth") == "success") {
+    const redirect_to = localStorage.getItem("redirect_after_login")
+    if (redirect_to) {
+      return (<Navigate replace to={ redirect_to } />);
+    }
+  }
+  return (
+    <AuthPage
+      type="login"
+      formProps={{ defaultValues: { email: "test@test.te", password: "test" }, }}
+      providers={[{
+          name: "google",
+          label: "Sign in with Google",
+          icon: (<GoogleIcon style={{ fontSize: 24, }} />),
+        },
+        {
+          name: "discord",
+          label: "Sign in with Discord",
+          icon: (<DiscordIcon style={{ fontSize: 24, }} />),
+        },
+      ]}
+    />
+  );
+};

gui/rpk-gui/src/components/auth/Register.tsx

@@ -0,0 +1,5 @@
+import { AuthPage } from "@refinedev/mui";
+
+export const Register = () => {
+  return <AuthPage type="register" />;
+};

gui/rpk-gui/src/components/auth/UpdatePassword.tsx

@@ -0,0 +1,6 @@
+import { AuthPage } from "@refinedev/mui";
+
+export const UpdatePassword = () => {
+
+  return <AuthPage type="updatePassword"/>;
+};