Skip to content

Commit 7eaeee9

Browse files
findtopherfindtopher
authored
Merge pull request #3951 from voxel51/merge/v0.23.2-to-main
Merge release v0.23.2 to main
2 parents ccf8f24 + aa1e5d6 commit 7eaeee9

File tree

103 files changed

+3475
-1195
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

103 files changed

+3475
-1195
lines changed

‎app/packages/core/src/components/Actions/GroupMediaVisibilityContainer.tsx

+18-3
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,17 @@ const GroupMediaVisibilityPopout = ({
3838
const [isMainVisible, setIsMainVisible] = useRecoilState(
3939
fos.groupMediaIsMainVisibleSetting
4040
);
41+
const isNestedDynamicGroup = useRecoilValue(fos.isNestedDynamicGroup);
42+
const shouldRenderImaVid = useRecoilValue(fos.shouldRenderImaVidLooker);
43+
const dynamicGroupsViewMode = useRecoilValue(fos.dynamicGroupsViewMode);
44+
const hasGroupSlices = useRecoilValue(fos.hasGroupSlices);
45+
4146
const isSequentialAccessAllowed =
42-
useRecoilValue(fos.nonNestedDynamicGroupsViewMode) === "carousel";
47+
isNestedDynamicGroup ||
48+
dynamicGroupsViewMode === "carousel" ||
49+
hasGroupSlices;
50+
51+
const isImavidInNestedGroup = isNestedDynamicGroup && shouldRenderImaVid;
4352

4453
const checkboxes = useMemo(() => {
4554
const toReturn: React.ReactNode[] = [];
@@ -50,7 +59,9 @@ const GroupMediaVisibilityPopout = ({
5059
key="checkbox-3d-viewer"
5160
name={"3D Viewer"}
5261
value={isSlotVisible}
53-
muted={!isMainVisible && !isCarouselVisible}
62+
muted={
63+
isImavidInNestedGroup || (!isMainVisible && !isCarouselVisible)
64+
}
5465
setValue={(value) => setIsSlotVisible(value)}
5566
/>
5667
);
@@ -62,7 +73,10 @@ const GroupMediaVisibilityPopout = ({
6273
key="checkbox-carousel"
6374
name={"Carousel"}
6475
value={isCarouselVisible}
65-
muted={!(isSlotVisible && pointCloudSliceExists) && !isMainVisible}
76+
muted={
77+
isImavidInNestedGroup ||
78+
(!(isSlotVisible && pointCloudSliceExists) && !isMainVisible)
79+
}
6680
setValue={(value) => setIsCarouselVisible(value)}
6781
/>
6882
);
@@ -74,6 +88,7 @@ const GroupMediaVisibilityPopout = ({
7488
name={"Viewer"}
7589
value={isMainVisible}
7690
muted={
91+
isImavidInNestedGroup ||
7792
toReturn.length === 0 ||
7893
(!(isSlotVisible && pointCloudSliceExists) && !isCarouselVisible)
7994
}

‎app/packages/core/src/components/Actions/Options.tsx

+62-16
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ const MediaFields = ({ modal }) => {
8282
);
8383
const mediaFields = useRecoilValue(fos.mediaFields);
8484

85-
if (mediaFields.length <= 1) return null;
85+
if (!mediaFields || mediaFields?.length <= 1) return null;
8686

8787
return (
8888
<>
@@ -148,40 +148,56 @@ const SidebarMode = () => {
148148
};
149149

150150
const DynamicGroupsViewMode = ({ modal }: { modal: boolean }) => {
151-
const [mode, setMode] = useRecoilState(fos.nonNestedDynamicGroupsViewMode);
152-
const isImaVidLookerAvailable = useRecoilValue(fos.isImaVidLookerAvailable);
151+
const isOrderedDynamicGroup = useRecoilValue(fos.isOrderedDynamicGroup);
152+
const hasGroupSlices = useRecoilValue(fos.hasGroupSlices);
153+
154+
const [mode, setMode] = useRecoilState(fos.dynamicGroupsViewMode);
155+
const setIsCarouselVisible = useSetRecoilState(
156+
fos.groupMediaIsCarouselVisibleSetting
157+
);
158+
const setIsMainVisible = useSetRecoilState(
159+
fos.groupMediaIsMainVisibleSetting
160+
);
153161

154162
const tabOptions = useMemo(() => {
155163
const options = [
156-
{
157-
text: "carousel",
158-
title: "Sequential Access",
159-
onClick: () => setMode("carousel"),
160-
},
161164
{
162165
text: "pagination",
163166
title: "Random Access",
164167
onClick: () => setMode("pagination"),
165168
},
166169
];
167170

168-
if (isImaVidLookerAvailable) {
171+
if (!hasGroupSlices) {
172+
options.push({
173+
text: "carousel",
174+
title: "Sequential Access",
175+
onClick: () => {
176+
setMode("carousel");
177+
setIsCarouselVisible(true);
178+
},
179+
});
180+
}
181+
182+
if (isOrderedDynamicGroup) {
169183
options.push({
170184
text: "video",
171185
title: "Video",
172-
onClick: () => setMode("video"),
186+
onClick: () => {
187+
setMode("video");
188+
setIsMainVisible(true);
189+
},
173190
});
174191
}
175192

176193
return options;
177-
}, [isImaVidLookerAvailable]);
194+
}, [isOrderedDynamicGroup, hasGroupSlices]);
178195

179196
return (
180197
<>
181198
<PopoutSectionTitle>Dynamic Groups Navigation</PopoutSectionTitle>
182-
{modal ? (
183-
<TabOption active={mode} options={tabOptions} />
184-
) : (
199+
{modal && <TabOption active={mode} options={tabOptions} />}
200+
{isOrderedDynamicGroup && !modal && (
185201
<Checkbox
186202
name={"Render frames as video"}
187203
value={mode === "video"}
@@ -269,6 +285,36 @@ const Lightning = () => {
269285
);
270286
};
271287

288+
const HideFieldSetting = () => {
289+
const [hideNone, setHideNone] = useRecoilState(fos.hideNoneValuedFields);
290+
const theme = useTheme();
291+
292+
return (
293+
<>
294+
<ActionOption
295+
id="hide-none-valued-field-setting"
296+
text="Hide None fields"
297+
title={"More on hiding none fields"}
298+
style={{
299+
background: "unset",
300+
color: theme.text.primary,
301+
paddingTop: 0,
302+
paddingBottom: 0,
303+
}}
304+
svgStyles={{ height: "1rem", marginTop: 7.5 }}
305+
/>
306+
<TabOption
307+
active={hideNone ? "enable" : "disable"}
308+
options={["disable", "enable"].map((value) => ({
309+
text: value,
310+
title: value,
311+
onClick: () => setHideNone(value === "enable" ? true : false),
312+
}))}
313+
/>
314+
</>
315+
);
316+
};
317+
272318
type OptionsProps = {
273319
modal: boolean;
274320
anchorRef: RefObject<HTMLElement>;
@@ -277,12 +323,12 @@ type OptionsProps = {
277323
const Options = ({ modal, anchorRef }: OptionsProps) => {
278324
const isGroup = useRecoilValue(fos.isGroup);
279325
const isDynamicGroup = useRecoilValue(fos.isDynamicGroup);
280-
const isNonNestedDynamicGroup = useRecoilValue(fos.isNonNestedDynamicGroup);
281326
const view = useRecoilValue(fos.view);
282327

283328
return (
284329
<Popout modal={modal} fixed anchorRef={anchorRef}>
285-
{isNonNestedDynamicGroup && <DynamicGroupsViewMode modal={modal} />}
330+
{modal && <HideFieldSetting />}
331+
{isDynamicGroup && <DynamicGroupsViewMode modal={modal} />}
286332
{isGroup && !isDynamicGroup && <GroupStatistics modal={modal} />}
287333
<MediaFields modal={modal} />
288334
<Patches modal={modal} />

‎app/packages/core/src/components/Actions/Tagger.tsx

+35-9
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,12 @@ import {
33
PopoutSectionTitle,
44
useTheme,
55
} from "@fiftyone/components";
6-
import { FrameLooker, ImageLooker, VideoLooker } from "@fiftyone/looker";
6+
import {
7+
FrameLooker,
8+
ImaVidLooker,
9+
ImageLooker,
10+
VideoLooker,
11+
} from "@fiftyone/looker";
712
import * as fos from "@fiftyone/state";
813
import { Lookers, groupId, groupStatistics, refresher } from "@fiftyone/state";
914
import { getFetchFunction } from "@fiftyone/utilities";
@@ -320,13 +325,21 @@ const useTagCallback = (
320325
...[
321326
useRecoilRefresher_UNSTABLE(tagStatistics({ modal, labels: false })),
322327
useRecoilRefresher_UNSTABLE(tagStatistics({ modal, labels: true })),
328+
useRecoilRefresher_UNSTABLE(fos.activeModalSidebarSample),
323329
],
324330
];
325331

326332
return useRecoilCallback(
327333
({ snapshot, set, reset }) =>
328334
async ({ changes }) => {
329335
const isGroup = await snapshot.getPromise(fos.isGroup);
336+
const isNonNestedDynamicGroup = await snapshot.getPromise(
337+
fos.isNonNestedDynamicGroup
338+
);
339+
const isImaVidLookerActive = await snapshot.getPromise(
340+
fos.isOrderedDynamicGroup
341+
);
342+
330343
const slices = await snapshot.getPromise(fos.currentSlices(modal));
331344
const { samples } = await getFetchFunction()("POST", "/tag", {
332345
...tagParameters({
@@ -338,14 +351,15 @@ const useTagCallback = (
338351
modal ? fos.modalFilters : fos.filters
339352
),
340353
hiddenLabels: await snapshot.getPromise(fos.hiddenLabelsArray),
341-
groupData: isGroup
342-
? {
343-
id: modal ? await snapshot.getPromise(groupId) : null,
344-
slices,
345-
slice: await snapshot.getPromise(fos.groupSlice),
346-
mode: await snapshot.getPromise(groupStatistics(modal)),
347-
}
348-
: null,
354+
groupData:
355+
isGroup && !isNonNestedDynamicGroup
356+
? {
357+
id: modal ? await snapshot.getPromise(groupId) : null,
358+
slices,
359+
slice: await snapshot.getPromise(fos.groupSlice),
360+
mode: await snapshot.getPromise(groupStatistics(modal)),
361+
}
362+
: null,
349363
modal,
350364
sampleId: modal
351365
? await snapshot.getPromise(fos.sidebarSampleId)
@@ -373,6 +387,18 @@ const useTagCallback = (
373387
} else if (samples) {
374388
set(fos.refreshGroupQuery, (cur) => cur + 1);
375389
updateSamples(samples.map((sample) => [sample._id, sample]));
390+
391+
if (isImaVidLookerActive) {
392+
// assuming we're working with only one sample
393+
(
394+
lookerRef?.current as unknown as ImaVidLooker
395+
)?.frameStoreController.store?.updateSample(
396+
samples[0]._id,
397+
samples[0]
398+
);
399+
400+
lookerRef?.current?.updateSample(samples[0]);
401+
}
376402
}
377403

378404
set(fos.anyTagging, false);

‎app/packages/core/src/components/Actions/similar/utils.ts

+2
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ export const useSortBySimilarity = (close) => {
7272

7373
const view = await snapshot.getPromise(fos.view);
7474
const subscription = await snapshot.getPromise(fos.stateSubscription);
75+
const slice = await snapshot.getPromise(fos.sessionGroupSlice);
7576

7677
const { query, ...commonParams } = parameters;
7778

@@ -95,6 +96,7 @@ export const useSortBySimilarity = (close) => {
9596
subscription,
9697
filters,
9798
extended: toSnakeCase(combinedParameters),
99+
slice,
98100
});
99101
set(fos.similarityParameters, combinedParameters);
100102
close();

‎app/packages/core/src/components/Modal/Group/DynamicGroup/NestedGroup/index.tsx

+14-4
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,33 @@
11
import * as foq from "@fiftyone/relay";
2+
import * as fos from "@fiftyone/state";
23
import React, { Suspense } from "react";
34
import { PreloadedQuery } from "react-relay";
5+
import { useRecoilValue } from "recoil";
46
import { GroupSuspense } from "../../GroupSuspense";
57
import { GroupView } from "../../GroupView";
68
import { GroupElementsLinkBar } from "../pagination";
79

810
export const NestedGroup = ({
911
queryRef,
1012
}: {
11-
queryRef: PreloadedQuery<foq.paginateSamplesQuery>;
13+
queryRef?: PreloadedQuery<foq.paginateSamplesQuery> | null;
1214
}) => {
15+
const shouldRenderImaVid = useRecoilValue(fos.shouldRenderImaVidLooker);
16+
17+
if (!queryRef && !shouldRenderImaVid) {
18+
throw new Error("no queryRef provided");
19+
}
20+
1321
return (
1422
<>
1523
<GroupSuspense>
1624
<GroupView />
1725
</GroupSuspense>
18-
<Suspense>
19-
<GroupElementsLinkBar queryRef={queryRef} />
20-
</Suspense>
26+
{!shouldRenderImaVid && queryRef && (
27+
<Suspense>
28+
<GroupElementsLinkBar queryRef={queryRef} />
29+
</Suspense>
30+
)}
2131
</>
2232
);
2333
};

‎app/packages/core/src/components/Modal/Group/DynamicGroup/NonNestedGroup/index.tsx

+7-3
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ const ElementsContainer = styled.div`
2929
export const NonNestedDynamicGroup = ({
3030
queryRef,
3131
}: {
32-
queryRef: PreloadedQuery<foq.paginateSamplesQuery>;
32+
queryRef: PreloadedQuery<foq.paginateSamplesQuery> | null;
3333
}) => {
3434
const { lookerRefCallback } = useGroupContext();
3535
const lookerRef = useRef<fos.Lookers>();
@@ -38,7 +38,7 @@ export const NonNestedDynamicGroup = ({
3838
const [isBigLookerVisible, setIsBigLookerVisible] = useRecoilState(
3939
fos.groupMediaIsMainVisibleSetting
4040
);
41-
const viewMode = useRecoilValue(fos.nonNestedDynamicGroupsViewMode);
41+
const viewMode = useRecoilValue(fos.dynamicGroupsViewMode);
4242
const isCarouselVisible = useRecoilValue(
4343
fos.groupMediaIsCarouselVisibleSetting
4444
);
@@ -54,6 +54,10 @@ export const NonNestedDynamicGroup = ({
5454
return null;
5555
}
5656

57+
if (viewMode !== "video" && !queryRef) {
58+
throw new Error("no queryRef provided");
59+
}
60+
5761
return (
5862
<RootContainer>
5963
{/* weird conditional rendering of the bar because lookerControls messes up positioning of the bar in firefox in inexplicable ways */}
@@ -81,7 +85,7 @@ export const NonNestedDynamicGroup = ({
8185
</GroupSuspense>
8286
)}
8387
</>
84-
{viewMode === "pagination" && (
88+
{viewMode === "pagination" && queryRef && (
8589
<GroupElementsLinkBar queryRef={queryRef} />
8690
)}
8791
</ElementsContainer>

0 commit comments

Comments
 (0)