marginTop: spacing()

in public/src/components/channelManagement/testEditorArticleCountEditor.tsx [20:77]

• 50 lines of code
• 6 McCabe index (conditional complexity)

      marginTop: spacing(1),
    },
  },
}));

export const DEFAULT_ARTICLES_VIEWED_SETTINGS: ArticlesViewedSettings = {
  minViews: 5,
  maxViews: null,
  periodInWeeks: 52,
  tagIds: [],
};

interface FormData {
  minViews: string;
  maxViews: string;
  periodInWeeks: string;
  tagIds: string[];
}

interface TestEditorArticleCountEditorProps {
  articlesViewedSettings?: ArticlesViewedSettings;
  onArticlesViewedSettingsChanged: (updatedArticlesViewedSettings?: ArticlesViewedSettings) => void;
  onValidationChange: (isValid: boolean) => void;
  isDisabled: boolean;
}

const TestEditorArticleCountEditor: React.FC<TestEditorArticleCountEditorProps> = ({
  articlesViewedSettings,
  onArticlesViewedSettingsChanged,
  onValidationChange,
  isDisabled,
}: TestEditorArticleCountEditorProps) => {
  const classes = useStyles();

  const defaultValues: FormData = {
    minViews: articlesViewedSettings?.minViews?.toString() || '',
    maxViews: articlesViewedSettings?.maxViews?.toString() || '',
    periodInWeeks: articlesViewedSettings?.periodInWeeks.toString() || '',
    tagIds: articlesViewedSettings?.tagIds || [],
  };

  const { register, errors, handleSubmit, reset } = useForm<FormData>({
    mode: 'onChange',
    defaultValues,
  });
  const tagIds = articlesViewedSettings?.tagIds || [];

  useEffect(() => {
    reset(defaultValues);
  }, [
    defaultValues.minViews,
    defaultValues.maxViews,
    defaultValues.periodInWeeks,
    defaultValues.tagIds,
  ]);

  const onSubmit = ({ minViews, maxViews, periodInWeeks }: FormData): void => {
    onArticlesViewedSettingsChanged({