mirror of
https://github.com/estruyf/vscode-front-matter.git
synced 2026-07-06 18:01:24 +02:00
#671 - Fix on metadata update
This commit is contained in:
@@ -67,23 +67,23 @@ export const DetailsSlideOver: React.FunctionComponent<IDetailsSlideOverProps> =
|
||||
fields?.forEach((field) => {
|
||||
if (field.name === "title") {
|
||||
items.push(
|
||||
<DetailsItem title={l10n.t(LocalizationKey.dashboardMediaCommonTitle)} details={media.metadata.title || ""} />
|
||||
<DetailsItem key="title" title={l10n.t(LocalizationKey.dashboardMediaCommonTitle)} details={media.metadata.title || ""} />
|
||||
);
|
||||
} else if (field.name === "caption") {
|
||||
if (isImageFile) {
|
||||
items.push(
|
||||
<DetailsItem title={l10n.t(LocalizationKey.dashboardMediaCommonCaption)} details={media.metadata.caption || ""} />
|
||||
<DetailsItem key="caption" title={l10n.t(LocalizationKey.dashboardMediaCommonCaption)} details={media.metadata.caption || ""} />
|
||||
);
|
||||
}
|
||||
} else if (field.name === "alt") {
|
||||
if (isImageFile) {
|
||||
items.push(
|
||||
<DetailsItem title={l10n.t(LocalizationKey.dashboardMediaCommonAlt)} details={media.metadata.alt || ""} />
|
||||
<DetailsItem key="alt" title={l10n.t(LocalizationKey.dashboardMediaCommonAlt)} details={media.metadata.alt || ""} />
|
||||
);
|
||||
}
|
||||
} else {
|
||||
items.push(
|
||||
<DetailsItem title={field.title || field.name} details={(media.metadata[field.name] || "") as string} />
|
||||
<DetailsItem key={field.name} title={field.title || field.name} details={(media.metadata[field.name] || "") as string} />
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -11,16 +11,24 @@ export interface IMediaItemPanelProps {
|
||||
}
|
||||
|
||||
export const MediaItemPanel: React.FunctionComponent<IMediaItemPanelProps> = ({ allMedia }: React.PropsWithChildren<IMediaItemPanelProps>) => {
|
||||
const [crntPath, setCrntPath] = useState<string>('');
|
||||
const [media, setMedia] = useState<MediaInfo | undefined>(undefined);
|
||||
const [showForm, setShowForm] = useState(false);
|
||||
const [showDetails, setShowDetails] = useState(false);
|
||||
const [selectedItemAction, setSelectedItemAction] = useRecoilState(SelectedItemActionAtom);
|
||||
const { mediaFolder, mediaSize, mediaDimensions, isImage, isVideo } = useMediaInfo(media);
|
||||
|
||||
const onDismiss = () => {
|
||||
setShowDetails(false);
|
||||
setShowForm(false);
|
||||
setMedia(undefined);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (selectedItemAction && selectedItemAction.path) {
|
||||
const mediaFile = allMedia.find((m) => m.fsPath === selectedItemAction.path);
|
||||
setMedia(mediaFile);
|
||||
setCrntPath(selectedItemAction.path);
|
||||
|
||||
if (selectedItemAction.action === 'edit') {
|
||||
setShowForm(true);
|
||||
@@ -31,8 +39,11 @@ export const MediaItemPanel: React.FunctionComponent<IMediaItemPanelProps> = ({
|
||||
}
|
||||
|
||||
setSelectedItemAction(undefined);
|
||||
} else if (crntPath) {
|
||||
const mediaFile = allMedia.find((m) => m.fsPath === crntPath);
|
||||
setMedia(mediaFile);
|
||||
}
|
||||
}, [allMedia, selectedItemAction]);
|
||||
}, [allMedia, selectedItemAction, crntPath]);
|
||||
|
||||
if (showDetails && media) {
|
||||
return (
|
||||
@@ -47,11 +58,7 @@ export const MediaItemPanel: React.FunctionComponent<IMediaItemPanelProps> = ({
|
||||
isVideoFile={isVideo}
|
||||
onEdit={() => setShowForm(true)}
|
||||
onEditClose={() => setShowForm(false)}
|
||||
onDismiss={() => {
|
||||
setShowDetails(false);
|
||||
setShowForm(false);
|
||||
setMedia(undefined);
|
||||
}}
|
||||
onDismiss={onDismiss}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user