initial admin site

client/src/components/Content.tsx

 import { Box, Container } from '@material-ui/core';
 import { Redirect, Route, Switch } from 'react-router-dom';
 
+import { GroupAdmin } from './admin/GroupAdmin';
 import { GroupInfo } from './group/GroupInfo';
 import { LoggedInHome } from './home/LoggedInHome';
 import { LoggedOutHome } from './home/LoggedOutHome';
@@ -16,13 +17,13 @@ export const Content: React.FC = () => {
         <Switch>
           <Route path="/groups">groups</Route>
           <Route path="/gyik">gyik</Route>
-          <Route path="/admin">admin</Route>
+          <Route path="/admin">Admin</Route>
           <Route path="/qr">qr</Route>
           <Route path="/profile/me">
             <SwitchComponentByAuth isLoggedIn={<OwnProfile />} notLoggedIn={<NotAuthorized />} />
           </Route>
           <Route path="/group/:id/info" component={GroupInfo} />
-          <Route path="/group/:id/admin" component={GroupInfo} />
+          <Route path="/group/:id/admin" component={GroupAdmin} />
           <Route exact path="/">
             <SwitchComponentByAuth isLoggedIn={<LoggedInHome />} notLoggedIn={<LoggedOutHome />} />
           </Route>

client/src/components/admin/GroupAdmin.tsx

+import { Card, CardContent, Grid, Typography, useTheme } from '@material-ui/core';
+
+import React from 'react';
+import { StyledLink } from '../utils/StyledLink';
+
+export const GroupAdmin: React.FC = () => {
+  const theme = useTheme();
+  return (
+    <Grid container spacing={1} justify="center">
+      <Grid item xs={12} md={4}>
+        <Card>
+          <CardContent>
+            <Typography variant="subtitle1">Csoport adatai</Typography>
+            <Typography variant="subtitle1">Neve: Some Csoport</Typography>
+            <Typography variant="subtitle1">
+              Leírása: Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis molestias eveniet voluptatum
+              repellendus, temporibus quod nisi beatae consequatur, voluptate optio illum aperiam quae possimus dolorum
+              sed inventore aut? Consequuntur, tempora.
+            </Typography>
+          </CardContent>
+        </Card>
+      </Grid>
+      <Grid item xs={12} md={5}>
+        <Grid container spacing={1}>
+          <Grid item xs={12}>
+            <Card>
+              <CardContent>
+                <Typography align="center" variant="subtitle1">
+                  13 Új jelentkező
+                </Typography>
+                <Typography align="center" variant="subtitle1">
+                  {/* TODO link to actual group */}
+                  <StyledLink to={`/group/1/admin/members/unaccepted`} style={{ color: theme.palette.primary.dark }}>
+                    Bírálás
+                  </StyledLink>
+                </Typography>
+              </CardContent>
+            </Card>
+          </Grid>
+          <Grid item xs={12}>
+            <Card>
+              <CardContent>
+                <Typography align="center" variant="subtitle1">
+                  7 Kölcsönzés
+                </Typography>
+                <Typography align="center" variant="subtitle1">
+                  {/* TODO link to actual group */}
+                  <StyledLink to={`/group/1/admin/rentals/active`} style={{ color: theme.palette.primary.dark }}>
+                    Kezelés
+                  </StyledLink>
+                </Typography>
+              </CardContent>
+            </Card>
+          </Grid>
+          <Grid item xs={12}>
+            <Card>
+              <CardContent>
+                <Typography align="center" variant="subtitle1">
+                  12 Hamarosan lejáró garancia
+                </Typography>
+                <Typography align="center" variant="subtitle1">
+                  {/* TODO link to actual group */}
+                  <StyledLink
+                    to={`/group/1/admin/documents?order_by=expire`}
+                    style={{ color: theme.palette.primary.dark }}
+                  >
+                    Megtekintés
+                  </StyledLink>
+                </Typography>
+              </CardContent>
+            </Card>
+          </Grid>
+        </Grid>
+      </Grid>
+      <Grid item xs={12} md={3}>
+        <Grid container spacing={1}>
+          <Grid item xs={12}>
+            {/* TODO link to actual group */}
+            <StyledLink to="/group/1/admin/members">
+              <Card>
+                <CardContent>
+                  <Typography align="center" variant="subtitle1">
+                    Tagok
+                  </Typography>
+                </CardContent>
+              </Card>
+            </StyledLink>
+          </Grid>
+          <Grid item xs={12}>
+            {/* TODO link to actual group */}
+            <StyledLink to="/group/1/admin/items">
+              <Card>
+                <CardContent>
+                  <Typography align="center" variant="subtitle1">
+                    Tárgyak
+                  </Typography>
+                </CardContent>
+              </Card>
+            </StyledLink>
+          </Grid>
+          <Grid item xs={12}>
+            {/* TODO link to actual group */}
+            <StyledLink to="/group/1/admin/storages">
+              <Card>
+                <CardContent>
+                  <Typography align="center" variant="subtitle1">
+                    Leltárak
+                  </Typography>
+                </CardContent>
+              </Card>
+            </StyledLink>
+          </Grid>
+          <Grid item xs={12}>
+            {/* TODO link to actual group */}
+            <StyledLink to="/group/1/admin/documents">
+              <Card>
+                <CardContent>
+                  <Typography align="center" variant="subtitle1">
+                    Dokumentumok
+                  </Typography>
+                </CardContent>
+              </Card>
+            </StyledLink>
+          </Grid>
+        </Grid>
+      </Grid>
+    </Grid>
+  );
+};