diff --git a/app/packages/core/src/components/Filters/NumericFieldFilter/NumericFieldFilter.tsx b/app/packages/core/src/components/Filters/NumericFieldFilter/NumericFieldFilter.tsx index 144865f8d0a..18a98f80626 100644 --- a/app/packages/core/src/components/Filters/NumericFieldFilter/NumericFieldFilter.tsx +++ b/app/packages/core/src/components/Filters/NumericFieldFilter/NumericFieldFilter.tsx @@ -48,7 +48,9 @@ const NumericFieldFilter = ({ color, modal, named = true, path }: Props) => { const [showRange, setShowRange] = React.useState(!isGroup); const field = fos.useAssertedRecoilValue(fos.field(path)); const queryPerformance = useRecoilValue(fos.queryPerformance); - const hasBounds = useRecoilValue(state.hasBounds({ path, modal })); + const hasBounds = useRecoilValue( + state.hasBounds({ path, modal, shouldCalculate: !queryPerformance }) + ); if (!queryPerformance && named && !hasBounds) { return null; @@ -87,6 +89,7 @@ const NumericFieldFilter = ({ color, modal, named = true, path }: Props) => { color: theme.text.secondary, borderRadius: "8px", border: "1px solid " + theme.secondary.main, + height: "30px", }} > Filter by {name} diff --git a/app/packages/core/src/components/Filters/NumericFieldFilter/state.ts b/app/packages/core/src/components/Filters/NumericFieldFilter/state.ts index 7f4d6f119ba..42273576c08 100644 --- a/app/packages/core/src/components/Filters/NumericFieldFilter/state.ts +++ b/app/packages/core/src/components/Filters/NumericFieldFilter/state.ts @@ -7,9 +7,12 @@ export const FLOAT_NONFINITES: Nonfinite[] = ["inf", "ninf", "nan"]; export const hasBounds = selectorFamily({ key: "hasBounds", get: - (params: { path: string; modal: boolean }) => + (params: { path: string; modal: boolean; shouldCalculate: boolean }) => ({ get }) => { - return Boolean(get(boundsAtom(params))?.every((b) => b !== null)); + const shouldCalculate = params.shouldCalculate ?? true; + return shouldCalculate + ? Boolean(get(boundsAtom(params))?.every((b) => b !== null)) + : Boolean(false); }, }); diff --git a/app/packages/core/src/components/QueryPerformanceToast.tsx b/app/packages/core/src/components/QueryPerformanceToast.tsx index 74293f569c4..2432021eb59 100644 --- a/app/packages/core/src/components/QueryPerformanceToast.tsx +++ b/app/packages/core/src/components/QueryPerformanceToast.tsx @@ -1,14 +1,16 @@ import { Toast } from "@fiftyone/components"; -import { QP_MODE } from "@fiftyone/core"; +import { QP_MODE, QP_MODE_SUMMARY } from "@fiftyone/core"; import { getBrowserStorageEffectForKey } from "@fiftyone/state"; import { Box, Button, Typography } from "@mui/material"; import { Bolt } from "@mui/icons-material"; import React, { useEffect, useState } from "react"; import { createPortal } from "react-dom"; -import { atom, useRecoilState } from "recoil"; +import { atom, useRecoilState, useRecoilValue } from "recoil"; import { useTheme } from "@fiftyone/components"; +import * as atoms from "@fiftyone/state/src/recoil/atoms"; +import * as fos from "@fiftyone/state"; -const SHOWN_FOR = 5000; +const SHOWN_FOR = 10000; const hideQueryPerformanceToast = atom({ key: "hideQueryPerformanceToast", @@ -16,24 +18,33 @@ const hideQueryPerformanceToast = atom({ effects: [ getBrowserStorageEffectForKey("hideQueryPerformanceToast", { valueClass: "boolean", + sessionStorage: true, }), ], }); const QueryPerformanceToast = ({ - onClick = () => window.open(QP_MODE, "_blank")?.focus(), + onClick = (isFrameFilter: boolean) => { + const link = isFrameFilter ? QP_MODE_SUMMARY : QP_MODE; + window.open(link, "_blank")?.focus(); + }, onDispatch = (event) => { console.debug(event); }, text = "View Documentation", }) => { + const [path, setPath] = useState(""); + const indexed = useRecoilValue(fos.pathHasIndexes(path)); const [shown, setShown] = useState(false); const [disabled, setDisabled] = useRecoilState(hideQueryPerformanceToast); const element = document.getElementById("queryPerformance"); const theme = useTheme(); + const frameFields = useRecoilValue(atoms.frameFields); + useEffect(() => { const listen = (event) => { onDispatch(event); + setPath(event.path); setShown(true); }; window.addEventListener("queryperformance", listen); @@ -48,6 +59,11 @@ const QueryPerformanceToast = ({ return null; } + // don't show the toast if the path is already indexed + if (path && indexed) { + return null; + } + return createPortal( { + primary={() => { return ( ); }} - secondary={(setOpen) => { + secondary={() => { return (