From a097a90dbed878171e0eab3b8c77c2c9c4700f3d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ivar=20Conradi=20=C3=98sthus?= <ivarconr@gmail.com>
Date: Wed, 23 Sep 2020 21:47:07 +0200
Subject: [PATCH] fix: make sure application is updated on edit

---
 .../application/application-edit-component.js    | 16 +++++++++++-----
 frontend/src/store/application/actions.js        |  2 ++
 frontend/src/store/application/index.js          |  4 +++-
 3 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/frontend/src/component/application/application-edit-component.js b/frontend/src/component/application/application-edit-component.js
index 5563d20775..5a45c26552 100644
--- a/frontend/src/component/application/application-edit-component.js
+++ b/frontend/src/component/application/application-edit-component.js
@@ -23,6 +23,8 @@ import {
 import { IconLink, shorten, styles as commonStyles } from '../common';
 import { formatFullDateTimeWithLocale } from '../common/util';
 import { CREATE_FEATURE, CREATE_STRATEGY, UPDATE_APPLICATION } from '../../permissions';
+import icons from './icon-names';
+import MySelect from '../common/select';
 
 class StatefulTextfield extends Component {
     static propTypes = {
@@ -178,6 +180,7 @@ class ClientApplications extends PureComponent {
                         <StatefulTextfield
                             value={url}
                             label="URL"
+                            type="url"
                             onBlur={e => storeApplicationMetaData(appName, 'url', e.target.value)}
                         />
                         <br />
@@ -189,14 +192,16 @@ class ClientApplications extends PureComponent {
                         />
                     </Cell>
                     <Cell col={6} tablet={12}>
-                        <StatefulTextfield
+                        <MySelect
+                            label="Icon"
+                            options={icons.map(v => ({ name: v, label: v }))}
                             value={icon}
-                            label="Select icon"
-                            onBlur={e => storeApplicationMetaData(appName, 'icon', e.target.value)}
+                            onChange={e => storeApplicationMetaData(appName, 'icon', e.target.value)}
+                            filled
                         />
                         <StatefulTextfield
                             value={color}
-                            label="Select color"
+                            label="Color"
                             onBlur={e => storeApplicationMetaData(appName, 'color', e.target.value)}
                         />
                     </Cell>
@@ -206,7 +211,8 @@ class ClientApplications extends PureComponent {
         return (
             <Card shadow={0} className={commonStyles.fullwidth}>
                 <CardTitle style={{ paddingTop: '24px', paddingRight: '64px', wordBreak: 'break-all' }}>
-                    <Icon name={icon} /> {appName}
+                    <Icon name={icon} />
+                    &nbsp;{appName}
                 </CardTitle>
                 {description && <CardText>{description}</CardText>}
                 {url && (
diff --git a/frontend/src/store/application/actions.js b/frontend/src/store/application/actions.js
index 505ec1e120..71e2900f8d 100644
--- a/frontend/src/store/application/actions.js
+++ b/frontend/src/store/application/actions.js
@@ -6,6 +6,7 @@ export const ERROR_RECEIVE_ALL_APPLICATIONS = 'ERROR_RECEIVE_ALL_APPLICATIONS';
 export const ERROR_UPDATING_APPLICATION_DATA = 'ERROR_UPDATING_APPLICATION_DATA';
 
 export const RECEIVE_APPLICATION = 'RECEIVE_APPLICATION';
+export const UPDATE_APPLICATION_FIELD = 'UPDATE_APPLICATION_FIELD';
 
 const recieveAllApplications = json => ({
     type: RECEIVE_ALL_APPLICATIONS,
@@ -29,6 +30,7 @@ export function storeApplicationMetaData(appName, key, value) {
     return dispatch =>
         api
             .storeApplicationMetaData(appName, key, value)
+            .then(() => dispatch({ type: UPDATE_APPLICATION_FIELD, appName, key, value }))
             .catch(dispatchAndThrow(dispatch, ERROR_UPDATING_APPLICATION_DATA));
 }
 
diff --git a/frontend/src/store/application/index.js b/frontend/src/store/application/index.js
index 7756af56e2..8e3dc36689 100644
--- a/frontend/src/store/application/index.js
+++ b/frontend/src/store/application/index.js
@@ -1,5 +1,5 @@
 import { fromJS, List, Map } from 'immutable';
-import { RECEIVE_ALL_APPLICATIONS, RECEIVE_APPLICATION } from './actions';
+import { RECEIVE_ALL_APPLICATIONS, RECEIVE_APPLICATION, UPDATE_APPLICATION_FIELD } from './actions';
 import { USER_LOGOUT, USER_LOGIN } from '../user/actions';
 
 function getInitState() {
@@ -12,6 +12,8 @@ const store = (state = getInitState(), action) => {
             return state.setIn(['apps', action.value.appName], new Map(action.value));
         case RECEIVE_ALL_APPLICATIONS:
             return state.set('list', new List(action.value.applications));
+        case UPDATE_APPLICATION_FIELD:
+            return state.setIn(['apps', action.appName, action.key], action.value);
         case USER_LOGOUT:
         case USER_LOGIN:
             return getInitState();