Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): fix metadata display issue

Browse Source
This commit is contained in:
psychedelicious 2024-03-01 09:57:26 +11:00
parent bbbd18f119
commit 8b03af391a
3 changed files with 16 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
invokeai/frontend/web/src/features/metadata/hooks/useMetadataItem.tsx
View File

@ -18,7 +18,7 @@ export const useMetadataItem = <T,>(metadata: unknown, handlers: MetadataHandler
const [value, setValue] = useState<T | typeof MetadataParsePendingToken | typeof MetadataParseFailedToken>(
MetadataParsePendingToken
);
const [renderedValue, setRenderedValue] = useState<React.ReactNode>(Pending);
const [renderedValueInternal, setRenderedValueInternal] = useState<React.ReactNode>(null);
useEffect(() => {
const _parse = async () => {
@ -39,26 +39,32 @@ export const useMetadataItem = <T,>(metadata: unknown, handlers: MetadataHandler
useEffect(() => {
const _renderValue = async () => {
if (value === MetadataParsePendingToken) {
setRenderedValue(Pending);
setRenderedValueInternal(null);
return;
}
if (value === MetadataParseFailedToken) {
setRenderedValue(Failed);
setRenderedValueInternal(null);
return;
}
const rendered = await handlers.renderValue(value);
if (typeof rendered === 'string') {
setRenderedValue(<Text>{rendered}</Text>);
return;
}
setRenderedValue(rendered);
setRenderedValueInternal(rendered);
};
_renderValue();
}, [handlers, value]);
const renderedValue = useMemo(() => {
if (value === MetadataParsePendingToken) {
return <Pending />;
}
if (value === MetadataParseFailedToken) {
return <Failed />;
}
return <Text>{renderedValueInternal}</Text>;
}, [renderedValueInternal, value]);
const onRecall = useCallback(() => {
if (!handlers.recall || value === MetadataParsePendingToken || value === MetadataParseFailedToken) {
return null;

2
invokeai/frontend/web/src/features/metadata/types.ts
View File

@ -4,7 +4,7 @@ import type { O } from 'ts-toolbelt';
/**
* Renders a value of type T as a React node.
*/
export type MetadataRenderValueFunc<T> = (value: T) => Promise<React.ReactNode>;
export type MetadataRenderValueFunc<T> = (value: T) => Promise<string>;
/**
* Gets the label of the current metadata item as a string.

2
invokeai/frontend/web/src/features/metadata/util/handlers.ts
View File

@ -150,7 +150,7 @@ const buildRecallItem =
}
};
const resolveToString = (value: unknown) => new Promise<React.ReactNode>((resolve) => resolve(String(value)));
const resolveToString = (value: unknown) => new Promise<string>((resolve) => resolve(String(value)));
const buildHandlers: BuildMetadataHandlers = ({
getLabel,