updated image loading

src/components/SightingsWidget/SightingWidget.tsx

@@ -29,7 +29,7 @@ export default function SightingHistoryWidget({
   className,
 }: SightingHistoryWidgetProps) {
   useNow(1000);
-  const { items, selectedRef, setSelectedRef } = useSightingFeedContext();
+  const { sightings, selectedRef, setSelectedRef } = useSightingFeedContext();
 
   const onRowClick = useCallback(
     (ref: number) => {
@@ -39,8 +39,8 @@ export default function SightingHistoryWidget({
   );
 
   const rows = useMemo(
-    () => items.filter(Boolean) as SightingWidgetType[],
-    [items]
+    () => sightings?.filter(Boolean) as SightingWidgetType[],
+    [sightings]
   );
 
   return (
@@ -49,7 +49,7 @@ export default function SightingHistoryWidget({
       <div className="flex flex-col gap-3 ">
         {/* Rows */}
         <div className="flex flex-col">
-          {rows.map((obj, idx) => {
+          {rows?.map((obj, idx) => {
             const isSelected = obj?.ref === selectedRef;
             const motionAway = (obj?.motion ?? "").toUpperCase() === "AWAY";
             const primaryIsColour = obj?.srcCam === 1;