chore(ui): add initialOptions prop in tag suggestion component (#14085

) * chore(ui): add initialData prop in tag suggestion component * address comment
open-metadata · Nov 23, 2023 · 631145d · 631145d
1 parent c95de19
commit 631145d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 5 deletions.
diff --git a/...data-ui/src/main/resources/ui/src/components/AsyncSelectList/AsyncSelectList.interface.ts b/...data-ui/src/main/resources/ui/src/components/AsyncSelectList/AsyncSelectList.interface.ts
@@ -28,7 +28,7 @@ export interface AsyncSelectListProps {
  placeholder?: string;
  debounceTimeout?: number;
  defaultValue?: string[];
- initialData?: SelectOption[];
+ initialOptions?: SelectOption[];
  onChange?: (option: DefaultOptionType | DefaultOptionType[]) => void;
  fetchOptions: (
  search: string,

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AsyncSelectList/AsyncSelectList.tsx b/openmetadata-ui/src/main/resources/ui/src/components/AsyncSelectList/AsyncSelectList.tsx
@@ -42,7 +42,7 @@ const AsyncSelectList: FC<AsyncSelectListProps> = ({
  onChange,
  fetchOptions,
  debounceTimeout = 800,
- initialData,
+ initialOptions,
  className,
  ...props
 }) => {
@@ -52,7 +52,7 @@ const AsyncSelectList: FC<AsyncSelectListProps> = ({
  const [searchValue, setSearchValue] = useState<string>('');
  const [paging, setPaging] = useState<Paging>({} as Paging);
  const [currentPage, setCurrentPage] = useState(1);
- const selectedTagsRef = useRef<SelectOption[]>(initialData ?? []);
+ const selectedTagsRef = useRef<SelectOption[]>(initialOptions ?? []);
 
  const loadOptions = useCallback(
  async (value: string) => {
@@ -204,7 +204,7 @@ const AsyncSelectList: FC<AsyncSelectListProps> = ({
  data ?? {
  value,
  label: value,
- data: initialData?.find((item) => item.value === value)?.data,
+ data: initialOptions?.find((item) => item.value === value)?.data,
  }
  );
  });

diff --git a/...a-ui/src/main/resources/ui/src/components/Tag/TagsSelectForm/TagsSelectForm.component.tsx b/...a-ui/src/main/resources/ui/src/components/Tag/TagsSelectForm/TagsSelectForm.component.tsx
@@ -66,7 +66,7 @@ const TagSelectForm = ({
  <AsyncSelectList
  className="tag-select-box"
  fetchOptions={fetchApi}
- initialData={tagData}
+ initialOptions={tagData}
  mode="multiple"
  placeholder={placeholder}
  />

diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/TagSuggestion.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/TagSuggestion.tsx
@@ -17,6 +17,7 @@ import { isArray, isEmpty } from 'lodash';
 import { EntityTags } from 'Models';
 import React, { useMemo } from 'react';
 import AsyncSelectList from '../../../components/AsyncSelectList/AsyncSelectList';
+import { SelectOption } from '../../../components/AsyncSelectList/AsyncSelectList.interface';
 import { TagSource } from '../../../generated/entity/data/container';
 import { TagLabel } from '../../../generated/type/tagLabel';
 import {
@@ -28,13 +29,15 @@ export interface TagSuggestionProps {
  placeholder?: string;
  tagType?: TagSource;
  value?: TagLabel[];
+ initialOptions?: SelectOption[];
  onChange?: (newTags: TagLabel[]) => void;
 }
 
 const TagSuggestion: React.FC<TagSuggestionProps> = ({
  onChange,
  value,
  placeholder,
+ initialOptions,
  tagType = TagSource.Classification,
 }) => {
  const isGlossaryType = useMemo(
@@ -82,6 +85,7 @@ const TagSuggestion: React.FC<TagSuggestionProps> = ({
  <AsyncSelectList
  defaultValue={value?.map((item) => item.tagFQN) || []}
  fetchOptions={isGlossaryType ? fetchGlossaryList : fetchTagsElasticSearch}
+ initialOptions={initialOptions}
  mode="multiple"
  placeholder={
  placeholder ??