diff --git a/apps/client/src/common/components/delay-indicator/DelayIndicator.tsx b/apps/client/src/common/components/delay-indicator/DelayIndicator.tsx
index 71bc3711f..14b01a55d 100644
--- a/apps/client/src/common/components/delay-indicator/DelayIndicator.tsx
+++ b/apps/client/src/common/components/delay-indicator/DelayIndicator.tsx
@@ -7,7 +7,11 @@ import { millisToDelayString } from '../../utils/dateConfig';
import style from './DelayIndicator.module.scss';
-export default function DelayIndicator(props: { delayValue?: number }) {
+interface DelayIndicatorProps {
+ delayValue?: number;
+}
+
+export default function DelayIndicator(props: DelayIndicatorProps) {
const { delayValue } = props;
if (typeof delayValue === 'number') {
diff --git a/apps/client/src/common/hooks/useFollowComponent.ts b/apps/client/src/common/hooks/useFollowComponent.ts
index a949abf22..4054bb1d3 100644
--- a/apps/client/src/common/hooks/useFollowComponent.ts
+++ b/apps/client/src/common/hooks/useFollowComponent.ts
@@ -48,7 +48,7 @@ export default function useFollowComponent(props: UseFollowComponentProps) {
const scrollToRefComponent = useCallback(
(componentRef = followRef, containerRef = scrollRef, offset = topOffset) => {
- if (followRef.current && containerRef.current) {
+ if (componentRef.current && containerRef.current) {
// @ts-expect-error -- we know this are not null
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
scrollToComponent(componentRef!, scrollRef!, offset);
diff --git a/apps/client/src/features/operator/Operator.tsx b/apps/client/src/features/operator/Operator.tsx
index 5012af38a..437a7117d 100644
--- a/apps/client/src/features/operator/Operator.tsx
+++ b/apps/client/src/features/operator/Operator.tsx
@@ -1,7 +1,7 @@
import { useEffect, useRef, useState } from 'react';
import { useSearchParams } from 'react-router-dom';
-import { SupportedEvent, UserFields } from 'ontime-types';
-import { getLastEvent } from 'ontime-utils';
+import { isOntimeEvent, SupportedEvent, UserFields } from 'ontime-types';
+import { getFirstEvent, getLastEvent } from 'ontime-utils';
import NavigationMenu from '../../common/components/navigation-menu/NavigationMenu';
import Empty from '../../common/components/state/Empty';
@@ -63,9 +63,9 @@ export default function Operator() {
};
const handleScroll = () => {
- if (selectedRef && scrollRef) {
- const selectedRect = selectedRef.current?.getBoundingClientRect();
- const scrollerRect = scrollRef.current?.getBoundingClientRect();
+ if (selectedRef?.current && scrollRef?.current) {
+ const selectedRect = selectedRef.current.getBoundingClientRect();
+ const scrollerRect = scrollRef.current.getBoundingClientRect();
if (selectedRect && scrollerRect) {
const distanceFromTop = selectedRect.top - scrollerRect.top;
const hasScrolledOutOfThreshold = distanceFromTop < -8 || distanceFromTop > selectedOffset;
@@ -74,14 +74,10 @@ export default function Operator() {
}
};
- if (
- !data ||
- status === 'loading' ||
- !userFields ||
- userFieldsStatus === 'loading' ||
- !projectData ||
- projectDataStatus === 'loading'
- ) {
+ const missingData = !data || !userFields || !projectData;
+ const isLoading = status === 'loading' || userFieldsStatus === 'loading' || projectDataStatus === 'loading';
+
+ if (missingData || isLoading) {
return