SCM-Manager/scm-ui/ui-webapp/src/admin/components/form/NamespaceStrategySelect.tsx

import React from "react";
import { translate, TFunction } from "react-i18next";
import { Select } from "@scm-manager/ui-components";
import { NamespaceStrategies } from "@scm-manager/ui-types";

type Props = {
  namespaceStrategies: NamespaceStrategies;
  label: string;
  value?: string;
  disabled?: boolean;
  helpText?: string;
  onChange: (value: string, name?: string) => void;
  // context props
  t: TFunction;
};

class NamespaceStrategySelect extends React.Component<Props> {
  createNamespaceOptions = () => {
    const { namespaceStrategies, t } = this.props;
    let available = [];
    if (namespaceStrategies && namespaceStrategies.available) {
      available = namespaceStrategies.available;
    }

    return available.map(ns => {
      const key = "namespaceStrategies." + ns;
      let label = t(key);
      if (label === key) {
        label = ns;
      }
      return {
        value: ns,
        label: label
      };
    });
  };

  findSelected = () => {
    const { namespaceStrategies, value } = this.props;
    if (!namespaceStrategies || !namespaceStrategies.available || namespaceStrategies.available.indexOf(value) < 0) {
      return namespaceStrategies.current;
    }
    return value;
  };

  render() {
    const { label, helpText, disabled, onChange } = this.props;
    const nsOptions = this.createNamespaceOptions();
    return (
      <Select
        label={label}
        onChange={onChange}
        value={this.findSelected()}
        disabled={disabled}
        options={nsOptions}
        helpText={helpText}
      />
    );
  }
}

export default translate("plugins")(NamespaceStrategySelect);