From b4747a3b5e3b4f6f8f9b3b5dc7a250f623a172eb Mon Sep 17 00:00:00 2001 From: Stefano Pigozzi Date: Sun, 10 Oct 2021 17:40:14 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=A7=20Start=20working=20on=20the=20`Gr?= =?UTF-8?q?oupCreateBox`?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/App.tsx | 6 +- .../src/components/group/GroupCreateBox.tsx | 61 +++++++++++++++++++ 2 files changed, 66 insertions(+), 1 deletion(-) create mode 100644 frontend/src/components/group/GroupCreateBox.tsx diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index eaccdd9..1d75e0f 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -6,6 +6,7 @@ import {AuthorizationRouter} from "./components/authorization/AuthorizationRoute import {AuthorizationStepPage} from "./components/authorization/AuthorizationStepPage" import {SophonFooter} from "./components/elements/SophonFooter" import {ErrorCatcherBox} from "./components/errors/ErrorCatcherBox" +import {GroupCreateBox} from "./components/group/GroupCreateBox" import {GroupListBox} from "./components/group/GroupListBox" import {GroupRouter} from "./components/group/GroupRouter" import {InstanceRouter} from "./components/instance/InstanceRouter" @@ -37,7 +38,10 @@ function App({..._}: RouteComponentProps) { } selectedRoute={() => <> } + unselectedRoute={(props) => <> + + + } selectedRoute={(props) => <> +} + + +export function GroupCreateBox({viewSet}: GroupCreateBoxProps): JSX.Element | null { + const authorization = useAuthorizationContext() + + const name = useFormState("", val => val.length > 0 ? true : undefined) + + const slug = name.value.replaceAll(/[^A-Za-z0-9-]/g, "-").toLowerCase() + + const description = useFormState("", val => val.length > 0 ? true : undefined) + + const availableMembers = useManagedViewSet("/api/core/users/", "id", authorization?.state.token !== undefined) + const membersOptions = React.useMemo( + () => availableMembers.resources?.filter(m => m.value.id !== authorization?.state.user?.id).map(m => ), + [availableMembers], + ) + const members = useFormState([], arr => arr.length > 0 ? true : undefined) + + const access = useFormState("", val => val.length > 0 ? true : undefined) + + if(!authorization?.state.token) { + return null + } + + return ( + + + Create a new group + +
+ + 0 ? true : undefined}/> + + + {membersOptions} + + + + + + + + + + Create + + + +
+ ) +}