From 7224c59b4dc3ac901473f8e66f218f5e704f9043 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Richard=20Trembeck=C3=BD?= <rtrembecky@gmail.com>
Date: Fri, 8 Dec 2023 15:51:31 +0100
Subject: [PATCH] React Admin - events, competitions, series - eh? (#233)

* react admin: event management (unfinished)

* unify pessimistic mutationMode with redirect to show

* MyCreate to unify redirect to show on create going forward

* some competition management, will be tested/adjusted later

* some series management

* new BE endpoint for competition slug, old used for ID access
---
 src/components/Admin/Admin.tsx                | 23 ++++++-
 .../Admin/custom/CompetitionField.tsx         | 13 ++++
 .../Admin/custom/CompetitionInput.tsx         | 13 ++++
 src/components/Admin/custom/JsonField.tsx     | 12 ++++
 src/components/Admin/custom/MyCreate.tsx      |  4 ++
 src/components/Admin/custom/MyEdit.tsx        | 10 ++++
 .../Admin/resources/cms/post/PostCreate.tsx   |  6 +-
 .../Admin/resources/cms/post/PostEdit.tsx     |  7 +--
 .../competition/CompetitionCreate.tsx         | 47 +++++++++++++++
 .../competition/CompetitionEdit.tsx           | 36 +++++++++++
 .../competition/CompetitionList.tsx           | 28 +++++++++
 .../competition/CompetitionShow.tsx           | 55 +++++++++++++++++
 .../competition/event/EventCreate.tsx         | 51 ++++++++++++++++
 .../resources/competition/event/EventEdit.tsx | 51 ++++++++++++++++
 .../resources/competition/event/EventList.tsx | 30 ++++++++++
 .../resources/competition/event/EventShow.tsx | 60 +++++++++++++++++++
 .../competition/series/SeriesEdit.tsx         | 26 ++++++++
 .../competition/series/SeriesList.tsx}        |  8 ++-
 .../competition/series/SeriesShow.tsx         | 43 +++++++++++++
 src/pages/strom/akcie/[[...params]].tsx       |  2 +-
 20 files changed, 511 insertions(+), 14 deletions(-)
 create mode 100644 src/components/Admin/custom/CompetitionField.tsx
 create mode 100644 src/components/Admin/custom/CompetitionInput.tsx
 create mode 100644 src/components/Admin/custom/JsonField.tsx
 create mode 100644 src/components/Admin/custom/MyCreate.tsx
 create mode 100644 src/components/Admin/custom/MyEdit.tsx
 create mode 100644 src/components/Admin/resources/competition/competition/CompetitionCreate.tsx
 create mode 100644 src/components/Admin/resources/competition/competition/CompetitionEdit.tsx
 create mode 100644 src/components/Admin/resources/competition/competition/CompetitionList.tsx
 create mode 100644 src/components/Admin/resources/competition/competition/CompetitionShow.tsx
 create mode 100644 src/components/Admin/resources/competition/event/EventCreate.tsx
 create mode 100644 src/components/Admin/resources/competition/event/EventEdit.tsx
 create mode 100644 src/components/Admin/resources/competition/event/EventList.tsx
 create mode 100644 src/components/Admin/resources/competition/event/EventShow.tsx
 create mode 100644 src/components/Admin/resources/competition/series/SeriesEdit.tsx
 rename src/components/Admin/{Competition/CompetitionList.tsx => resources/competition/series/SeriesList.tsx} (71%)
 create mode 100644 src/components/Admin/resources/competition/series/SeriesShow.tsx

diff --git a/src/components/Admin/Admin.tsx b/src/components/Admin/Admin.tsx
index 8ecdfa98..5d7f77d3 100644
--- a/src/components/Admin/Admin.tsx
+++ b/src/components/Admin/Admin.tsx
@@ -1,12 +1,22 @@
 import {FC} from 'react'
 import {Admin as ReactAdmin, Resource} from 'react-admin'
 
-import {CompetitionList} from './Competition/CompetitionList'
 import {dataProvider} from './dataProvider'
 import {PostCreate} from './resources/cms/post/PostCreate'
 import {PostEdit} from './resources/cms/post/PostEdit'
 import {PostList} from './resources/cms/post/PostList'
 import {PostShow} from './resources/cms/post/PostShow'
+import {CompetitionCreate} from './resources/competition/competition/CompetitionCreate'
+import {CompetitionEdit} from './resources/competition/competition/CompetitionEdit'
+import {CompetitionList} from './resources/competition/competition/CompetitionList'
+import {CompetitionShow} from './resources/competition/competition/CompetitionShow'
+import {EventCreate} from './resources/competition/event/EventCreate'
+import {EventEdit} from './resources/competition/event/EventEdit'
+import {EventList} from './resources/competition/event/EventList'
+import {EventShow} from './resources/competition/event/EventShow'
+import {SeriesEdit} from './resources/competition/series/SeriesEdit'
+import {SeriesList} from './resources/competition/series/SeriesList'
+import {SeriesShow} from './resources/competition/series/SeriesShow'
 import {useAuthProvider} from './useAuthProvider'
 
 export const Admin: FC = () => {
@@ -15,8 +25,15 @@ export const Admin: FC = () => {
   return (
     <ReactAdmin authProvider={authProvider} dataProvider={dataProvider}>
       <Resource name="cms/post" list={PostList} edit={PostEdit} show={PostShow} create={PostCreate} />
-      {/* TODO: create, edit, celkovo rozumne rozhranie pre sutaze/serie */}
-      <Resource name="competition/series" list={CompetitionList} />
+      <Resource name="competition/series" list={SeriesList} edit={SeriesEdit} show={SeriesShow} />
+      <Resource name="competition/event" list={EventList} edit={EventEdit} show={EventShow} create={EventCreate} />
+      <Resource
+        name="competition/competition"
+        list={CompetitionList}
+        edit={CompetitionEdit}
+        show={CompetitionShow}
+        create={CompetitionCreate}
+      />
     </ReactAdmin>
   )
 }
diff --git a/src/components/Admin/custom/CompetitionField.tsx b/src/components/Admin/custom/CompetitionField.tsx
new file mode 100644
index 00000000..29f31166
--- /dev/null
+++ b/src/components/Admin/custom/CompetitionField.tsx
@@ -0,0 +1,13 @@
+import {ComponentProps, FC} from 'react'
+import {SelectField, useGetList} from 'react-admin'
+
+export const CompetitionField: FC<ComponentProps<typeof SelectField>> = (props) => {
+  const {data, isLoading, error} = useGetList('competition/competition')
+
+  const typedData = data as {id: number; name: string}[]
+
+  if (isLoading) return <span>Loading...</span>
+  if (error) return <span>Error occured loading competitions: {error.message}</span>
+
+  return <SelectField choices={typedData} {...props} />
+}
diff --git a/src/components/Admin/custom/CompetitionInput.tsx b/src/components/Admin/custom/CompetitionInput.tsx
new file mode 100644
index 00000000..9017f65b
--- /dev/null
+++ b/src/components/Admin/custom/CompetitionInput.tsx
@@ -0,0 +1,13 @@
+import {ComponentProps, FC} from 'react'
+import {SelectInput, useGetList} from 'react-admin'
+
+export const CompetitionInput: FC<ComponentProps<typeof SelectInput>> = (props) => {
+  const {data, isLoading, error} = useGetList('competition/competition')
+
+  const typedData = data as {id: number; name: string}[]
+
+  if (isLoading) return <span>Loading...</span>
+  if (error) return <span>Error occured loading competitions: {error.message}</span>
+
+  return <SelectInput choices={typedData} {...props} />
+}
diff --git a/src/components/Admin/custom/JsonField.tsx b/src/components/Admin/custom/JsonField.tsx
new file mode 100644
index 00000000..202c2df3
--- /dev/null
+++ b/src/components/Admin/custom/JsonField.tsx
@@ -0,0 +1,12 @@
+import {FC} from 'react'
+import {FieldProps, useRecordContext} from 'react-admin'
+
+export const JsonField: FC<FieldProps> = ({source}) => {
+  const record = useRecordContext()
+  if (!record || !source) return null
+
+  const value = record[source]
+  const text = JSON.stringify(value, null, 2)
+
+  return <pre>{text}</pre>
+}
diff --git a/src/components/Admin/custom/MyCreate.tsx b/src/components/Admin/custom/MyCreate.tsx
new file mode 100644
index 00000000..173630b3
--- /dev/null
+++ b/src/components/Admin/custom/MyCreate.tsx
@@ -0,0 +1,4 @@
+import {FC, PropsWithChildren} from 'react'
+import {Create} from 'react-admin'
+
+export const MyCreate: FC<PropsWithChildren> = ({children}) => <Create redirect="show">{children}</Create>
diff --git a/src/components/Admin/custom/MyEdit.tsx b/src/components/Admin/custom/MyEdit.tsx
new file mode 100644
index 00000000..55f6fe9f
--- /dev/null
+++ b/src/components/Admin/custom/MyEdit.tsx
@@ -0,0 +1,10 @@
+import {FC, PropsWithChildren} from 'react'
+import {Edit} from 'react-admin'
+
+import {MyEditActions} from './MyEditActions'
+
+export const MyEdit: FC<PropsWithChildren> = ({children}) => (
+  <Edit actions={<MyEditActions />} mutationMode="pessimistic" redirect="show">
+    {children}
+  </Edit>
+)
diff --git a/src/components/Admin/resources/cms/post/PostCreate.tsx b/src/components/Admin/resources/cms/post/PostCreate.tsx
index a4f34eb5..36798b4c 100644
--- a/src/components/Admin/resources/cms/post/PostCreate.tsx
+++ b/src/components/Admin/resources/cms/post/PostCreate.tsx
@@ -1,7 +1,6 @@
 import {FC} from 'react'
 import {
   ArrayInput,
-  Create,
   DateTimeInput,
   FormTab,
   NumberInput,
@@ -11,10 +10,11 @@ import {
   TextInput,
 } from 'react-admin'
 
+import {MyCreate} from '@/components/Admin/custom/MyCreate'
 import {SitesCheckboxInput} from '@/components/Admin/custom/SitesCheckboxInput'
 
 export const PostCreate: FC = () => (
-  <Create redirect="show">
+  <MyCreate>
     <TabbedForm>
       <FormTab label="general">
         <NumberInput source="id" fullWidth disabled />
@@ -36,5 +36,5 @@ export const PostCreate: FC = () => (
         </ArrayInput>
       </FormTab>
     </TabbedForm>
-  </Create>
+  </MyCreate>
 )
diff --git a/src/components/Admin/resources/cms/post/PostEdit.tsx b/src/components/Admin/resources/cms/post/PostEdit.tsx
index 5f344b9b..4d8d3215 100644
--- a/src/components/Admin/resources/cms/post/PostEdit.tsx
+++ b/src/components/Admin/resources/cms/post/PostEdit.tsx
@@ -2,7 +2,6 @@ import {FC} from 'react'
 import {
   ArrayInput,
   DateTimeInput,
-  Edit,
   FormTab,
   NumberInput,
   required,
@@ -11,11 +10,11 @@ import {
   TextInput,
 } from 'react-admin'
 
-import {MyEditActions} from '@/components/Admin/custom/MyEditActions'
+import {MyEdit} from '@/components/Admin/custom/MyEdit'
 import {SitesCheckboxInput} from '@/components/Admin/custom/SitesCheckboxInput'
 
 export const PostEdit: FC = () => (
-  <Edit actions={<MyEditActions />} redirect="show" mutationMode="undoable">
+  <MyEdit>
     <TabbedForm>
       <FormTab label="general">
         <NumberInput source="id" fullWidth disabled />
@@ -37,5 +36,5 @@ export const PostEdit: FC = () => (
         </ArrayInput>
       </FormTab>
     </TabbedForm>
-  </Edit>
+  </MyEdit>
 )
diff --git a/src/components/Admin/resources/competition/competition/CompetitionCreate.tsx b/src/components/Admin/resources/competition/competition/CompetitionCreate.tsx
new file mode 100644
index 00000000..0a33a3da
--- /dev/null
+++ b/src/components/Admin/resources/competition/competition/CompetitionCreate.tsx
@@ -0,0 +1,47 @@
+import {FC} from 'react'
+import {
+  ArrayInput,
+  DateTimeInput,
+  FormTab,
+  NumberInput,
+  required,
+  SimpleFormIterator,
+  TabbedForm,
+  TextInput,
+} from 'react-admin'
+
+import {MyCreate} from '@/components/Admin/custom/MyCreate'
+import {SitesCheckboxInput} from '@/components/Admin/custom/SitesCheckboxInput'
+
+export const CompetitionCreate: FC = () => (
+  <MyCreate>
+    <TabbedForm>
+      <FormTab label="general">
+        {/* <NumberInput source="id" fullWidth disabled /> */}
+        <TextInput source="name" fullWidth validate={required()} />
+        <NumberInput source="start_year" fullWidth validate={required()} />
+        <TextInput source="description" fullWidth />
+        <TextInput source="rules" fullWidth />
+        {/* TODO: radio buttons / select */}
+        <NumberInput source="competition_type" fullWidth validate={required()} />
+        <NumberInput source="min_years_until_graduation" fullWidth />
+        <SitesCheckboxInput source="sites" validate={required()} />
+      </FormTab>
+      {/* maju sa dat eventy vytvarat pri tvoreni competition? */}
+      <FormTab label="events">
+        <ArrayInput source="event_set" defaultValue={[]}>
+          <SimpleFormIterator>
+            {/* <NumberInput source="id" fullWidth disabled /> */}
+            <NumberInput source="year" fullWidth />
+            <TextInput source="school_year" fullWidth /* validate={required()} */ />
+            <DateTimeInput source="start" fullWidth validate={required()} />
+            <DateTimeInput source="end" fullWidth validate={required()} />
+            <NumberInput source="competition" fullWidth />
+            {/* unspecifiedpublication_set: UnspecifiedPublication[]
+                registration_links: RegistrationLink[] */}
+          </SimpleFormIterator>
+        </ArrayInput>
+      </FormTab>
+    </TabbedForm>
+  </MyCreate>
+)
diff --git a/src/components/Admin/resources/competition/competition/CompetitionEdit.tsx b/src/components/Admin/resources/competition/competition/CompetitionEdit.tsx
new file mode 100644
index 00000000..06e8ef6f
--- /dev/null
+++ b/src/components/Admin/resources/competition/competition/CompetitionEdit.tsx
@@ -0,0 +1,36 @@
+import {FC} from 'react'
+import {ArrayInput, FormTab, NumberInput, required, SimpleFormIterator, TabbedForm, TextInput} from 'react-admin'
+
+import {MyEdit} from '@/components/Admin/custom/MyEdit'
+import {SitesCheckboxInput} from '@/components/Admin/custom/SitesCheckboxInput'
+
+export const CompetitionEdit: FC = () => (
+  <MyEdit>
+    <TabbedForm>
+      <FormTab label="general">
+        <NumberInput source="id" fullWidth disabled />
+        <TextInput source="name" fullWidth />
+        <NumberInput source="start_year" fullWidth />
+        <TextInput source="description" fullWidth />
+        <TextInput source="rules" fullWidth />
+        <NumberInput source="competition_type" fullWidth />
+        <NumberInput source="min_years_until_graduation" fullWidth />
+        <SitesCheckboxInput source="sites" validate={required()} />
+      </FormTab>
+      <FormTab label="events">
+        <ArrayInput source="event_set" defaultValue={[]}>
+          <SimpleFormIterator>
+            <NumberInput source="id" fullWidth disabled />
+            {/* unspecifiedpublication_set: UnspecifiedPublication[]
+                registration_links: RegistrationLink[] */}
+            <NumberInput source="year" fullWidth />
+            <TextInput source="shool_year" fullWidth /* validate={required()} */ />
+            <TextInput source="start" fullWidth validate={required()} />
+            <TextInput source="end" fullWidth validate={required()} />
+            <NumberInput source="competition" fullWidth />
+          </SimpleFormIterator>
+        </ArrayInput>
+      </FormTab>
+    </TabbedForm>
+  </MyEdit>
+)
diff --git a/src/components/Admin/resources/competition/competition/CompetitionList.tsx b/src/components/Admin/resources/competition/competition/CompetitionList.tsx
new file mode 100644
index 00000000..2401ff02
--- /dev/null
+++ b/src/components/Admin/resources/competition/competition/CompetitionList.tsx
@@ -0,0 +1,28 @@
+import {FC} from 'react'
+import {Datagrid, FunctionField, List, NumberField, RaRecord, TextField} from 'react-admin'
+
+import {SitesArrayField} from '@/components/Admin/custom/SitesArrayField'
+import {TruncatedTextField} from '@/components/Admin/custom/TruncatedTextField'
+
+export const CompetitionList: FC = () => (
+  <List>
+    <Datagrid rowClick="show">
+      <NumberField source="id" />
+      <TextField source="name" />
+      <TextField source="slug" />
+      <NumberField source="start_year" />
+      <TruncatedTextField source="description" maxTextWidth={30} />
+      <TruncatedTextField source="rules" maxTextWidth={30} />
+      {/* <NumberField source="competition_type.id" /> */}
+      <TextField source="competition_type.name" label="Competition type" />
+      <SitesArrayField source="sites" />
+      <TextField source="who_can_participate" />
+      <NumberField source="min_years_until_graduation" />
+      <FunctionField<RaRecord>
+        source="history_events"
+        label="History events count"
+        render={(record) => record && <span>{record['history_events'].length}</span>}
+      />
+    </Datagrid>
+  </List>
+)
diff --git a/src/components/Admin/resources/competition/competition/CompetitionShow.tsx b/src/components/Admin/resources/competition/competition/CompetitionShow.tsx
new file mode 100644
index 00000000..b022f33b
--- /dev/null
+++ b/src/components/Admin/resources/competition/competition/CompetitionShow.tsx
@@ -0,0 +1,55 @@
+import {FC} from 'react'
+import {
+  ArrayField,
+  Datagrid,
+  DateField,
+  NumberField,
+  Show,
+  SimpleShowLayout,
+  Tab,
+  TabbedShowLayout,
+  TextField,
+} from 'react-admin'
+
+import {JsonField} from '@/components/Admin/custom/JsonField'
+import {MyShowActions} from '@/components/Admin/custom/MyShowActions'
+import {SitesArrayField} from '@/components/Admin/custom/SitesArrayField'
+import {TruncatedTextField} from '@/components/Admin/custom/TruncatedTextField'
+
+export const CompetitionShow: FC = () => (
+  <Show actions={<MyShowActions />}>
+    <TabbedShowLayout>
+      <Tab label="general">
+        <SimpleShowLayout>
+          <NumberField source="id" />
+          <TextField source="name" />
+          <TextField source="slug" />
+          <NumberField source="start_year" />
+          <TextField source="description" />
+          <TruncatedTextField source="rules" maxTextWidth={200} />
+          <NumberField source="competition_type.id" />
+          <TextField source="competition_type.name" />
+          <SitesArrayField source="sites" />
+          <NumberField source="min_years_until_graduation" />
+          <TextField source="who_can_participate" />
+          <JsonField source="upcoming_or_current_event" />
+        </SimpleShowLayout>
+      </Tab>
+      <Tab label="history_events">
+        <SimpleShowLayout>
+          <ArrayField source="history_events">
+            <Datagrid>
+              <NumberField source="id" />
+              <NumberField source="year" />
+              <TextField source="school_year" />
+              <DateField source="start" />
+              <DateField source="end" />
+              <NumberField source="season_code" />
+              <NumberField source="competition" />
+            </Datagrid>
+          </ArrayField>
+        </SimpleShowLayout>
+      </Tab>
+    </TabbedShowLayout>
+  </Show>
+)
diff --git a/src/components/Admin/resources/competition/event/EventCreate.tsx b/src/components/Admin/resources/competition/event/EventCreate.tsx
new file mode 100644
index 00000000..ee5b682d
--- /dev/null
+++ b/src/components/Admin/resources/competition/event/EventCreate.tsx
@@ -0,0 +1,51 @@
+import {FC} from 'react'
+import {
+  ArrayInput,
+  DateTimeInput,
+  FormTab,
+  NumberInput,
+  required,
+  SimpleFormIterator,
+  TabbedForm,
+  TextInput,
+} from 'react-admin'
+
+import {CompetitionInput} from '@/components/Admin/custom/CompetitionInput'
+import {MyCreate} from '@/components/Admin/custom/MyCreate'
+
+export const EventCreate: FC = () => (
+  <MyCreate>
+    <TabbedForm>
+      <FormTab label="general">
+        <NumberInput source="id" fullWidth disabled />
+        <NumberInput source="year" fullWidth validate={required()} />
+        <TextInput source="school_year" fullWidth validate={required()} />
+        <span>napr. 2023/2024</span>
+        <DateTimeInput source="start" fullWidth validate={required()} />
+        <DateTimeInput source="end" fullWidth validate={required()} />
+        <CompetitionInput source="competition" fullWidth validate={required()} />
+
+        <span>TODO: always sends null as registration_link</span>
+        <TextInput source="registration_link" fullWidth hidden disabled defaultValue={null} parse={() => null} />
+        {/* <NumberInput source="registration_link.id" fullWidth disabled />
+        <TextInput source="registration_link.url" fullWidth />
+        <DateInput source="registration_link.start" fullWidth />
+        <DateInput source="registration_link.end" fullWidth />
+        <TextInput source="registration_link.additional_info" fullWidth /> */}
+      </FormTab>
+      <FormTab label="publications">
+        <span>TODO: publikacie treba vediet nahrat, nie tu editovat db</span>
+        <ArrayInput source="publication_set" defaultValue={[]}>
+          <SimpleFormIterator>
+            <NumberInput source="id" fullWidth disabled />
+            <TextInput source="name" fullWidth validate={required()} />
+            <TextInput source="file" fullWidth validate={required()} />
+            <NumberInput source="publication_type" fullWidth />
+            <NumberInput source="event" fullWidth disabled />
+            <NumberInput source="order" fullWidth />
+          </SimpleFormIterator>
+        </ArrayInput>
+      </FormTab>
+    </TabbedForm>
+  </MyCreate>
+)
diff --git a/src/components/Admin/resources/competition/event/EventEdit.tsx b/src/components/Admin/resources/competition/event/EventEdit.tsx
new file mode 100644
index 00000000..efb20c6a
--- /dev/null
+++ b/src/components/Admin/resources/competition/event/EventEdit.tsx
@@ -0,0 +1,51 @@
+import {FC} from 'react'
+import {
+  ArrayInput,
+  DateTimeInput,
+  FormTab,
+  NumberInput,
+  required,
+  SimpleFormIterator,
+  TabbedForm,
+  TextInput,
+} from 'react-admin'
+
+import {CompetitionInput} from '@/components/Admin/custom/CompetitionInput'
+import {MyEdit} from '@/components/Admin/custom/MyEdit'
+
+export const EventEdit: FC = () => (
+  <MyEdit>
+    <TabbedForm>
+      <FormTab label="general">
+        <NumberInput source="id" fullWidth disabled />
+        <NumberInput source="year" fullWidth validate={required()} />
+        <TextInput source="school_year" fullWidth validate={required()} />
+        <span>napr. 2023/2024</span>
+        <DateTimeInput source="start" fullWidth validate={required()} />
+        <DateTimeInput source="end" fullWidth validate={required()} />
+        <CompetitionInput source="competition" fullWidth validate={required()} />
+
+        <span>TODO: always sends null as registration_link</span>
+        <TextInput source="registration_link" fullWidth hidden disabled defaultValue={null} parse={() => null} />
+        {/* <NumberInput source="registration_link.id" fullWidth disabled />
+        <TextInput source="registration_link.url" fullWidth />
+        <DateInput source="registration_link.start" fullWidth />
+        <DateInput source="registration_link.end" fullWidth />
+        <TextInput source="registration_link.additional_info" fullWidth /> */}
+      </FormTab>
+      <FormTab label="publications">
+        <span>TODO: publikacie treba vediet nahrat, nie tu editovat db</span>
+        <ArrayInput source="publication_set" defaultValue={[]}>
+          <SimpleFormIterator>
+            <NumberInput source="id" fullWidth disabled />
+            <TextInput source="name" fullWidth validate={required()} />
+            <TextInput source="file" fullWidth validate={required()} />
+            <NumberInput source="publication_type" fullWidth />
+            <NumberInput source="event" fullWidth disabled />
+            <NumberInput source="order" fullWidth />
+          </SimpleFormIterator>
+        </ArrayInput>
+      </FormTab>
+    </TabbedForm>
+  </MyEdit>
+)
diff --git a/src/components/Admin/resources/competition/event/EventList.tsx b/src/components/Admin/resources/competition/event/EventList.tsx
new file mode 100644
index 00000000..5869f109
--- /dev/null
+++ b/src/components/Admin/resources/competition/event/EventList.tsx
@@ -0,0 +1,30 @@
+import {FC} from 'react'
+import {BooleanField, Datagrid, DateField, FunctionField, List, NumberField, RaRecord, TextField} from 'react-admin'
+
+import {CompetitionField} from '@/components/Admin/custom/CompetitionField'
+
+export const EventList: FC = () => (
+  <List>
+    <Datagrid rowClick="show">
+      <NumberField source="id" />
+      <CompetitionField source="competition" />
+      <NumberField source="year" />
+      <NumberField source="season_code" />
+      <TextField source="school_year" />
+      <DateField source="start" />
+      <DateField source="end" />
+      <TextField source="additional_name" />
+
+      <BooleanField source="can_participate" />
+      <BooleanField source="is_registered" />
+
+      <TextField source="registration_link.url" />
+
+      <FunctionField<RaRecord>
+        source="publication_set"
+        label="Publication count"
+        render={(record) => record && <span>{record['publication_set'].length}</span>}
+      />
+    </Datagrid>
+  </List>
+)
diff --git a/src/components/Admin/resources/competition/event/EventShow.tsx b/src/components/Admin/resources/competition/event/EventShow.tsx
new file mode 100644
index 00000000..ae4dc711
--- /dev/null
+++ b/src/components/Admin/resources/competition/event/EventShow.tsx
@@ -0,0 +1,60 @@
+import {FC} from 'react'
+import {
+  ArrayField,
+  BooleanField,
+  Datagrid,
+  DateField,
+  NumberField,
+  Show,
+  SimpleShowLayout,
+  Tab,
+  TabbedShowLayout,
+  TextField,
+} from 'react-admin'
+
+import {CompetitionField} from '@/components/Admin/custom/CompetitionField'
+import {MyShowActions} from '@/components/Admin/custom/MyShowActions'
+
+export const EventShow: FC = () => (
+  <Show actions={<MyShowActions />}>
+    <TabbedShowLayout>
+      <Tab label="general">
+        <SimpleShowLayout>
+          <TextField source="registration_link.url" />
+
+          <NumberField source="id" />
+          <CompetitionField source="competition" />
+          <NumberField source="year" />
+          <NumberField source="season_code" />
+          <TextField source="school_year" />
+          <DateField source="start" />
+          <DateField source="end" />
+          <TextField source="additional_name" />
+
+          <BooleanField source="can_participate" />
+          <BooleanField source="is_registered" />
+
+          <NumberField source="registration_link.id" />
+          <TextField source="registration_link.url" />
+          <DateField source="registration_link.start" />
+          <DateField source="registration_link.end" />
+          <TextField source="registration_link.additional_info" />
+        </SimpleShowLayout>
+      </Tab>
+      <Tab label="publications">
+        <SimpleShowLayout>
+          <ArrayField source="publication_set">
+            <Datagrid>
+              <NumberField source="id" />
+              <TextField source="name" />
+              <TextField source="file" />
+              <NumberField source="publication_type" />
+              <NumberField source="event" />
+              <NumberField source="order" />
+            </Datagrid>
+          </ArrayField>
+        </SimpleShowLayout>
+      </Tab>
+    </TabbedShowLayout>
+  </Show>
+)
diff --git a/src/components/Admin/resources/competition/series/SeriesEdit.tsx b/src/components/Admin/resources/competition/series/SeriesEdit.tsx
new file mode 100644
index 00000000..9d8b7b5c
--- /dev/null
+++ b/src/components/Admin/resources/competition/series/SeriesEdit.tsx
@@ -0,0 +1,26 @@
+import {FC} from 'react'
+import {ArrayInput, DateInput, FormTab, NumberInput, SimpleFormIterator, TabbedForm, TextInput} from 'react-admin'
+
+import {MyEdit} from '@/components/Admin/custom/MyEdit'
+
+// TODO: premysliet a prerobit rozhranie, mozno ako u postov - pri kliku na riadok ukazat Show, kde budu priklady
+// (nie ako teraz v zanorenom Datagride)
+export const SeriesEdit: FC = () => (
+  <MyEdit>
+    <TabbedForm>
+      <FormTab label="general">
+        <NumberInput source="id" fullWidth />
+        <DateInput source="deadline" fullWidth />
+        <TextInput source="order" fullWidth />
+      </FormTab>
+      <FormTab label="problems">
+        <ArrayInput source="problems">
+          <SimpleFormIterator>
+            <NumberInput source="id" fullWidth />
+            <TextInput source="text" fullWidth />
+          </SimpleFormIterator>
+        </ArrayInput>
+      </FormTab>
+    </TabbedForm>
+  </MyEdit>
+)
diff --git a/src/components/Admin/Competition/CompetitionList.tsx b/src/components/Admin/resources/competition/series/SeriesList.tsx
similarity index 71%
rename from src/components/Admin/Competition/CompetitionList.tsx
rename to src/components/Admin/resources/competition/series/SeriesList.tsx
index 9d2453ba..ab1f7e53 100644
--- a/src/components/Admin/Competition/CompetitionList.tsx
+++ b/src/components/Admin/resources/competition/series/SeriesList.tsx
@@ -1,18 +1,20 @@
 import {FC} from 'react'
 import {ArrayField, Datagrid, DateField, List, TextField} from 'react-admin'
 
+import {TruncatedTextField} from '@/components/Admin/custom/TruncatedTextField'
+
 // TODO: premysliet a prerobit rozhranie, mozno ako u postov - pri kliku na riadok ukazat Show, kde budu priklady
 // (nie ako teraz v zanorenom Datagride)
-export const CompetitionList: FC = () => (
+export const SeriesList: FC = () => (
   <List>
-    <Datagrid>
+    <Datagrid rowClick="show">
       <TextField source="id" />
       <DateField source="deadline" />
       <TextField source="order" />
       <ArrayField source="problems">
         <Datagrid>
           <TextField source="id" />
-          <TextField source="text" />
+          <TruncatedTextField source="text" maxTextWidth={50} />
         </Datagrid>
       </ArrayField>
     </Datagrid>
diff --git a/src/components/Admin/resources/competition/series/SeriesShow.tsx b/src/components/Admin/resources/competition/series/SeriesShow.tsx
new file mode 100644
index 00000000..76a10161
--- /dev/null
+++ b/src/components/Admin/resources/competition/series/SeriesShow.tsx
@@ -0,0 +1,43 @@
+import {FC} from 'react'
+import {
+  ArrayField,
+  BooleanField,
+  Datagrid,
+  DateField,
+  NumberField,
+  Show,
+  SimpleShowLayout,
+  Tab,
+  TabbedShowLayout,
+  TextField,
+} from 'react-admin'
+
+import {MyShowActions} from '@/components/Admin/custom/MyShowActions'
+import {TruncatedTextField} from '@/components/Admin/custom/TruncatedTextField'
+
+export const SeriesShow: FC = () => (
+  <Show actions={<MyShowActions />}>
+    <TabbedShowLayout>
+      <Tab label="general">
+        <SimpleShowLayout>
+          <TextField source="id" />
+          <DateField source="deadline" />
+          <TextField source="order" />
+          <NumberField source="semester" />
+          <BooleanField source="frozen_results" />
+          <BooleanField source="complete" />
+        </SimpleShowLayout>
+      </Tab>
+      <Tab label="problems">
+        <SimpleShowLayout>
+          <ArrayField source="problems">
+            <Datagrid>
+              <TextField source="id" />
+              <TruncatedTextField source="text" maxTextWidth={50} />
+            </Datagrid>
+          </ArrayField>
+        </SimpleShowLayout>
+      </Tab>
+    </TabbedShowLayout>
+  </Show>
+)
diff --git a/src/pages/strom/akcie/[[...params]].tsx b/src/pages/strom/akcie/[[...params]].tsx
index 492d3857..7cf9ebbf 100644
--- a/src/pages/strom/akcie/[[...params]].tsx
+++ b/src/pages/strom/akcie/[[...params]].tsx
@@ -45,7 +45,7 @@ export const competitionBasedGetServerSideProps =
 
       try {
         const {data} = await axios.get<OurCompetition | undefined>(
-          `${process.env.NEXT_PUBLIC_BE_PROTOCOL}://${process.env.NEXT_PUBLIC_BE_HOSTNAME}:${process.env.NEXT_PUBLIC_BE_PORT}/competition/competition/${requestedUrl}`,
+          `${process.env.NEXT_PUBLIC_BE_PROTOCOL}://${process.env.NEXT_PUBLIC_BE_HOSTNAME}:${process.env.NEXT_PUBLIC_BE_PORT}/competition/competition/slug/${requestedUrl}`,
         )
         if (!data) return redirectToSeminar