[Workspace] Set the default color to first color from the palette

changelogs/fragments/7627.yml

@@ -0,0 +1,2 @@
+fix:
+- Set default color ([#7627](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7627))

src/plugins/workspace/public/components/workspace_creator/workspace_creator.tsx

@@ -4,7 +4,13 @@
  */
 
 import React, { useCallback } from 'react';
-import { EuiPage, EuiPageBody, EuiPageHeader, EuiPageContent } from '@elastic/eui';
+import {
+  EuiPage,
+  EuiPageBody,
+  EuiPageHeader,
+  EuiPageContent,
+  euiPaletteColorBlind,
+} from '@elastic/eui';
 import { i18n } from '@osd/i18n';
 import { useObservable } from 'react-use';
 import { BehaviorSubject } from 'rxjs';
@@ -107,6 +113,7 @@ export const WorkspaceCreator = (props: WorkspaceCreatorProps) => {
               permissionEnabled={isPermissionEnabled}
               dataSourceManagement={dataSourceManagement}
               availableUseCases={availableUseCases}
+              defaultValues={{ color: euiPaletteColorBlind()[0] }}
             />
           )}
         </EuiPageContent>

src/plugins/workspace/public/components/workspace_form/types.ts

@@ -79,7 +79,7 @@ export interface WorkspaceFormProps {
   application: ApplicationStart;
   savedObjects: SavedObjectsStart;
   onSubmit?: (formData: WorkspaceFormSubmitData) => void;
-  defaultValues?: WorkspaceFormData;
+  defaultValues?: Partial<WorkspaceFormData>;
   operationType: WorkspaceOperationType;
   permissionEnabled?: boolean;
   detailTab?: DetailTab;

src/plugins/workspace/public/components/workspace_form/use_workspace_form.ts

@@ -80,6 +80,7 @@ export const useWorkspaceForm = ({
   const numberOfChanges = defaultValuesRef.current
     ? getNumberOfChanges(formData, {
         ...defaultValuesRef.current,
+        name: defaultValuesRef.current.name || '',
         // The user form will insert some empty permission rows, should ignore these rows not treated as user new added.
         permissionSettings: initialPermissionSettingsRef.current,
       })