From 1fe27c2002624477c330c04508650fb3a3d20b99 Mon Sep 17 00:00:00 2001
From: Stefano Pigozzi <me@steffo.eu>
Date: Tue, 12 Oct 2021 02:17:54 +0200
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Create=20GroupDescriptionBox?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/App.tsx                          | 22 ++++++++++--------
 .../authorization/AuthorizationStepPage.tsx   |  2 --
 .../components/group/GroupDescriptionBox.tsx  | 23 +++++++++++++++++++
 3 files changed, 36 insertions(+), 11 deletions(-)
 create mode 100644 frontend/src/components/group/GroupDescriptionBox.tsx

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 1d75e0f..e619ebc 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -7,8 +7,10 @@ import {AuthorizationStepPage} from "./components/authorization/AuthorizationSte
 import {SophonFooter} from "./components/elements/SophonFooter"
 import {ErrorCatcherBox} from "./components/errors/ErrorCatcherBox"
 import {GroupCreateBox} from "./components/group/GroupCreateBox"
+import {GroupDescriptionBox} from "./components/group/GroupDescriptionBox"
 import {GroupListBox} from "./components/group/GroupListBox"
 import {GroupRouter} from "./components/group/GroupRouter"
+import {InstanceDescriptionBox} from "./components/instance/InstanceDescriptionBox"
 import {InstanceRouter} from "./components/instance/InstanceRouter"
 import {InstanceStepPage} from "./components/instance/InstanceStepPage"
 import {NotebookListBox} from "./components/notebook/NotebookListBox"
@@ -31,6 +33,7 @@ function App({..._}: RouteComponentProps) {
                     <InstanceStepPage/>
                 </>}
                 selectedRoute={() => <>
+                    <InstanceDescriptionBox/>
                     <AuthorizationProvider>
                         <AuthorizationRouter
                             unselectedRoute={() => <>
@@ -38,18 +41,19 @@ function App({..._}: RouteComponentProps) {
                             </>}
                             selectedRoute={() => <>
                                 <GroupRouter
-                                    unselectedRoute={(props) => <>
-                                        <GroupListBox viewSet={props.viewSet}/>
-                                        <GroupCreateBox viewSet={props.viewSet}/>
+                                    unselectedRoute={({viewSet}) => <>
+                                        <GroupListBox viewSet={viewSet}/>
+                                        <GroupCreateBox viewSet={viewSet}/>
                                     </>}
-                                    selectedRoute={(props) => <>
+                                    selectedRoute={({selection}) => <>
+                                        <GroupDescriptionBox resource={selection}/>
                                         <ProjectRouter
-                                            groupPk={props.selection.value.slug}
-                                            unselectedRoute={(props) => <ProjectListBox viewSet={props.viewSet}/>}
-                                            selectedRoute={(props) => <>
+                                            groupPk={selection.value.slug}
+                                            unselectedRoute={({viewSet}) => <ProjectListBox viewSet={viewSet}/>}
+                                            selectedRoute={({selection}) => <>
                                                 <NotebookRouter
-                                                    projectPk={props.selection.value.slug}
-                                                    unselectedRoute={(props) => <NotebookListBox viewSet={props.viewSet}/>}
+                                                    projectPk={selection.value.slug}
+                                                    unselectedRoute={({viewSet}) => <NotebookListBox viewSet={viewSet}/>}
                                                     selectedRoute={DebugBox}
                                                 />
                                             </>}
diff --git a/frontend/src/components/authorization/AuthorizationStepPage.tsx b/frontend/src/components/authorization/AuthorizationStepPage.tsx
index aa3ada5..29570b0 100644
--- a/frontend/src/components/authorization/AuthorizationStepPage.tsx
+++ b/frontend/src/components/authorization/AuthorizationStepPage.tsx
@@ -1,7 +1,6 @@
 import {Chapter} from "@steffo/bluelib-react"
 import * as React from "react"
 import {useAuthorizationContext} from "../../contexts/authorization"
-import {InstanceDescriptionBox} from "../instance/InstanceDescriptionBox"
 import {AuthorizationAdminBox} from "./AuthorizationAdminBox"
 import {AuthorizationBrowseBox} from "./AuthorizationBrowseBox"
 import {AuthorizationLoginBox} from "./AuthorizationLoginBox"
@@ -43,7 +42,6 @@ export function AuthorizationStepPage(): JSX.Element {
     )
 
     return <>
-        <InstanceDescriptionBox/>
         {loginChapter}
         <Chapter>
             <AuthorizationAdminBox/>
diff --git a/frontend/src/components/group/GroupDescriptionBox.tsx b/frontend/src/components/group/GroupDescriptionBox.tsx
new file mode 100644
index 0000000..fa44fbf
--- /dev/null
+++ b/frontend/src/components/group/GroupDescriptionBox.tsx
@@ -0,0 +1,23 @@
+import {Box, Heading} from "@steffo/bluelib-react"
+import * as React from "react"
+import {ManagedResource} from "../../hooks/useManagedViewSet"
+import {SophonResearchGroup} from "../../types/SophonTypes"
+
+
+export interface GroupDescriptionBoxProps {
+    resource: ManagedResource<SophonResearchGroup>
+}
+
+
+export function GroupDescriptionBox({resource}: GroupDescriptionBoxProps): JSX.Element {
+    return (
+        <Box>
+            <Heading level={3}>
+                {resource.value.name}
+            </Heading>
+            <pre>
+                {resource.value.description}
+            </pre>
+        </Box>
+    )
+}