diff --git a/apps/client/src/common/components/input/colour-input/Swatch.tsx b/apps/client/src/common/components/input/colour-input/Swatch.tsx index 67c6fe34e..7ae5e0274 100644 --- a/apps/client/src/common/components/input/colour-input/Swatch.tsx +++ b/apps/client/src/common/components/input/colour-input/Swatch.tsx @@ -25,5 +25,11 @@ export default function Swatch(props: SwatchProps) { ); } + + if (color === 'unkown') { +
+ ? +
; + } return
; } diff --git a/apps/client/src/common/components/input/colour-input/SwatchSelect.tsx b/apps/client/src/common/components/input/colour-input/SwatchSelect.tsx index 7f78a7047..371a4e593 100644 --- a/apps/client/src/common/components/input/colour-input/SwatchSelect.tsx +++ b/apps/client/src/common/components/input/colour-input/SwatchSelect.tsx @@ -8,10 +8,12 @@ interface ColourInputProps { value: string; name: 'colour'; handleChange: (newValue: 'colour', name: string) => void; + isMultiple?: boolean; } const colours = [ '', + 'unkown', '#FFCC78', // $orange-400 '#FFAB33', // $orange-600 '#77C785', // $green-400 @@ -27,7 +29,7 @@ const colours = [ ]; export default function SwatchSelect(props: ColourInputProps) { - const { value, name, handleChange } = props; + const { value, name, handleChange, isMultiple } = props; const setColour = useCallback( (newValue: string) => { @@ -40,9 +42,15 @@ export default function SwatchSelect(props: ColourInputProps) { return (
- {colours.map((colour) => ( - - ))} + {colours + .filter((colour) => { + // Only include unkown if it is multiple + if (!isMultiple && colour === 'unkown') return false; + return true; + }) + .map((colour) => ( + + ))}
); } diff --git a/apps/client/src/features/rundown/event-editor/EventEditor.tsx b/apps/client/src/features/rundown/event-editor/EventEditor.tsx index 53c4bf3e4..5591f84f8 100644 --- a/apps/client/src/features/rundown/event-editor/EventEditor.tsx +++ b/apps/client/src/features/rundown/event-editor/EventEditor.tsx @@ -65,6 +65,7 @@ export default function EventEditor({ event, handleSubmit, isMultiple }: EventEd note={event.note} colour={event.colour} handleSubmit={handleSubmit} + isMultiple={isMultiple} />
diff --git a/apps/client/src/features/rundown/event-editor/EventEditorWrapper.tsx b/apps/client/src/features/rundown/event-editor/EventEditorWrapper.tsx index e12d90576..9c2dbcae5 100644 --- a/apps/client/src/features/rundown/event-editor/EventEditorWrapper.tsx +++ b/apps/client/src/features/rundown/event-editor/EventEditorWrapper.tsx @@ -15,7 +15,7 @@ import useRundown from '../../../common/hooks-query/useRundown'; import { useEventSelection } from '../useEventSelection'; import style from './EventEditor.module.scss'; -import EventEditorTest from './EventEditor'; +import EventEditor from './EventEditor'; export type EventEditorSubmitActions = keyof OntimeEvent; @@ -27,7 +27,6 @@ export default function EventEditorWrapper() { const { order, rundown } = data; const { updateEvent } = useEventAction(); const [_searchParams] = useSearchParams(); - console.log({ selectedEvents, order }, 'size: ', selectedEvents.size); const [event, setEvent] = useState(null); @@ -132,9 +131,9 @@ export default function EventEditorWrapper() { return (
{selectedEvents.size <= 1 ? ( - + ) : ( - + )}
); diff --git a/apps/client/src/features/rundown/event-editor/composite/EventEditorTitles.tsx b/apps/client/src/features/rundown/event-editor/composite/EventEditorTitles.tsx index 0e6d64c5c..55c7994c8 100644 --- a/apps/client/src/features/rundown/event-editor/composite/EventEditorTitles.tsx +++ b/apps/client/src/features/rundown/event-editor/composite/EventEditorTitles.tsx @@ -17,10 +17,11 @@ interface EventEditorTitlesProps { note: string; colour: string; handleSubmit: (field: EditorUpdateFields, value: string) => void; + isMultiple?: boolean; } const EventEditorTitles = (props: EventEditorTitlesProps) => { - const { eventId, cue, title, note, colour, handleSubmit } = props; + const { eventId, cue, title, note, colour, handleSubmit, isMultiple } = props; const cueSubmitHandler = (_field: string, newValue: string) => { handleSubmit('cue', sanitiseCue(newValue)); @@ -46,7 +47,7 @@ const EventEditorTitles = (props: EventEditorTitlesProps) => {
- +