Skip to content

Commit

Permalink
Merge pull request #193 from vikram-raj/remove-userSettings
Browse files Browse the repository at this point in the history
SRVKP-6845: Remove userSettings dependencies
openshift-merge-bot[bot] authored Nov 27, 2024
2 parents b820d76 + dcf83bb commit ea6edf5
Showing 6 changed files with 84 additions and 244 deletions.
41 changes: 11 additions & 30 deletions src/components/pipeline-builder/SyncedEditorField.tsx
Original file line number Diff line number Diff line change
@@ -5,12 +5,11 @@ import { useField, useFormikContext, FormikValues } from 'formik';
import * as _ from 'lodash';
import { useTranslation } from 'react-i18next';
import RadioGroupField from './RadioGroupField';

import './SyncedEditorField.scss';
import { EditorType } from './types';
import { safeJSToYAML, safeYAMLToJS } from './yaml';
import { LoadingBox } from '../status/status-box';
import { useEditorType } from './synced-editor/useEditorType';

import './SyncedEditorField.scss';
import { LOCAL_STORAGE_KEY_EDITOR_TYPE } from './const';

type FormErrorCallback<ReturnValue = {}> = () => ReturnValue;
type WithOrWithoutPromise<Type> = Promise<Type> | Type;
@@ -42,9 +41,12 @@ const SyncedEditorField: React.FC<SyncedEditorFieldProps> = ({
yamlContext,
prune,
noMargin = false,
lastViewUserSettingKey,
}) => {
const { t } = useTranslation('plugin__pipelines-console-plugin');
const [editorType, setEditorType] = React.useState<EditorType>(
(localStorage.getItem(LOCAL_STORAGE_KEY_EDITOR_TYPE) as EditorType) ||
EditorType.Form,
);
const [field] = useField(name);

const { values, setFieldValue, setStatus } = useFormikContext<FormikValues>();
@@ -59,21 +61,9 @@ const SyncedEditorField: React.FC<SyncedEditorFieldProps> = ({
formContext.isDisabled,
);

const isEditorTypeEnabled = (type: EditorType): boolean =>
!(type === EditorType.Form
? formContext?.isDisabled
: yamlContext?.isDisabled);

const [editorType, setEditorType, resourceLoaded] = useEditorType(
lastViewUserSettingKey,
field.value as EditorType,
isEditorTypeEnabled,
);

const loaded = resourceLoaded && field.value === editorType;

const changeEditorType = (newType: EditorType) => {
setEditorType(newType);
localStorage.setItem(LOCAL_STORAGE_KEY_EDITOR_TYPE, newType);
setFieldValue(name, newType);
};

@@ -145,19 +135,12 @@ const SyncedEditorField: React.FC<SyncedEditorFieldProps> = ({

React.useEffect(() => {
setDisabledFormAlert(formContext.isDisabled);
if (resourceLoaded && field.value !== editorType) {
if (field.value !== editorType) {
setFieldValue(name, editorType);
}
}, [
editorType,
field.value,
formContext.isDisabled,
name,
resourceLoaded,
setFieldValue,
]);
}, [editorType, field.value, formContext.isDisabled, name, setFieldValue]);

return loaded ? (
return (
<>
<div
className={cx('ocs-synced-editor-field__editor-toggle', {
@@ -219,8 +202,6 @@ const SyncedEditorField: React.FC<SyncedEditorFieldProps> = ({
? formContext.editor
: yamlContext.editor}
</>
) : (
<LoadingBox />
);
};

3 changes: 3 additions & 0 deletions src/components/pipeline-builder/const.ts
Original file line number Diff line number Diff line change
@@ -70,3 +70,6 @@ export const initialPipelineFormData: PipelineBuilderFormValues = {
finallyListTasks: [],
loadingTasks: [],
};

export const LOCAL_STORAGE_KEY_EDITOR_TYPE =
'pipeline-console-plugin-editorType';

This file was deleted.

16 changes: 6 additions & 10 deletions src/components/pipeline-builder/synced-editor/index.tsx
Original file line number Diff line number Diff line change
@@ -3,10 +3,9 @@ import { Alert, Button } from '@patternfly/react-core';
import * as _ from 'lodash';
import { useTranslation } from 'react-i18next';
import { EditorType, EditorToggle } from './editor-toggle';
import { useEditorType } from './useEditorType';
import { K8sResourceKind } from '@openshift-console/dynamic-plugin-sdk';
import { asyncYAMLToJS, safeJSToYAML } from '../yaml';
import { LoadingBox } from '../../status/status-box';
import { LOCAL_STORAGE_KEY_EDITOR_TYPE } from '../const';

const YAML_KEY_ORDER = ['apiVerion', 'kind', 'metadata', 'spec', 'status'];
export const YAML_TO_JS_OPTIONS = {
@@ -31,13 +30,11 @@ export const YAML_TO_JS_OPTIONS = {
export const SyncedEditor: React.FC<SyncedEditorProps> = ({
context = { formContext: {}, yamlContext: {} },
FormEditor,
initialType = EditorType.Form,
initialData = {},
onChangeEditorType = _.noop,
onChange = _.noop,
prune,
YAMLEditor,
lastViewUserSettingKey,
displayConversionError,
}) => {
const { formContext, yamlContext } = context;
@@ -50,9 +47,9 @@ export const SyncedEditor: React.FC<SyncedEditorProps> = ({
);
const [switchError, setSwitchError] = React.useState<string | undefined>();
const [yamlWarning, setYAMLWarning] = React.useState<boolean>(false);
const [editorType, setEditorType, loaded] = useEditorType(
lastViewUserSettingKey,
initialType,
const [editorType, setEditorType] = React.useState<EditorType>(
(localStorage.getItem(LOCAL_STORAGE_KEY_EDITOR_TYPE) as EditorType) ||
EditorType.Form,
);

const handleFormDataChange = (newFormData: K8sResourceKind = {}) => {
@@ -76,6 +73,7 @@ export const SyncedEditor: React.FC<SyncedEditorProps> = ({

const changeEditorType = (newType: EditorType): void => {
setEditorType(newType);
localStorage.setItem(LOCAL_STORAGE_KEY_EDITOR_TYPE, newType);
onChangeEditorType(newType);
};

@@ -117,7 +115,7 @@ export const SyncedEditor: React.FC<SyncedEditorProps> = ({
}
};

return loaded ? (
return (
<>
<EditorToggle value={editorType} onChange={onChangeType} />
{yamlWarning && (
@@ -153,8 +151,6 @@ export const SyncedEditor: React.FC<SyncedEditorProps> = ({
/>
)}
</>
) : (
<LoadingBox />
);
};

Loading

0 comments on commit ea6edf5

Please sign in to comment.