mirror of
				https://github.com/blakeblackshear/frigate.git
				synced 2025-10-27 10:52:11 +01:00 
			
		
		
		
	UI Fixes (#13703)
* Respect ui configured timezone * Non alert videos are always 16:9
This commit is contained in:
		
							parent
							
								
									d84e3cacca
								
							
						
					
					
						commit
						87ab4e7c9b
					
				@ -91,13 +91,17 @@ export function AnimatedEventCard({
 | 
				
			|||||||
  const [alertVideos] = usePersistence("alertVideos", true);
 | 
					  const [alertVideos] = usePersistence("alertVideos", true);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const aspectRatio = useMemo(() => {
 | 
					  const aspectRatio = useMemo(() => {
 | 
				
			||||||
    if (!config || !Object.keys(config.cameras).includes(event.camera)) {
 | 
					    if (
 | 
				
			||||||
 | 
					      !config ||
 | 
				
			||||||
 | 
					      !alertVideos ||
 | 
				
			||||||
 | 
					      !Object.keys(config.cameras).includes(event.camera)
 | 
				
			||||||
 | 
					    ) {
 | 
				
			||||||
      return 16 / 9;
 | 
					      return 16 / 9;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    const detect = config.cameras[event.camera].detect;
 | 
					    const detect = config.cameras[event.camera].detect;
 | 
				
			||||||
    return detect.width / detect.height;
 | 
					    return detect.width / detect.height;
 | 
				
			||||||
  }, [config, event]);
 | 
					  }, [alertVideos, config, event]);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
    <Tooltip>
 | 
					    <Tooltip>
 | 
				
			||||||
 | 
				
			|||||||
@ -50,6 +50,7 @@ export default function ReviewCard({
 | 
				
			|||||||
  const formattedDate = useFormattedTimestamp(
 | 
					  const formattedDate = useFormattedTimestamp(
 | 
				
			||||||
    event.start_time,
 | 
					    event.start_time,
 | 
				
			||||||
    config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p",
 | 
					    config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p",
 | 
				
			||||||
 | 
					    config?.ui.timezone,
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
  const isSelected = useMemo(
 | 
					  const isSelected = useMemo(
 | 
				
			||||||
    () =>
 | 
					    () =>
 | 
				
			||||||
 | 
				
			|||||||
@ -42,6 +42,7 @@ export default function SearchThumbnail({
 | 
				
			|||||||
  const formattedDate = useFormattedTimestamp(
 | 
					  const formattedDate = useFormattedTimestamp(
 | 
				
			||||||
    searchResult.start_time,
 | 
					    searchResult.start_time,
 | 
				
			||||||
    config?.ui.time_format == "24hour" ? "%b %-d, %H:%M" : "%b %-d, %I:%M %p",
 | 
					    config?.ui.time_format == "24hour" ? "%b %-d, %H:%M" : "%b %-d, %I:%M %p",
 | 
				
			||||||
 | 
					    config?.ui.timezone,
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
 | 
				
			|||||||
@ -73,6 +73,7 @@ export default function ReviewDetailDialog({
 | 
				
			|||||||
    config?.ui.time_format == "24hour"
 | 
					    config?.ui.time_format == "24hour"
 | 
				
			||||||
      ? "%b %-d %Y, %H:%M"
 | 
					      ? "%b %-d %Y, %H:%M"
 | 
				
			||||||
      : "%b %-d %Y, %I:%M %p",
 | 
					      : "%b %-d %Y, %I:%M %p",
 | 
				
			||||||
 | 
					    config?.ui.timezone,
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  // content
 | 
					  // content
 | 
				
			||||||
 | 
				
			|||||||
@ -227,6 +227,7 @@ function ObjectDetailsTab({
 | 
				
			|||||||
    config?.ui.time_format == "24hour"
 | 
					    config?.ui.time_format == "24hour"
 | 
				
			||||||
      ? "%b %-d %Y, %H:%M"
 | 
					      ? "%b %-d %Y, %H:%M"
 | 
				
			||||||
      : "%b %-d %Y, %I:%M %p",
 | 
					      : "%b %-d %Y, %I:%M %p",
 | 
				
			||||||
 | 
					    config?.ui.timezone,
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const score = useMemo(() => {
 | 
					  const score = useMemo(() => {
 | 
				
			||||||
 | 
				
			|||||||
@ -168,6 +168,7 @@ export default function PreviewThumbnailPlayer({
 | 
				
			|||||||
  const formattedDate = useFormattedTimestamp(
 | 
					  const formattedDate = useFormattedTimestamp(
 | 
				
			||||||
    review.start_time,
 | 
					    review.start_time,
 | 
				
			||||||
    config?.ui.time_format == "24hour" ? "%b %-d, %H:%M" : "%b %-d, %I:%M %p",
 | 
					    config?.ui.time_format == "24hour" ? "%b %-d, %H:%M" : "%b %-d, %I:%M %p",
 | 
				
			||||||
 | 
					    config?.ui?.timezone,
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
 | 
				
			|||||||
@ -2,12 +2,17 @@ import { FrigateConfig } from "@/types/frigateConfig";
 | 
				
			|||||||
import { formatUnixTimestampToDateTime } from "@/utils/dateUtil";
 | 
					import { formatUnixTimestampToDateTime } from "@/utils/dateUtil";
 | 
				
			||||||
import { useMemo } from "react";
 | 
					import { useMemo } from "react";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export function useFormattedTimestamp(timestamp: number, format: string) {
 | 
					export function useFormattedTimestamp(
 | 
				
			||||||
 | 
					  timestamp: number,
 | 
				
			||||||
 | 
					  format: string,
 | 
				
			||||||
 | 
					  timezone?: string,
 | 
				
			||||||
 | 
					) {
 | 
				
			||||||
  const formattedTimestamp = useMemo(() => {
 | 
					  const formattedTimestamp = useMemo(() => {
 | 
				
			||||||
    return formatUnixTimestampToDateTime(timestamp, {
 | 
					    return formatUnixTimestampToDateTime(timestamp, {
 | 
				
			||||||
 | 
					      timezone,
 | 
				
			||||||
      strftime_fmt: format,
 | 
					      strftime_fmt: format,
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
  }, [format, timestamp]);
 | 
					  }, [format, timestamp, timezone]);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return formattedTimestamp;
 | 
					  return formattedTimestamp;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user