Can start Matrix authentication from UI

matrixgw_frontend/src/widgets/MatrixGWRouteContainer.tsx

@@ -0,0 +1,37 @@
+import { Typography } from "@mui/material";
+import React, { type PropsWithChildren } from "react";
+
+export function MatrixGWRouteContainer(
+  p: {
+    label: string | React.ReactElement;
+    actions?: React.ReactElement;
+  } & PropsWithChildren
+): React.ReactElement {
+  return (
+    <div
+      style={{
+        margin: "50px",
+        flexGrow: 1,
+        flexShrink: 0,
+        flexBasis: 0,
+        minWidth: 0,
+        display: "flex",
+        flexDirection: "column",
+      }}
+    >
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center",
+          marginBottom: "20px",
+        }}
+      >
+        <Typography variant="h4">{p.label}</Typography>
+        {p.actions ?? <></>}
+      </div>
+
+      {p.children}
+    </div>
+  );
+}

matrixgw_frontend/src/widgets/NotLinkedAccountMessage.tsx

@@ -0,0 +1,14 @@
+export function NotLinkedAccountMessage(): React.ReactElement {
+  return (
+    <div
+      style={{
+        flex: 1,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+      }}
+    >
+      Your Matrix account is not linked yet!
+    </div>
+  );
+}

matrixgw_frontend/src/widgets/dashboard/BaseAuthenticatedPage.tsx

@@ -124,7 +124,6 @@ export default function BaseAuthenticatedPage(): React.ReactElement {
                   flexDirection: "column",
                   flex: 1,
                   overflow: "auto",
-                  padding: "50px",
                 }}
               >
                 <Outlet />
@@ -137,6 +136,6 @@ export default function BaseAuthenticatedPage(): React.ReactElement {
   );
 }
 
-export function userUserInfo(): UserInfoContext {
+export function useUserInfo(): UserInfoContext {
   return React.use(UserInfoContextK)!;
 }

matrixgw_frontend/src/widgets/dashboard/DashboardHeader.tsx

@@ -14,7 +14,7 @@ import Tooltip from "@mui/material/Tooltip";
 import Typography from "@mui/material/Typography";
 import * as React from "react";
 import { RouterLink } from "../RouterLink";
-import { userUserInfo as useUserInfo } from "./BaseAuthenticatedPage";
+import { useUserInfo } from "./BaseAuthenticatedPage";
 import ThemeSwitcher from "./ThemeSwitcher";
 
 const AppBar = styled(MuiAppBar)(({ theme }) => ({

matrixgw_frontend/src/widgets/dashboard/DashboardSidebar.tsx

@@ -107,7 +107,7 @@ export default function DashboardSidebar({
             <DashboardSidebarPageItem
               title="Matrix link"
               icon={<Icon path={mdiLinkLock} size={"1.5em"} />}
-              href="/matrixlink"
+              href="/matrix_link"
             />
             <DashboardSidebarPageItem
               title="API tokens"