Implement GreetingEndView

admin-frontend/src/App.js

@@ -11,6 +11,7 @@ import { ScraperList } from './scraperList';
 import { orderList } from './questionOrderList';
 import { archiveList } from './archiveList';
 import { criteriaList } from './criteriaList';
+import { GreetingEndList, GreetingEndEdit } from './greetingEndList';
 
 import RestoreFromTrashIcon from '@material-ui/icons/RestoreFromTrash';
 import SportsKabaddiIcon from '@material-ui/icons/SportsKabaddi';
@@ -19,6 +20,7 @@ import SportsFootballIcon from '@material-ui/icons/SportsFootball';
 import ListAltIcon from '@material-ui/icons/ListAlt';
 import YoutubeSearchedForIcon from '@material-ui/icons/YoutubeSearchedFor';
 import FormatListNumberedIcon from '@material-ui/icons/FormatListNumbered';
+import EmojiPeopleIcon from '@material-ui/icons/EmojiPeople';
 
 
 const App = () => (
@@ -90,9 +92,10 @@ const App = () => (
     />
 
     <Resource
-      name='greeting'
-      list={ListGuesser}
-      edit={EditGuesser}
+      name='greeting-end'
+      icon={EmojiPeopleIcon}
+      list={GreetingEndList}
+      options={{ label: "Begrüßung & Endtext" }}
     />
   </Admin>
 );

admin-frontend/src/dataProviderMapper.js

@@ -20,7 +20,7 @@ import {
 const dataProviders = [
     {
         dataProvider: drfProvider('http://localhost:8000/api/admin'),
-        resources: ['sport', 'question', 'sport-archive', 'criteria', 'greeting'],
+        resources: ['sport', 'question', 'sport-archive', 'criteria', 'greeting-end'],
     },
     {
         dataProvider: sportIncompleteProvider('http://localhost:8000/api/admin'),

admin-frontend/src/greetingEndList.js

+import {
+    List,
+    Datagrid,
+    TextField,
+    Edit,
+    SimpleForm,
+    Pagination,
+    TextInput,
+    required,
+} from 'react-admin';
+
+import Chip from '@material-ui/core/Chip';
+import { makeStyles } from '@material-ui/core/styles';
+
+
+import Typography from '@material-ui/core/Typography';
+import Card from '@material-ui/core/Card';
+import CardContent from '@material-ui/core/CardContent';
+
+
+
+
+const AsideGreetingEndList = () => (
+    <div style={{
+        width: 400,
+        margin: '1em'
+    }}>
+        <Card>
+            <CardContent>
+                <Typography
+                    variant="h4"
+                    align="center"
+                >
+                    Tipps&Tricks
+                </Typography>
+                <br />
+                <ul>
+                    <li>Hier kann die Begrüßung und der Endtext verändert werden.</li>
+                    <br />
+                    <li>Wenn ein Eintrag gelöscht wird, so wird der Eintrag zu seinem Default-Wert zurückgesetzt.</li>
+                    <br />
+                </ul>
+
+            </CardContent>
+        </Card>
+    </div>
+);
+
+
+const useStyles = makeStyles({
+    Greeting: { color: 'white', background: 'blue' },
+    End: { color: 'black', background: 'lightGreen' },
+});
+
+const TypeChip = props => {
+    const classes = useStyles();
+
+    if (props.record === undefined) {
+        return null;
+    };
+
+
+    let verbose_type = "";
+    let class_name = "";
+    if (props.record.id === 1) {
+        verbose_type = "Begrüßung";
+        class_name = "Greeting";
+    } else {
+        verbose_type = "Endtext";
+        class_name = "End";
+    };
+
+    return (
+        <Chip label={verbose_type} className={classes[class_name]} />
+    );
+};
+
+
+const GreetingEndPagination = props => <Pagination rowsPerPageOptions={[]} {...props} />;
+
+
+export const GreetingEndList = props => (
+    <List {...props} pagination={<GreetingEndPagination />} mutationMode={"pessimistic"} bulkActionButtons={false} aside={<AsideGreetingEndList />}>
+        <Datagrid rowClick="expand" expand={GreetingEndEdit} mutationMode={"pessimistic"}>
+            <TypeChip source="id" label="Typ" sortable={false} />
+            <TextField source="text_de" label="Deutsche Übersetzung" sortable={false} />
+            <TextField source="text_en" label="Englische Übersetzung" sortable={false} />
+        </Datagrid>
+    </List>
+);
+
+export const GreetingEndEdit = props => (
+    <Edit {...props} mutationMode={"pessimistic"}>
+        <SimpleForm mutationMode={"pessimistic"}>
+            <TypeChip source="id" label="Typ" />
+            <TextInput source="text_de" label="Deutsche Übersetzung" validate={[required()]} fullWidth />
+            <TextInput source="text_en" label="Englische Übersetzung" validate={[required()]} fullWidth />
+        </SimpleForm>
+    </Edit>
+);
\ No newline at end of file