(
export const IconMolecule = (props: SVGIconProps) => (
);
+export const IconMoon = (props: SVGIconProps) => (
+
+);
export const IconMusicAudio = (props: SVGIconProps) => (
);
@@ -908,6 +915,9 @@ export const IconSortAscending = (props: SVGIconProps) => (
export const IconSortDescending = (props: SVGIconProps) => (
);
+export const IconSpiral = (props: SVGIconProps) => (
+
+);
export const IconSplit = (props: SVGIconProps) => (
);
@@ -926,6 +936,9 @@ export const IconStop = (props: SVGIconProps) => (
export const IconStopped = (props: SVGIconProps) => (
);
+export const IconSun = (props: SVGIconProps) => (
+
+);
export const IconSwap = (props: SVGIconProps) => (
);
@@ -1040,6 +1053,9 @@ export const IconVideoPlay = (props: SVGIconProps) => (
export const IconViewGlasses = (props: SVGIconProps) => (
);
+export const IconVisible = (props: SVGIconProps) => (
+
+);
export const IconWandb = (props: SVGIconProps) => (
);
@@ -1211,6 +1227,7 @@ const ICON_NAME_TO_ICON: Record
= {
model: IconModel,
'model-on-dark': IconModelOnDark,
molecule: IconMolecule,
+ moon: IconMoon,
'music-audio': IconMusicAudio,
'new-section-above': IconNewSectionAbove,
'new-section-below': IconNewSectionBelow,
@@ -1282,12 +1299,14 @@ const ICON_NAME_TO_ICON: Record = {
sort: IconSort,
'sort-ascending': IconSortAscending,
'sort-descending': IconSortDescending,
+ spiral: IconSpiral,
split: IconSplit,
square: IconSquare,
star: IconStar,
'star-filled': IconStarFilled,
stop: IconStop,
stopped: IconStopped,
+ sun: IconSun,
swap: IconSwap,
'sweep-bayes': IconSweepBayes,
'sweep-grid': IconSweepGrid,
@@ -1326,6 +1345,7 @@ const ICON_NAME_TO_ICON: Record = {
'vertex-gcp': IconVertexGCP,
'video-play': IconVideoPlay,
'view-glasses': IconViewGlasses,
+ visible: IconVisible,
wandb: IconWandb,
warning: IconWarning,
'warning-alt': IconWarningAlt,
diff --git a/weave-js/src/components/Icon/index.ts b/weave-js/src/components/Icon/index.ts
index 81839a71019..39c6eed3170 100644
--- a/weave-js/src/components/Icon/index.ts
+++ b/weave-js/src/components/Icon/index.ts
@@ -139,6 +139,7 @@ export {
IconModel,
IconModelOnDark,
IconMolecule,
+ IconMoon,
IconMusicAudio,
IconNewSectionAbove,
IconNewSectionBelow,
@@ -210,12 +211,14 @@ export {
IconSort,
IconSortAscending,
IconSortDescending,
+ IconSpiral,
IconSplit,
IconSquare,
IconStar,
IconStarFilled,
IconStop,
IconStopped,
+ IconSun,
IconSwap,
IconSweepBayes,
IconSweepGrid,
@@ -254,6 +257,7 @@ export {
IconVertexGCP,
IconVideoPlay,
IconViewGlasses,
+ IconVisible,
IconWandb,
IconWarning,
IconWarningAlt,
diff --git a/weave-js/src/components/Icon/types.ts b/weave-js/src/components/Icon/types.ts
index 55f46c52833..47f5f357adc 100644
--- a/weave-js/src/components/Icon/types.ts
+++ b/weave-js/src/components/Icon/types.ts
@@ -138,6 +138,7 @@ export const IconNames = {
Model: 'model',
ModelOnDark: 'model-on-dark',
Molecule: 'molecule',
+ Moon: 'moon',
MusicAudio: 'music-audio',
NewSectionAbove: 'new-section-above',
NewSectionBelow: 'new-section-below',
@@ -209,12 +210,14 @@ export const IconNames = {
Sort: 'sort',
SortAscending: 'sort-ascending',
SortDescending: 'sort-descending',
+ Spiral: 'spiral',
Split: 'split',
Square: 'square',
Star: 'star',
StarFilled: 'star-filled',
Stop: 'stop',
Stopped: 'stopped',
+ Sun: 'sun',
Swap: 'swap',
SweepBayes: 'sweep-bayes',
SweepGrid: 'sweep-grid',
@@ -253,6 +256,7 @@ export const IconNames = {
VertexGCP: 'vertex-gcp',
VideoPlay: 'video-play',
ViewGlasses: 'view-glasses',
+ Visible: 'visible',
Wandb: 'wandb',
Warning: 'warning',
WarningAlt: 'warning-alt',
diff --git a/weave-js/src/components/PagePanelComponents/Home/Browse3.tsx b/weave-js/src/components/PagePanelComponents/Home/Browse3.tsx
index 3517f4d3b9c..761fd536930 100644
--- a/weave-js/src/components/PagePanelComponents/Home/Browse3.tsx
+++ b/weave-js/src/components/PagePanelComponents/Home/Browse3.tsx
@@ -1,15 +1,5 @@
import {ApolloProvider} from '@apollo/client';
-import {Home} from '@mui/icons-material';
-import {
- AppBar,
- Box,
- Breadcrumbs,
- Drawer,
- IconButton,
- Link as MaterialLink,
- Toolbar,
- Typography,
-} from '@mui/material';
+import {Box, Drawer} from '@mui/material';
import {
GridColumnVisibilityModel,
GridFilterModel,
@@ -21,9 +11,7 @@ import {LicenseInfo} from '@mui/x-license';
import {makeGorillaApolloClient} from '@wandb/weave/apollo';
import {EVALUATE_OP_NAME_POST_PYDANTIC} from '@wandb/weave/components/PagePanelComponents/Home/Browse3/pages/common/heuristics';
import {opVersionKeyToRefUri} from '@wandb/weave/components/PagePanelComponents/Home/Browse3/pages/wfReactInterface/utilities';
-import _ from 'lodash';
import React, {
- ComponentProps,
FC,
useCallback,
useEffect,
@@ -33,7 +21,6 @@ import React, {
} from 'react';
import useMousetrap from 'react-hook-mousetrap';
import {
- Link as RouterLink,
Redirect,
Route,
Switch,
@@ -199,7 +186,6 @@ export const Browse3: FC<{
`/${URL_BROWSE3}`,
]}>
@@ -211,7 +197,6 @@ export const Browse3: FC<{
};
const Browse3Mounted: FC<{
- hideHeader?: boolean;
headerOffset?: number;
navigateAwayFromProject?: () => void;
}> = props => {
@@ -225,37 +210,6 @@ const Browse3Mounted: FC<{
overflow: 'auto',
flexDirection: 'column',
}}>
- {!props.hideHeader && (
- theme.zIndex.drawer + 1,
- height: '60px',
- flex: '0 0 auto',
- position: 'static',
- }}>
-
-
- theme.palette.getContrastText(theme.palette.primary.main),
- '&:hover': {
- color: theme =>
- theme.palette.getContrastText(theme.palette.primary.dark),
- },
- marginRight: theme => theme.spacing(2),
- }}>
-
-
-
-
-
- )}
@@ -1050,20 +1004,6 @@ const ComparePageBinding = () => {
return ;
};
-const AppBarLink = (props: ComponentProps) => (
- theme.palette.getContrastText(theme.palette.primary.main),
- '&:hover': {
- color: theme =>
- theme.palette.getContrastText(theme.palette.primary.dark),
- },
- }}
- {...props}
- component={RouterLink}
- />
-);
-
const PlaygroundPageBinding = () => {
const params = useParamsDecoded();
return (
@@ -1074,79 +1014,3 @@ const PlaygroundPageBinding = () => {
/>
);
};
-
-const Browse3Breadcrumbs: FC = props => {
- const params = useParamsDecoded();
- const query = useURLSearchParamsDict();
- const filePathParts = query.path?.split('/') ?? [];
- const refFields = query.extra?.split('/') ?? [];
-
- return (
-
- {params.entity && (
-
- {params.entity}
-
- )}
- {params.project && (
-
- {params.project}
-
- )}
- {params.tab && (
-
- {params.tab}
-
- )}
- {params.itemName && (
-
- {params.itemName}
-
- )}
- {params.version && (
-
- {params.version}
-
- )}
- {filePathParts.map((part, idx) => (
-
- {part}
-
- ))}
- {_.range(0, refFields.length, 2).map(idx => (
-
-
- theme.palette.getContrastText(theme.palette.primary.main),
- }}>
- {refFields[idx]}
-
-
- {refFields[idx + 1]}
-
-
- ))}
-
- );
-};
diff --git a/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/FeedbackSidebar.tsx b/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/FeedbackSidebar.tsx
index ef6bcbd69ff..0b3c9603fef 100644
--- a/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/FeedbackSidebar.tsx
+++ b/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/FeedbackSidebar.tsx
@@ -96,7 +96,7 @@ export const FeedbackSidebar = ({
Feedback
-
diff --git a/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx b/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx
index 7facffe9556..21dedf10ea0 100644
--- a/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx
+++ b/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx
@@ -53,17 +53,11 @@ export const HumanAnnotationCell: React.FC
= props => {
const feedbackSpecRef = props.hfSpec.ref;
useEffect(() => {
- if (!props.readOnly) {
- // We don't need to listen for feedback changes if the cell is editable
- // it is being controlled by local state
- return;
- }
return getTsClient().registerOnFeedbackListener(
props.callRef,
query.refetch
);
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, [props.callRef]);
+ }, [props.callRef, query.refetch, getTsClient]);
useEffect(() => {
if (foundFeedbackCallRef && props.callRef !== foundFeedbackCallRef) {
@@ -183,13 +177,22 @@ const FeedbackComponentSelector: React.FC<{
}) => {
const wrappedOnAddFeedback = useCallback(
async (value: any) => {
+ if (value == null || value === foundValue || value === '') {
+ // Remove from unsaved changes if value is invalid
+ setUnsavedFeedbackChanges(curr => {
+ const rest = {...curr};
+ delete rest[feedbackSpecRef];
+ return rest;
+ });
+ return true;
+ }
setUnsavedFeedbackChanges(curr => ({
...curr,
[feedbackSpecRef]: () => onAddFeedback(value),
}));
return true;
},
- [onAddFeedback, setUnsavedFeedbackChanges, feedbackSpecRef]
+ [onAddFeedback, setUnsavedFeedbackChanges, feedbackSpecRef, foundValue]
);
switch (type) {
@@ -346,21 +349,10 @@ export const NumericalFeedbackColumn = ({
focused?: boolean;
isInteger?: boolean;
}) => {
- const debouncedFn = useMemo(
- () =>
- _.debounce((val: number | null) => onAddFeedback?.(val), DEBOUNCE_VAL),
- [onAddFeedback]
- );
- useEffect(() => {
- return () => {
- debouncedFn.cancel();
- };
- }, [debouncedFn]);
-
return (
onAddFeedback?.(value)}
min={min}
max={max}
isInteger={isInteger}
@@ -415,7 +407,7 @@ export const TextFeedbackColumn = ({
placeholder=""
/>
{maxLength && (
-
+
{`Maximum characters: ${maxLength}`}
)}
@@ -446,7 +438,7 @@ export const EnumFeedbackColumn = ({
}));
return opts;
}, [options]);
- const [value, setValue] = useState