Event editor continue (#722)

* refactor: remove info panel * feat: editor panel * wip: event info in drawer * chore: update tests * chore: add scss to processor
2026-08-10 18:03:47 +00:00 · 2024-01-22 16:23:11 +01:00
parent c7328a33f6
commit cb8ba776e2
86 changed files with 686 additions and 773 deletions
@@ -1,4 +1,3 @@
-@use "../../../theme/v2Styles" as *;
@use "../../../theme/mixins" as *;

 .link {
@@ -1,5 +1,3 @@
-@use '../../../theme/v2Styles' as *;
-
 .header {
  font-size: $inner-section-text-size;
  font-weight: 600;
@@ -1,5 +1,3 @@
-@use '../../../theme/v2Styles' as *;
-
 .delaySymbol {
  svg {
    font-size: 1.5rem;
@@ -1,5 +1,3 @@
-@use '../../../theme/v2Styles' as *;
-
 .errorContainer {
  width: 100%;
  height: 100%;
@@ -1,6 +1,3 @@
-@use '../../../theme/v2Styles' as *;
-@use '../../../theme/ontimeColours' as *;
-
 .link {
  display: flex;
  align-items: center;
@@ -4,6 +4,8 @@ import { Textarea, TextareaProps } from '@chakra-ui/react';
 import autosize from 'autosize/dist/autosize';

 export const AutoTextArea = (props: TextareaProps) => {
+  const { value } = props;
+
  const ref = useRef<HTMLTextAreaElement>(null);

  useEffect(() => {
@@ -12,7 +14,7 @@ export const AutoTextArea = (props: TextareaProps) => {
    return () => {
      autosize.destroy(node);
    };
-  }, []);
+  }, [value]);

  return (
    <Textarea
@@ -1,24 +1,23 @@
-
 .list {
  display: flex;
-  gap: 4px;
+  gap: 0.5rem
 }

 .swatch {
  cursor: pointer;
-  aspect-ratio: 1;
  width: 2rem;
  height: 2rem;
-  border-radius: 16px;
-  border: 4px solid #262626;
+  aspect-ratio: 1;
+  border-radius: 99px;
+  border: 2px solid $gray-1200;

  &.selected {
-    border: 2px solid #578AF4;
+    border: 2px solid $blue-500;
  }
 }

 .center {
  display: grid;
  place-content: center;
-  color: #578AF4;
-}
+  color: $ui-white;
+}
@@ -1,15 +1,13 @@
 import { useCallback } from 'react';

-import { EditorUpdateFields } from '../../../../features/event-editor/EventEditor';
-
 import Swatch from './Swatch';

 import style from './SwatchSelect.module.scss';

 interface ColourInputProps {
  value: string;
-  name: EditorUpdateFields;
-  handleChange: (newValue: EditorUpdateFields, name: string) => void;
+  name: 'colour';
+  handleChange: (newValue: 'colour', name: string) => void;
 }

 const colours = [
@@ -1,5 +1,3 @@
-@use '../../../../theme/v2Styles' as *;
-
 $input-font-size: 15px;

 .delayInput {
@@ -1,6 +1,3 @@
-@use "../../../../theme/_ontimeColours" as *;
-@use "../../../../theme/_v2Styles" as *;
-
 .swatch {
  width: 24px;
  height: 24px;
@@ -1,7 +1,7 @@
 import { useCallback, useRef } from 'react';
 import { Input, Textarea } from '@chakra-ui/react';

-import { EventEditorSubmitActions } from '../../../../features/event-editor/EventEditor';
+import { EventEditorSubmitActions } from '../../../../features/rundown/event-editor/EventEditor';
 import { Size } from '../../../models/Util.type';

 import useReactiveTextInput from './useReactiveTextInput';
@@ -1,5 +1,3 @@
-@use "../../../../theme/v2Styles" as *;
-
 $input-font-size: 15px;
 $input-delayed-border-color: #E69056;

@@ -1,5 +1,3 @@
-@use "../../../../theme/v2Styles" as *;
-
 $input-font-size: 15px;
 $input-delayed-border-color: #E69056;

@@ -1,6 +1,4 @@
-@use '../../../theme/v2Styles' as *;
@use '../../../theme/mixins' as *;
-@use '../../../theme/ontimeColours' as *;

 $menu-bg: $gray-1200;
 $menu-hover-bg: $gray-1350;
@@ -1,5 +1,3 @@
-@use '../../../theme/v2Styles' as *;
-
 .container {
  display: grid;
  place-content: center;
@@ -1,5 +1,3 @@
-@use '../../../theme/ontimeColours' as *;
-
 .emptyContainer {
  width: 100%;
  text-align: center;
@@ -1,6 +1,3 @@
-@use '../../../theme/v2Styles' as *;
-@use '../../../theme/ontimeColours' as *;
-
 .drawerContent {
  background-color: $gray-1250;
 }