administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-14 15:15:22 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix frigate+ dialog when using mobile page component

Browse Source
This commit is contained in:
Josh Hawkins 2024-09-12 14:21:26 -05:00
parent 3cdaccb6af
commit 764d80e1d9
1 changed files with 71 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
web/src/components/overlay/dialog/FrigatePlusDialog.tsx
View File

@ -13,6 +13,7 @@ import { Event } from "@/types/event";
import { FrigateConfig } from "@/types/frigateConfig"; import { FrigateConfig } from "@/types/frigateConfig";
import axios from "axios"; import axios from "axios";
import { useCallback, useMemo, useState } from "react"; import { useCallback, useMemo, useState } from "react";
import { isDesktop } from "react-device-detect";
import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch"; import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch";
import useSWR from "swr"; import useSWR from "swr";
@ -34,6 +35,9 @@ export function FrigatePlusDialog({
// layout // layout
const Title = isDesktop ? DialogTitle : "div";
const Description = isDesktop ? DialogDescription : "div";
const grow = useMemo(() => { const grow = useMemo(() => {
if (!config || !upload) { if (!config || !upload) {
return ""; return "";
@ -79,12 +83,25 @@ export function FrigatePlusDialog({
const content = ( const content = (
<TransformWrapper minScale={1.0} wheel={{ smoothStep: 0.005 }}> <TransformWrapper minScale={1.0} wheel={{ smoothStep: 0.005 }}>
<DialogHeader className={state == "submitted" ? "sr-only" : ""}> <div className="flex flex-col space-y-3">
<DialogTitle>Submit To Frigate+</DialogTitle> <DialogHeader
<DialogDescription> className={state == "submitted" ? "sr-only" : "text-left"}
>
<Title
className={
!isDesktop
? "text-lg font-semibold leading-none tracking-tight"
: undefined
}
>
Submit To Frigate+
</Title>
<Description
className={!isDesktop ? "text-sm text-muted-foreground" : undefined}
>
Objects in locations you want to avoid are not false positives. Objects in locations you want to avoid are not false positives.
Submitting them as false positives will confuse the model. Submitting them as false positives will confuse the model.
</DialogDescription> </Description>
</DialogHeader> </DialogHeader>
<TransformComponent <TransformComponent
wrapperStyle={{ wrapperStyle={{
@ -106,7 +123,7 @@ export function FrigatePlusDialog({
)} )}
</TransformComponent> </TransformComponent>
<DialogFooter> <DialogFooter className="flex flex-row justify-end gap-2">
{state == "reviewing" && ( {state == "reviewing" && (
<> <>
{dialog && <Button onClick={onClose}>Cancel</Button>} {dialog && <Button onClick={onClose}>Cancel</Button>}
@ -133,6 +150,7 @@ export function FrigatePlusDialog({
)} )}
{state == "uploading" && <ActivityIndicator />} {state == "uploading" && <ActivityIndicator />}
</DialogFooter> </DialogFooter>
</div>
</TransformWrapper> </TransformWrapper>
); );