feat: update modal and sighting components for improved layout and timestamp display
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import { Stage, Layer, Image, Rect } from "react-konva";
|
||||
import { Stage, Layer, Image, Rect, Text } from "react-konva";
|
||||
import type { SightingType } from "../../../../utils/types";
|
||||
import { useCreateVideoSnapshot } from "../../hooks/useCreateVideoSnapshot";
|
||||
import { useEffect, useState } from "react";
|
||||
@@ -96,6 +96,23 @@ const VideoFeed = ({ mostRecentSighting, isLoading, size, modeSetting, isModal =
|
||||
))}
|
||||
</Layer>
|
||||
)}
|
||||
<Layer>
|
||||
<Rect
|
||||
x={5}
|
||||
y={0.955 * size.height}
|
||||
width={size.width * 0.35}
|
||||
height={30}
|
||||
fill="rgba(255, 255, 255, 0.45)"
|
||||
cornerRadius={5}
|
||||
/>
|
||||
<Text
|
||||
text={`Overlay Mode: ${mode === 0 ? "None" : mode === 1 ? "Plate Highlight" : "Plate Track"}`}
|
||||
x={10}
|
||||
y={0.96 * size.height}
|
||||
fontSize={16}
|
||||
fill="#000000"
|
||||
/>
|
||||
</Layer>
|
||||
</Stage>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user