Use metadataQuery instead of metadataIdsQuery

frontend/packages/ux-editor/src/components/Properties/PropertiesHeader/EditComponentIdRow/EditComponentIdRow.tsx

@@ -11,7 +11,7 @@ import { useFormLayouts } from '../../../../hooks';
 import { findLayoutsContainingDuplicateComponents } from '../../../../utils/formLayoutUtils';
 import { useStudioEnvironmentParams } from 'app-shared/hooks/useStudioEnvironmentParams';
 import { ComponentType } from 'app-shared/types/ComponentType';
-import { useAppMetadataModelIdsQuery } from 'app-shared/hooks/queries/useAppMetadataModelIdsQuery';
+import { useAppMetadataQuery } from 'app-development/hooks/queries';
 
 export interface EditComponentIdRowProps {
   handleComponentUpdate: (component: FormItem) => void;
@@ -29,7 +29,7 @@ export const EditComponentIdRow = ({
     useLayoutSchemaQuery();
 
   const { org, app } = useStudioEnvironmentParams();
-  const { data: appMetadata } = useAppMetadataModelIdsQuery(org, app);
+  const { data: appMetadata } = useAppMetadataQuery(org, app);
   const [isViewMode, setIsViewMode] = useState(true);
   const [errorMessage, setErrorMessage] = useState<string | undefined>(null);
 
@@ -54,7 +54,7 @@ export const EditComponentIdRow = ({
     if (value !== component.id && idExists(value, formLayouts)) {
       return t('ux_editor.modal_properties_component_id_not_unique_error');
     }
-    const duplicateDatatypeId = appMetadata.find((modelId) => modelId === value);
+    const duplicateDatatypeId = appMetadata.dataTypes.find((modelId) => modelId.id === value);
     if (
       value !== component.id &&
       (component.type === ComponentType.FileUpload ||