From 3549ce86ec2e53eefce5fc26a3adf48da7c11a6c Mon Sep 17 00:00:00 2001
From: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Date: Mon, 10 Aug 2020 13:57:52 +0200
Subject: [PATCH] Add preselected value to options in DropDown.tsx if missing

---
 CHANGELOG.md                                  |  1 +
 .../src/__snapshots__/storyshots.test.ts.snap | 42 +++++++++++++++++++
 .../src/forms/DropDown.stories.tsx            | 10 +++++
 scm-ui/ui-components/src/forms/DropDown.tsx   |  5 +++
 4 files changed, 58 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 410d0f533e..259603e9a0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 - Repository names may not end with ".git" ([#1277](https://github.com/scm-manager/scm-manager/pull/1277))
+- Add preselected value to options in dropdown component if missing ([#1287](https://github.com/scm-manager/scm-manager/pull/1287))
 
 ## [2.3.1] - 2020-08-04
 ### Added
diff --git a/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap b/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap
index 92c6869962..05297adf93 100644
--- a/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap
+++ b/scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap
@@ -38608,6 +38608,42 @@ exports[`Storyshots Forms|Checkbox With HelpText 1`] = `
 </div>
 `;
 
+exports[`Storyshots Forms|DropDown Add preselect if missing in options 1`] = `
+<div
+  className="select"
+>
+  <select
+    onChange={[Function]}
+    value="D"
+  >
+    <option
+      selected={false}
+      value="alpha"
+    >
+      A
+    </option>
+    <option
+      selected={false}
+      value="beta"
+    >
+      B
+    </option>
+    <option
+      selected={false}
+      value="gamma"
+    >
+      C
+    </option>
+    <option
+      selected={true}
+      value="D"
+    >
+      D
+    </option>
+  </select>
+</div>
+`;
+
 exports[`Storyshots Forms|DropDown Default 1`] = `
 <div
   className="select"
@@ -38664,6 +38700,12 @@ exports[`Storyshots Forms|DropDown With Translation 1`] = `
     >
       The Meaning Of Liff
     </option>
+    <option
+      selected={true}
+      value="dirk"
+    >
+      dirk
+    </option>
   </select>
 </div>
 `;
diff --git a/scm-ui/ui-components/src/forms/DropDown.stories.tsx b/scm-ui/ui-components/src/forms/DropDown.stories.tsx
index e8c9006b50..7e1e3ed995 100644
--- a/scm-ui/ui-components/src/forms/DropDown.stories.tsx
+++ b/scm-ui/ui-components/src/forms/DropDown.stories.tsx
@@ -48,4 +48,14 @@ storiesOf("Forms|DropDown", module)
         // nothing to do
       }}
     />
+  ))
+  .add("Add preselect if missing in options", () => (
+    <DropDown
+      optionValues={["alpha", "beta", "gamma"]}
+      options={["A", "B", "C"]}
+      preselectedOption={"D"}
+      optionSelected={selection => {
+        // nothing to do
+      }}
+    />
   ));
diff --git a/scm-ui/ui-components/src/forms/DropDown.tsx b/scm-ui/ui-components/src/forms/DropDown.tsx
index 8462d5bcb4..c141b35cd5 100644
--- a/scm-ui/ui-components/src/forms/DropDown.tsx
+++ b/scm-ui/ui-components/src/forms/DropDown.tsx
@@ -36,6 +36,11 @@ type Props = {
 class DropDown extends React.Component<Props> {
   render() {
     const { options, optionValues, preselectedOption, className, disabled } = this.props;
+
+    if (preselectedOption && options.filter(o => o === preselectedOption).length === 0) {
+      options.push(preselectedOption);
+    }
+
     return (
       <div className={classNames(className, "select", disabled ? "disabled" : "")}>
         <select value={preselectedOption ? preselectedOption : ""} onChange={this.change} disabled={disabled}>