New: Auto tag artists based on tags present/absent on artists

(cherry picked from commit f4c19a384bd9bb4e35c9fa0ca5d9a448c04e409e)

Closes #4742

frontend/src/Components/Form/ArtistTagInput.tsx

@@ -0,0 +1,53 @@
+import React, { useCallback } from 'react';
+import TagInputConnector from './TagInputConnector';
+
+interface ArtistTagInputProps {
+  name: string;
+  value: number | number[];
+  onChange: ({
+    name,
+    value,
+  }: {
+    name: string;
+    value: number | number[];
+  }) => void;
+}
+
+export default function ArtistTagInput(props: ArtistTagInputProps) {
+  const { value, onChange, ...otherProps } = props;
+  const isArray = Array.isArray(value);
+
+  const handleChange = useCallback(
+    ({ name, value: newValue }: { name: string; value: number[] }) => {
+      if (isArray) {
+        onChange({ name, value: newValue });
+      } else {
+        onChange({
+          name,
+          value: newValue.length ? newValue[newValue.length - 1] : 0,
+        });
+      }
+    },
+    [isArray, onChange]
+  );
+
+  let finalValue: number[] = [];
+
+  if (isArray) {
+    finalValue = value;
+  } else if (value === 0) {
+    finalValue = [];
+  } else {
+    finalValue = [value];
+  }
+
+  return (
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore 2786 'TagInputConnector' isn't typed yet
+    <TagInputConnector
+      {...otherProps}
+      value={finalValue}
+      onChange={handleChange}
+    />
+  );
+}

frontend/src/Components/Form/FormInputGroup.js

@@ -4,6 +4,7 @@ import Link from 'Components/Link/Link';
 import { inputTypes, kinds } from 'Helpers/Props';
 import translate from 'Utilities/String/translate';
 import AlbumReleaseSelectInputConnector from './AlbumReleaseSelectInputConnector';
+import ArtistTagInput from './ArtistTagInput';
 import AutoCompleteInput from './AutoCompleteInput';
 import CaptchaInputConnector from './CaptchaInputConnector';
 import CheckInput from './CheckInput';
@@ -99,6 +100,9 @@ function getComponent(type) {
     case inputTypes.DYNAMIC_SELECT:
       return EnhancedSelectInputConnector;
 
+    case inputTypes.ARTIST_TAG:
+      return ArtistTagInput;
+
     case inputTypes.SERIES_TYPE_SELECT:
       return SeriesTypeSelectInput;
 

frontend/src/Components/Form/ProviderFieldFormGroup.js

@@ -29,6 +29,8 @@ function getType({ type, selectOptionsProviderAction }) {
         return inputTypes.DYNAMIC_SELECT;
       }
       return inputTypes.SELECT;
+    case 'artistTag':
+      return inputTypes.ARTIST_TAG;
     case 'tag':
       return inputTypes.TEXT_TAG;
     case 'tagSelect':