optimize commonDialogWindow.

Signed-off-by: Melanie Retter <melanie.retter@bosch-si.com>

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/artifacts/smtable/SoftwareModuleAddUpdateWindow.java

@@ -15,7 +15,6 @@ import org.eclipse.hawkbit.repository.model.SoftwareModule;
 import org.eclipse.hawkbit.ui.UiProperties;
 import org.eclipse.hawkbit.ui.artifacts.event.SoftwareModuleEvent;
 import org.eclipse.hawkbit.ui.common.CommonDialogWindow;
-import org.eclipse.hawkbit.ui.common.PopupWindowHelp;
 import org.eclipse.hawkbit.ui.common.SoftwareModuleTypeBeanQuery;
 import org.eclipse.hawkbit.ui.common.table.BaseEntityEventType;
 import org.eclipse.hawkbit.ui.components.SPUIComponentProvider;
@@ -32,10 +31,9 @@ import org.vaadin.spring.events.EventBus;
 
 import com.vaadin.spring.annotation.SpringComponent;
 import com.vaadin.spring.annotation.ViewScope;
-import com.vaadin.ui.Alignment;
 import com.vaadin.ui.ComboBox;
 import com.vaadin.ui.CustomComponent;
-import com.vaadin.ui.HorizontalLayout;
+import com.vaadin.ui.FormLayout;
 import com.vaadin.ui.Label;
 import com.vaadin.ui.TextArea;
 import com.vaadin.ui.TextField;
@@ -70,7 +68,7 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
     @Autowired
     private transient UiProperties uiProperties;
 
-    private Label madatoryLabel;
+    private Label mandatoryLabel;
 
     private TextField nameTextField;
 
@@ -78,10 +76,6 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
 
     private TextField vendorTextField;
 
-    // private Button saveSoftware;
-    //
-    // private Button closeWindow;
-
     private ComboBox typeComboBox;
 
     private TextArea descTextArea;
@@ -103,6 +97,7 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
      *         module.
      */
     public CommonDialogWindow createAddSoftwareModuleWindow() {
+
         editSwModule = Boolean.FALSE;
         createRequiredComponents();
         createWindow();
@@ -118,6 +113,7 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
      *         module.
      */
     public Window createUpdateSoftwareModuleWindow(final Long baseSwModuleId) {
+
         editSwModule = Boolean.TRUE;
         this.baseSwModuleId = baseSwModuleId;
         createRequiredComponents();
@@ -155,9 +151,9 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
         addVendorTextChangeListener();
 
         /* Label for mandatory symbol */
-        madatoryLabel = new Label(i18n.get("label.mandatory.field"));
+        mandatoryLabel = new Label(i18n.get("label.mandatory.field"));
-        madatoryLabel.setStyleName(SPUIStyleDefinitions.SP_TEXTFIELD_ERROR);
+        mandatoryLabel.setStyleName(SPUIStyleDefinitions.SP_TEXTFIELD_ERROR);
-        madatoryLabel.addStyleName(ValoTheme.LABEL_SMALL);
+        mandatoryLabel.addStyleName(ValoTheme.LABEL_SMALL);
 
         typeComboBox = SPUIComponentProvider.getComboBox(i18n.get("upload.swmodule.type"), "", "", null, null, false,
                 null, i18n.get("upload.swmodule.type"));
@@ -168,21 +164,6 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
 
         populateTypeNameCombo();
 
-        /* save or update button */
-        // saveSoftware =
-        // SPUIComponentProvider.getButton(SPUIComponetIdProvider.SOFT_MODULE_SAVE,
-        // "", "", "", true,
-        // FontAwesome.SAVE, SPUIButtonStyleSmallNoBorder.class);
-        // saveSoftware.addClickListener(event -> save());
-        //
-        // /* close button */
-        // closeWindow =
-        // SPUIComponentProvider.getButton(SPUIComponetIdProvider.SOFT_MODULE_DISCARD,
-        // "", "", "", true,
-        // FontAwesome.TIMES, SPUIButtonStyleSmallNoBorder.class);
-        // /* Just close this window when this button is clicked */
-        // closeWindow.addClickListener(event -> closeThisWindow());
-
         resetOldValues();
     }
 
@@ -207,25 +188,10 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
      * @return
      */
     private void createWindow() {
-        /* action button layout (save & dicard) */
-        // final HorizontalLayout buttonsLayout = new HorizontalLayout();
-        // buttonsLayout.setSizeFull();
-        // buttonsLayout.addComponents(saveSoftware, closeWindow);
-        // buttonsLayout.setComponentAlignment(saveSoftware,
-        // Alignment.BOTTOM_LEFT);
-        // buttonsLayout.setComponentAlignment(closeWindow,
-        // Alignment.BOTTOM_RIGHT);
-        // buttonsLayout.addStyleName("window-style");
 
         final Label madatoryStarLabel = new Label("*");
         madatoryStarLabel.setStyleName("v-caption v-required-field-indicator");
         madatoryStarLabel.setWidth(null);
-        final HorizontalLayout hLayout = new HorizontalLayout();
-        hLayout.setSizeFull();
-        hLayout.addComponents(typeComboBox, madatoryStarLabel);
-        hLayout.setComponentAlignment(typeComboBox, Alignment.TOP_LEFT);
-        hLayout.setComponentAlignment(madatoryStarLabel, Alignment.TOP_RIGHT);
-        hLayout.setExpandRatio(typeComboBox, 0.8f);
 
         /*
          * The main layout of the window contains mandatory info, textboxes
@@ -235,22 +201,22 @@ public class SoftwareModuleAddUpdateWindow extends CustomComponent implements Se
         mainLayout.setSizeUndefined();
         mainLayout.setSpacing(Boolean.TRUE);
         mainLayout.addStyleName("lay-color");
-        mainLayout.addComponent(new PopupWindowHelp(uiProperties.getLinks().getDocumentation().getRoot()));
-        mainLayout.addComponent(madatoryLabel);
-        mainLayout.setComponentAlignment(madatoryLabel, Alignment.MIDDLE_LEFT);
-        mainLayout.addComponent(hLayout);
-        mainLayout.setComponentAlignment(hLayout, Alignment.MIDDLE_LEFT);
-        // mainLayout.addComponents(nameTextField, versionTextField,
-        // vendorTextField, descTextArea, buttonsLayout);
 
-        // TODO MR WINDOW
+        final FormLayout formLayout = new FormLayout();
-        mainLayout.addComponents(nameTextField, versionTextField, vendorTextField, descTextArea);
+        formLayout.addComponent(typeComboBox);
+        formLayout.addComponent(mandatoryLabel);
+        formLayout.addComponent(nameTextField);
+        formLayout.addComponent(versionTextField);
+        formLayout.addComponent(vendorTextField);
+        formLayout.addComponent(descTextArea);
 
+        mainLayout.addComponents(formLayout);
         setCompositionRoot(mainLayout);
 
         /* add main layout to the window */
         window = SPUIComponentProvider.getWindow(i18n.get("upload.caption.add.new.swmodule"), null,
                 SPUIDefinitions.CREATE_UPDATE_WINDOW, this, event -> save(), event -> closeThisWindow());
+        window.removeStyleName("actionButtonsMargin");
         nameTextField.focus();
     }
 

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/artifacts/smtype/CreateUpdateSoftwareTypeLayout.java

@@ -13,7 +13,6 @@ import java.util.List;
 
 import org.eclipse.hawkbit.repository.SoftwareManagement;
 import org.eclipse.hawkbit.repository.model.SoftwareModuleType;
-import org.eclipse.hawkbit.ui.UiProperties;
 import org.eclipse.hawkbit.ui.artifacts.event.SoftwareModuleTypeEvent;
 import org.eclipse.hawkbit.ui.artifacts.event.SoftwareModuleTypeEvent.SoftwareModuleTypeEnum;
 import org.eclipse.hawkbit.ui.colorPicker.ColorPickerConstants;
@@ -22,7 +21,6 @@ import org.eclipse.hawkbit.ui.common.SoftwareModuleTypeBeanQuery;
 import org.eclipse.hawkbit.ui.components.SPUIComponentProvider;
 import org.eclipse.hawkbit.ui.layouts.CreateUpdateTypeLayout;
 import org.eclipse.hawkbit.ui.utils.HawkbitCommonUtil;
-import org.eclipse.hawkbit.ui.utils.SPUIComponetIdProvider;
 import org.eclipse.hawkbit.ui.utils.SPUIDefinitions;
 import org.eclipse.hawkbit.ui.utils.SPUILabelDefinitions;
 import org.slf4j.Logger;
@@ -30,13 +28,11 @@ import org.slf4j.LoggerFactory;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.vaadin.addons.lazyquerycontainer.BeanQueryFactory;
 
-import com.google.common.base.Strings;
 import com.vaadin.data.Property.ValueChangeEvent;
 import com.vaadin.shared.ui.colorpicker.Color;
 import com.vaadin.spring.annotation.SpringComponent;
 import com.vaadin.spring.annotation.ViewScope;
 import com.vaadin.ui.Alignment;
-import com.vaadin.ui.Button;
 import com.vaadin.ui.Button.ClickEvent;
 import com.vaadin.ui.Label;
 import com.vaadin.ui.OptionGroup;
@@ -59,9 +55,6 @@ public class CreateUpdateSoftwareTypeLayout extends CreateUpdateTypeLayout
     @Autowired
     private transient SoftwareManagement swTypeManagementService;
 
-    @Autowired
-    private transient UiProperties uiProperties;
-
     private String singleAssignStr;
     private String multiAssignStr;
     private Label singleAssign;
@@ -71,16 +64,12 @@ public class CreateUpdateSoftwareTypeLayout extends CreateUpdateTypeLayout
     @Override
     protected void createRequiredComponents() {
 
-        createTypeStr = i18n.get("label.create.type");
+        super.createRequiredComponents();
-        updateTypeStr = i18n.get("label.update.type");
+
         singleAssignStr = i18n.get("label.singleAssign.type");
         multiAssignStr = i18n.get("label.multiAssign.type");
         singleAssign = SPUIComponentProvider.getLabel(singleAssignStr, null);
         multiAssign = SPUIComponentProvider.getLabel(multiAssignStr, null);
-        comboLabel = SPUIComponentProvider.getLabel(i18n.get("label.choose.type"), null);
-        madatoryLabel = getMandatoryLabel();
-        colorLabel = SPUIComponentProvider.getLabel(i18n.get("label.choose.type.color"), null);
-        colorLabel.addStyleName(SPUIDefinitions.COLOR_LABEL_STYLE);
 
         tagName = SPUIComponentProvider.getTextField(i18n.get("textfield.name"), "",
                 ValoTheme.TEXTFIELD_TINY + " " + SPUIDefinitions.TYPE_NAME, true, "", i18n.get("textfield.name"), true,
@@ -100,26 +89,14 @@ public class CreateUpdateSoftwareTypeLayout extends CreateUpdateTypeLayout
         tagDesc.setImmediate(true);
         tagDesc.setNullRepresentation("");
 
-        tagNameComboBox = SPUIComponentProvider.getComboBox(i18n.get("label.combobox.type"), "", "", null, null, false,
-                "", i18n.get("label.combobox.type"));
-        tagNameComboBox.addStyleName(SPUIDefinitions.FILTER_TYPE_COMBO_STYLE);
-        tagNameComboBox.setImmediate(true);
-
-        tagColorPreviewBtn = new Button();
-        tagColorPreviewBtn.setId(SPUIComponetIdProvider.TAG_COLOR_PREVIEW_ID);
-        getPreviewButtonColor(ColorPickerConstants.DEFAULT_COLOR);
-        tagColorPreviewBtn.setStyleName(TAG_DYNAMIC_STYLE);
-
-        ColorPickerHelper.setRgbSliderValues(colorPickerLayout);
-
         singleMultiOptionGroup();
-        createOptionGroup(permChecker.hasCreateDistributionPermission(), permChecker.hasUpdateDistributionPermission());
     }
 
     @Override
     protected void buildLayout() {
 
         super.buildLayout();
+        ColorPickerHelper.setRgbSliderValues(colorPickerLayout);
         getFormLayout().addComponent(typeKey, 4);
         getFormLayout().addComponent(assignOptiongroup);
     }
@@ -226,24 +203,6 @@ public class CreateUpdateSoftwareTypeLayout extends CreateUpdateTypeLayout
         }
     }
 
-    @Override
-    protected Boolean mandatoryValuesPresent() {
-        if (Strings.isNullOrEmpty(tagName.getValue()) || Strings.isNullOrEmpty(typeKey.getValue())) {
-            if (optiongroup.getValue().equals(createTypeStr)) {
-                displayValidationError(SPUILabelDefinitions.MISSING_TYPE_NAME_KEY);
-            }
-            if (optiongroup.getValue().equals(updateTypeStr)) {
-                if (null == tagNameComboBox.getValue()) {
-                    displayValidationError(i18n.get("message.error.missing.tagName"));
-                } else {
-                    displayValidationError(SPUILabelDefinitions.MISSING_TAG_NAME);
-                }
-            }
-            return Boolean.FALSE;
-        }
-        return Boolean.TRUE;
-    }
-
     /**
      * Create new tag.
      */

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/colorPicker/ColorPickerHelper.java

@@ -17,6 +17,7 @@ public class ColorPickerHelper {
      * @return String of color picked value.
      */
     public static String getColorPickedString(final SpColorPickerPreview preview) {
+
         return "rgb(" + preview.getColor().getRed() + "," + preview.getColor().getGreen() + ","
                 + preview.getColor().getBlue() + ")";
     }
@@ -29,6 +30,7 @@ public class ColorPickerHelper {
      * @return Color
      */
     public static Color rgbToColorConverter(final String value) {
+
         if (!value.startsWith("rgb")) {
             return null;
         }
@@ -46,6 +48,7 @@ public class ColorPickerHelper {
     }
 
     public static void setRgbSliderValues(final ColorPickerLayout colorPickerLayout) {
+
         try {
             final double redColorValue = colorPickerLayout.getSelectedColor().getRed();
             colorPickerLayout.getRedSlider().setValue(new Double(redColorValue));

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/colorPicker/ColorPickerLayout.java

@@ -37,7 +37,6 @@ public class ColorPickerLayout extends GridLayout {
 
         setColumns(2);
         setRows(4);
-        setCaption("Choose Color");
 
         init();
 

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/common/CommonDialogWindow.java

@@ -50,10 +50,6 @@ public class CommonDialogWindow extends Window {
         this.content = content;
         this.helpLink = helpLink;
 
-        if (null == content) {
-            // TODO
-            // throw Exception
-        }
         init(saveButtonClickListener, cancelButtonClickListener);
     }
 
@@ -75,8 +71,6 @@ public class CommonDialogWindow extends Window {
         mainLayout.addComponent(buttonLayout);
         mainLayout.setComponentAlignment(buttonLayout, Alignment.MIDDLE_CENTER);
 
-        setHeight("60%");
-        setWidth("50%");
         setCaption(caption);
         setContent(mainLayout);
         setResizable(true);

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/decorators/SPUITextAreaDecorator.java

@@ -50,7 +50,7 @@ public final class SPUITextAreaDecorator {
         final TextArea spUITxtArea = new TextArea();
         // Default settings
         spUITxtArea.setRequired(false);
-        spUITxtArea.addStyleName(ValoTheme.COMBOBOX_SMALL);
+        spUITxtArea.addStyleName(ValoTheme.TEXTAREA_SMALL);
         if (StringUtils.isNotEmpty(caption)) {
             spUITxtArea.setCaption(caption);
         }

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/distributions/disttype/CreateUpdateDistSetTypeLayout.java

@@ -26,7 +26,6 @@ import org.eclipse.hawkbit.ui.distributions.event.DistributionSetTypeEvent;
 import org.eclipse.hawkbit.ui.distributions.event.DistributionSetTypeEvent.DistributionSetTypeEnum;
 import org.eclipse.hawkbit.ui.layouts.CreateUpdateTypeLayout;
 import org.eclipse.hawkbit.ui.utils.HawkbitCommonUtil;
-import org.eclipse.hawkbit.ui.utils.SPUIComponetIdProvider;
 import org.eclipse.hawkbit.ui.utils.SPUIDefinitions;
 import org.eclipse.hawkbit.ui.utils.SPUILabelDefinitions;
 import org.slf4j.Logger;
@@ -36,7 +35,6 @@ import org.springframework.data.domain.PageRequest;
 import org.vaadin.addons.lazyquerycontainer.BeanQueryFactory;
 import org.vaadin.addons.lazyquerycontainer.LazyQueryContainer;
 
-import com.google.common.base.Strings;
 import com.vaadin.data.Item;
 import com.vaadin.data.Property.ValueChangeEvent;
 import com.vaadin.data.util.IndexedContainer;
@@ -81,9 +79,6 @@ public class CreateUpdateDistSetTypeLayout extends CreateUpdateTypeLayout
     @Autowired
     private transient DistributionSetRepository distributionSetRepository;
 
-    @Autowired
-    private transient UiProperties uiProperties;
-
     private HorizontalLayout distTypeSelectLayout;
     private Table sourceTable;
     private Table selectedTable;
@@ -93,10 +88,8 @@ public class CreateUpdateDistSetTypeLayout extends CreateUpdateTypeLayout
 
     @Override
     protected void createRequiredComponents() {
-        createTypeStr = i18n.get("label.create.type");
+
-        updateTypeStr = i18n.get("label.update.type");
+        super.createRequiredComponents();
-        comboLabel = SPUIComponentProvider.getLabel(i18n.get("label.choose.type"), null);
-        madatoryLabel = getMandatoryLabel();
 
         tagName = SPUIComponentProvider.getTextField(i18n.get("textfield.name"), "",
                 ValoTheme.TEXTFIELD_TINY + " " + SPUIDefinitions.DIST_SET_TYPE_NAME, true, "",
@@ -115,30 +108,13 @@ public class CreateUpdateDistSetTypeLayout extends CreateUpdateTypeLayout
         tagDesc.setId(SPUIDefinitions.NEW_DISTRIBUTION_TYPE_DESC);
         tagDesc.setImmediate(true);
         tagDesc.setNullRepresentation("");
-
-        tagNameComboBox = SPUIComponentProvider.getComboBox(i18n.get("label.combobox.type"), "", "", null, null, false,
-                "", i18n.get("label.combobox.type"));
-        tagNameComboBox.setId(SPUIDefinitions.NEW_DISTRIBUTION_SET_TYPE_NAME_COMBO);
-        tagNameComboBox.addStyleName(SPUIDefinitions.FILTER_TYPE_COMBO_STYLE);
-        tagNameComboBox.setImmediate(true);
-        tagNameComboBox.setPageLength(SPUIDefinitions.DIST_TYPE_SIZE);
-
-        colorLabel = SPUIComponentProvider.getLabel(i18n.get("label.choose.tag.color"), null);
-        colorLabel.addStyleName(SPUIDefinitions.COLOR_LABEL_STYLE);
-        tagColorPreviewBtn = new Button();
-        tagColorPreviewBtn.setId(SPUIComponetIdProvider.TAG_COLOR_PREVIEW_ID);
-        getPreviewButtonColor(ColorPickerConstants.DEFAULT_COLOR);
-        tagColorPreviewBtn.setStyleName(TAG_DYNAMIC_STYLE);
-
-        ColorPickerHelper.setRgbSliderValues(colorPickerLayout);
-
-        createOptionGroup(permChecker.hasCreateDistributionPermission(), permChecker.hasUpdateDistributionPermission());
     }
 
     @Override
     protected void buildLayout() {
 
         super.buildLayout();
+        ColorPickerHelper.setRgbSliderValues(colorPickerLayout);
         getFormLayout().addComponent(typeKey, 4);
 
         distTypeSelectLayout = createTwinColumnLayout();
@@ -651,24 +627,6 @@ public class CreateUpdateDistSetTypeLayout extends CreateUpdateTypeLayout
                 SPUIDefinitions.CREATE_UPDATE_WINDOW, this, event -> save(event), event -> discard(event));
     }
 
-    @Override
-    protected Boolean mandatoryValuesPresent() {
-        if (Strings.isNullOrEmpty(tagName.getValue()) || Strings.isNullOrEmpty(typeKey.getValue())) {
-            if (optiongroup.getValue().equals(createTypeStr)) {
-                displayValidationError(SPUILabelDefinitions.MISSING_TYPE_NAME_KEY);
-            }
-            if (optiongroup.getValue().equals(updateTypeStr)) {
-                if (null == tagNameComboBox.getValue()) {
-                    displayValidationError(i18n.get("message.error.missing.tagName"));
-                } else {
-                    displayValidationError(SPUILabelDefinitions.MISSING_TAG_NAME);
-                }
-            }
-            return Boolean.FALSE;
-        }
-        return Boolean.TRUE;
-    }
-
     @Override
     protected void previewButtonClicked() {
         if (!tagPreviewBtnClicked) {

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/layouts/CreateUpdateTagLayout.java

@@ -93,13 +93,13 @@ public abstract class CreateUpdateTagLayout extends CustomComponent implements C
     protected TextField tagName;
     protected TextArea tagDesc;
     protected Button tagColorPreviewBtn;
-    protected OptionGroup optiongroup = new OptionGroup();
+    protected OptionGroup optiongroup;
     protected ComboBox tagNameComboBox;
 
-    protected final VerticalLayout comboLayout = new VerticalLayout();
+    protected VerticalLayout comboLayout;
-    protected final ColorPickerLayout colorPickerLayout = new ColorPickerLayout();
+    protected ColorPickerLayout colorPickerLayout;
-    protected final GridLayout mainLayout = new GridLayout(4, 4);
+    protected GridLayout mainLayout;
-    protected final VerticalLayout contentLayout = new VerticalLayout();
+    protected VerticalLayout contentLayout;
 
     protected boolean tagPreviewBtnClicked = false;
 
@@ -141,6 +141,7 @@ public abstract class CreateUpdateTagLayout extends CustomComponent implements C
      */
     public void init() {
 
+        setSizeUndefined();
         createRequiredComponents();
         buildLayout();
         createWindow();
@@ -184,12 +185,17 @@ public abstract class CreateUpdateTagLayout extends CustomComponent implements C
         tagColorPreviewBtn.setId(SPUIComponetIdProvider.TAG_COLOR_PREVIEW_ID);
         getPreviewButtonColor(ColorPickerConstants.DEFAULT_COLOR);
         tagColorPreviewBtn.setStyleName(TAG_DYNAMIC_STYLE);
-
-        ColorPickerHelper.setRgbSliderValues(colorPickerLayout);
     }
 
     protected void buildLayout() {
 
+        mainLayout = new GridLayout(3, 2);
+        mainLayout.setSpacing(true);
+        comboLayout = new VerticalLayout();
+        colorPickerLayout = new ColorPickerLayout();
+        ColorPickerHelper.setRgbSliderValues(colorPickerLayout);
+        contentLayout = new VerticalLayout();
+
         final HorizontalLayout colorLabelLayout = new HorizontalLayout();
         colorLabelLayout.setMargin(false);
         colorLabelLayout.addComponents(colorLabel, tagColorPreviewBtn);

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/layouts/CreateUpdateTypeLayout.java

@@ -5,13 +5,17 @@ import org.eclipse.hawkbit.repository.model.NamedEntity;
 import org.eclipse.hawkbit.repository.model.SoftwareModuleType;
 import org.eclipse.hawkbit.ui.colorPicker.ColorPickerConstants;
 import org.eclipse.hawkbit.ui.colorPicker.ColorPickerHelper;
+import org.eclipse.hawkbit.ui.components.SPUIComponentProvider;
 import org.eclipse.hawkbit.ui.utils.HawkbitCommonUtil;
+import org.eclipse.hawkbit.ui.utils.SPUIComponetIdProvider;
 import org.eclipse.hawkbit.ui.utils.SPUIDefinitions;
+import org.eclipse.hawkbit.ui.utils.SPUILabelDefinitions;
 
+import com.google.common.base.Strings;
 import com.vaadin.data.Property.ValueChangeEvent;
-import com.vaadin.data.Property.ValueChangeListener;
 import com.vaadin.server.Page;
 import com.vaadin.shared.ui.colorpicker.Color;
+import com.vaadin.ui.Button;
 import com.vaadin.ui.Button.ClickEvent;
 import com.vaadin.ui.OptionGroup;
 import com.vaadin.ui.TextArea;
@@ -31,43 +35,29 @@ public class CreateUpdateTypeLayout extends CreateUpdateTagLayout {
     public static final String TYPE_NAME_DYNAMIC_STYLE = "new-tag-name";
     private static final String TYPE_DESC_DYNAMIC_STYLE = "new-tag-desc";
 
-    /**
+    @Override
-     * Value change listeners implementations of sliders.
+    protected void createRequiredComponents() {
-     */
-    protected void slidersValueChangeListeners() {
-        getColorPickerLayout().getRedSlider().addValueChangeListener(new ValueChangeListener() {
-            private static final long serialVersionUID = -8336732883300920839L;
 
-            @Override
+        createTypeStr = i18n.get("label.create.type");
-            public void valueChange(final ValueChangeEvent event) {
+        updateTypeStr = i18n.get("label.update.type");
-                final double red = (Double) event.getProperty().getValue();
+        comboLabel = SPUIComponentProvider.getLabel(i18n.get("label.choose.type"), null);
-                final Color newColor = new Color((int) red, getColorPickerLayout().getSelectedColor().getGreen(),
+        madatoryLabel = getMandatoryLabel();
-                        getColorPickerLayout().getSelectedColor().getBlue());
+        colorLabel = SPUIComponentProvider.getLabel(i18n.get("label.choose.type.color"), null);
-                setColorToComponents(newColor);
+        colorLabel.addStyleName(SPUIDefinitions.COLOR_LABEL_STYLE);
-            }
-        });
-        getColorPickerLayout().getGreenSlider().addValueChangeListener(new ValueChangeListener() {
-            private static final long serialVersionUID = 1236358037711775663L;
 
-            @Override
+        tagNameComboBox = SPUIComponentProvider.getComboBox(i18n.get("label.combobox.type"), "", "", null, null, false,
-            public void valueChange(final ValueChangeEvent event) {
+                "", i18n.get("label.combobox.type"));
-                final double green = (Double) event.getProperty().getValue();
+        tagNameComboBox.setId(SPUIDefinitions.NEW_DISTRIBUTION_SET_TYPE_NAME_COMBO);
-                final Color newColor = new Color(getColorPickerLayout().getSelectedColor().getRed(), (int) green,
+        tagNameComboBox.addStyleName(SPUIDefinitions.FILTER_TYPE_COMBO_STYLE);
-                        getColorPickerLayout().getSelectedColor().getBlue());
+        tagNameComboBox.setImmediate(true);
-                setColorToComponents(newColor);
+        tagNameComboBox.setPageLength(SPUIDefinitions.DIST_TYPE_SIZE);
-            }
-        });
-        getColorPickerLayout().getBlueSlider().addValueChangeListener(new ValueChangeListener() {
-            private static final long serialVersionUID = 8466370744686043947L;
 
-            @Override
+        tagColorPreviewBtn = new Button();
-            public void valueChange(final ValueChangeEvent event) {
+        tagColorPreviewBtn.setId(SPUIComponetIdProvider.TAG_COLOR_PREVIEW_ID);
-                final double blue = (Double) event.getProperty().getValue();
+        getPreviewButtonColor(ColorPickerConstants.DEFAULT_COLOR);
-                final Color newColor = new Color(getColorPickerLayout().getSelectedColor().getRed(),
+        tagColorPreviewBtn.setStyleName(TAG_DYNAMIC_STYLE);
-                        getColorPickerLayout().getSelectedColor().getGreen(), (int) blue);
+
-                setColorToComponents(newColor);
+        createOptionGroup(permChecker.hasCreateDistributionPermission(), permChecker.hasUpdateDistributionPermission());
-            }
-        });
     }
 
     @Override
@@ -264,6 +254,24 @@ public class CreateUpdateTypeLayout extends CreateUpdateTagLayout {
         return Boolean.FALSE;
     }
 
+    @Override
+    protected Boolean mandatoryValuesPresent() {
+        if (Strings.isNullOrEmpty(tagName.getValue()) || Strings.isNullOrEmpty(typeKey.getValue())) {
+            if (optiongroup.getValue().equals(createTypeStr)) {
+                displayValidationError(SPUILabelDefinitions.MISSING_TYPE_NAME_KEY);
+            }
+            if (optiongroup.getValue().equals(updateTypeStr)) {
+                if (null == tagNameComboBox.getValue()) {
+                    displayValidationError(i18n.get("message.error.missing.tagName"));
+                } else {
+                    displayValidationError(SPUILabelDefinitions.MISSING_TAG_NAME);
+                }
+            }
+            return Boolean.FALSE;
+        }
+        return Boolean.TRUE;
+    }
+
     @Override
     protected void save(final ClickEvent event) {
         // TODO Auto-generated method stub

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/management/dstable/DistributionAddUpdateWindowLayout.java

@@ -25,7 +25,6 @@ import org.eclipse.hawkbit.repository.model.TenantMetaData;
 import org.eclipse.hawkbit.ui.UiProperties;
 import org.eclipse.hawkbit.ui.common.CommonDialogWindow;
 import org.eclipse.hawkbit.ui.common.DistributionSetTypeBeanQuery;
-import org.eclipse.hawkbit.ui.common.PopupWindowHelp;
 import org.eclipse.hawkbit.ui.common.table.BaseEntityEventType;
 import org.eclipse.hawkbit.ui.components.SPUIComponentProvider;
 import org.eclipse.hawkbit.ui.management.event.DistributionTableEvent;
@@ -51,10 +50,10 @@ import com.vaadin.event.FieldEvents.TextChangeEvent;
 import com.vaadin.event.FieldEvents.TextChangeListener;
 import com.vaadin.spring.annotation.SpringComponent;
 import com.vaadin.spring.annotation.ViewScope;
-import com.vaadin.ui.Alignment;
 import com.vaadin.ui.CheckBox;
 import com.vaadin.ui.ComboBox;
 import com.vaadin.ui.Component;
+import com.vaadin.ui.FormLayout;
 import com.vaadin.ui.Label;
 import com.vaadin.ui.TextArea;
 import com.vaadin.ui.TextField;
@@ -95,8 +94,6 @@ public class DistributionAddUpdateWindowLayout extends VerticalLayout {
     @Autowired
     private transient UiProperties uiProperties;
 
-    // private Button saveDistributionBtn;
-    // private Button discardDistributionBtn;
     private TextField distNameTextField;
     private TextField distVersionTextField;
     private Label madatoryLabel;
@@ -118,6 +115,8 @@ public class DistributionAddUpdateWindowLayout extends VerticalLayout {
     private TextChangeListener distVersionTextFieldListener;
     private ValueChangeListener distsetTypeNameComboBoxListener;
 
+    private FormLayout formLayout;
+
     /**
      * Initialize Distribution Add and Edit Window.
      */
@@ -128,17 +127,6 @@ public class DistributionAddUpdateWindowLayout extends VerticalLayout {
     }
 
     private void buildLayout() {
-        /* action button layout ( save & discard ) */
-        // final HorizontalLayout buttonsLayout = new HorizontalLayout();
-        // buttonsLayout.setSizeFull();
-        // buttonsLayout.setStyleName("dist-buttons-horz-layout");
-        // buttonsLayout.addComponents(saveDistributionBtn,
-        // discardDistributionBtn);
-        // buttonsLayout.setComponentAlignment(saveDistributionBtn,
-        // Alignment.BOTTOM_LEFT);
-        // buttonsLayout.setComponentAlignment(discardDistributionBtn,
-        // Alignment.BOTTOM_RIGHT);
-        // buttonsLayout.addStyleName("window-style");
 
         /*
          * The main layout of the window contains mandatory info, textboxes
@@ -147,13 +135,18 @@ public class DistributionAddUpdateWindowLayout extends VerticalLayout {
         setSpacing(Boolean.TRUE);
         addStyleName("lay-color");
         setSizeUndefined();
-        addComponents(new PopupWindowHelp(uiProperties.getLinks().getDocumentation().getRoot()), madatoryLabel,
-                distsetTypeNameComboBox, distNameTextField, distVersionTextField, descTextArea, reqMigStepCheckbox);
 
-        // addComponent(buttonsLayout);
+        formLayout = new FormLayout();
-        setComponentAlignment(madatoryLabel, Alignment.MIDDLE_LEFT);
+        formLayout.addComponent(madatoryLabel);
+        formLayout.addComponent(distsetTypeNameComboBox);
+        formLayout.addComponent(distNameTextField);
+        formLayout.addComponent(distVersionTextField);
+        formLayout.addComponent(descTextArea);
+        formLayout.addComponent(reqMigStepCheckbox);
+
+        addComponents(formLayout);
+
         distNameTextField.focus();
-
     }
 
     /**
@@ -192,20 +185,6 @@ public class DistributionAddUpdateWindowLayout extends VerticalLayout {
         reqMigStepCheckbox.addStyleName(ValoTheme.CHECKBOX_SMALL);
         reqMigStepCheckbox.setId(SPUIComponetIdProvider.DIST_ADD_MIGRATION_CHECK);
 
-        // /* save or update button */
-        // saveDistributionBtn =
-        // SPUIComponentProvider.getButton(SPUIComponetIdProvider.DIST_ADD_SAVE,
-        // "", "", "", true,
-        // FontAwesome.SAVE, SPUIButtonStyleSmallNoBorder.class);
-        // saveDistributionBtn.addClickListener(event -> saveDistribution());
-        //
-        // /* close button */
-        // discardDistributionBtn =
-        // SPUIComponentProvider.getButton(SPUIComponetIdProvider.DIST_ADD_DISCARD,
-        // "", "", "",
-        // true, FontAwesome.TIMES, SPUIButtonStyleSmallNoBorder.class);
-        // discardDistributionBtn.addClickListener(event ->
-        // discardDistribution());
     }
 
     /**
@@ -539,6 +518,8 @@ public class DistributionAddUpdateWindowLayout extends VerticalLayout {
         addDistributionWindow = SPUIComponentProvider.getWindow(i18n.get("caption.add.new.dist"), null,
                 SPUIDefinitions.CREATE_UPDATE_WINDOW, this, event -> saveDistribution(),
                 event -> discardDistribution());
+        addDistributionWindow.removeStyleName("actionButtonsMargin");
+
         return addDistributionWindow;
     }
 

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/management/dstag/CreateUpdateDistributionTagLayoutWindow.java

@@ -25,7 +25,7 @@ import org.vaadin.spring.events.EventScope;
 import org.vaadin.spring.events.annotation.EventBusListenerMethod;
 
 import com.vaadin.spring.annotation.SpringComponent;
-import com.vaadin.spring.annotation.VaadinSessionScope;
+import com.vaadin.spring.annotation.ViewScope;
 import com.vaadin.ui.Button.ClickEvent;
 import com.vaadin.ui.UI;
 
@@ -34,7 +34,7 @@ import com.vaadin.ui.UI;
  *
  */
 @SpringComponent
-@VaadinSessionScope
+@ViewScope
 public class CreateUpdateDistributionTagLayoutWindow extends CreateUpdateTagLayout {
 
     private static final long serialVersionUID = 444276149954167545L;
@@ -79,7 +79,7 @@ public class CreateUpdateDistributionTagLayoutWindow extends CreateUpdateTagLayo
             final DistributionSetTag existingDistTag = tagManagement.findDistributionSetTag(tagName.getValue());
             if (optiongroup.getValue().equals(createTagStr)) {
                 if (!checkIsDuplicate(existingDistTag)) {
-                    crateNewTag();
+                    createNewTag();
                 }
             } else {
 
@@ -91,7 +91,8 @@ public class CreateUpdateDistributionTagLayoutWindow extends CreateUpdateTagLayo
     /**
      * Create new tag.
      */
-    protected void crateNewTag() {
+    @Override
+    protected void createNewTag() {
         super.createNewTag();
         if (isNotEmpty(getTagNameValue())) {
             DistributionSetTag newDistTag = new DistributionSetTag(getTagNameValue());

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/management/footer/ActionTypeOptionGroupLayout.java

@@ -56,6 +56,7 @@ public class ActionTypeOptionGroupLayout extends HorizontalLayout {
         createOptionGroup();
         addValueChangeListener();
         setStyleName("dist-window-actiontype-horz-layout");
+        setSizeUndefined();
     }
 
     private void addValueChangeListener() {
@@ -127,8 +128,8 @@ public class ActionTypeOptionGroupLayout extends HorizontalLayout {
         forcedTimeDateField.setStyleName("dist-window-forcedtime");
 
         final TimeZone tz = SPDateTimeUtil.getBrowserTimeZone();
-        forcedTimeDateField.setValue(Date.from(LocalDateTime.now().plusWeeks(2)
+        forcedTimeDateField.setValue(
-                .atZone(SPDateTimeUtil.getTimeZoneId(tz)).toInstant()));
+                Date.from(LocalDateTime.now().plusWeeks(2).atZone(SPDateTimeUtil.getTimeZoneId(tz)).toInstant()));
         forcedTimeDateField.setImmediate(true);
         forcedTimeDateField.setTimeZone(tz);
         forcedTimeDateField.setLocale(i18n.getLocale());

hawkbit-ui/src/main/java/org/eclipse/hawkbit/ui/rollout/rollout/AddUpdateRolloutWindowLayout.java

@@ -27,8 +27,8 @@ import org.eclipse.hawkbit.repository.model.RolloutGroup.RolloutGroupErrorCondit
 import org.eclipse.hawkbit.repository.model.RolloutGroup.RolloutGroupSuccessAction;
 import org.eclipse.hawkbit.repository.model.RolloutGroup.RolloutGroupSuccessCondition;
 import org.eclipse.hawkbit.ui.UiProperties;
+import org.eclipse.hawkbit.ui.common.CommonDialogWindow;
 import org.eclipse.hawkbit.ui.components.SPUIComponentProvider;
-import org.eclipse.hawkbit.ui.decorators.SPUIButtonStyleSmallNoBorder;
 import org.eclipse.hawkbit.ui.filtermanagement.TargetFilterBeanQuery;
 import org.eclipse.hawkbit.ui.management.footer.ActionTypeOptionGroupLayout;
 import org.eclipse.hawkbit.ui.management.footer.ActionTypeOptionGroupLayout.ActionTypeOption;
@@ -54,22 +54,17 @@ import com.vaadin.data.Property.ValueChangeEvent;
 import com.vaadin.data.Validator;
 import com.vaadin.data.validator.IntegerRangeValidator;
 import com.vaadin.data.validator.RegexpValidator;
-import com.vaadin.server.FontAwesome;
 import com.vaadin.spring.annotation.SpringComponent;
 import com.vaadin.spring.annotation.ViewScope;
 import com.vaadin.ui.Alignment;
-import com.vaadin.ui.Button;
 import com.vaadin.ui.ComboBox;
-import com.vaadin.ui.CustomComponent;
+import com.vaadin.ui.GridLayout;
 import com.vaadin.ui.HorizontalLayout;
 import com.vaadin.ui.Label;
-import com.vaadin.ui.Link;
 import com.vaadin.ui.OptionGroup;
 import com.vaadin.ui.TextArea;
 import com.vaadin.ui.TextField;
 import com.vaadin.ui.UI;
-import com.vaadin.ui.VerticalLayout;
-import com.vaadin.ui.Window;
 import com.vaadin.ui.themes.ValoTheme;
 
 /**
@@ -79,7 +74,7 @@ import com.vaadin.ui.themes.ValoTheme;
  */
 @SpringComponent
 @ViewScope
-public class AddUpdateRolloutWindowLayout extends CustomComponent {
+public class AddUpdateRolloutWindowLayout extends GridLayout {
 
     private static final long serialVersionUID = 2999293468801479916L;
 
@@ -113,7 +108,7 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
     @Autowired
     private transient EventBus.SessionEventBus eventBus;
 
-    private Label madatoryLabel;
+    private Label mandatoryLabel;
 
     private TextField rolloutName;
 
@@ -131,15 +126,9 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
 
     private TextArea description;
 
-    private Button saveRolloutBtn;
-
-    private Button discardRollloutBtn;
-
     private OptionGroup errorThresholdOptionGroup;
 
-    private Link linkToHelp;
+    private CommonDialogWindow addUpdateRolloutWindow;
-
-    private Window addUpdateRolloutWindow;
 
     private Boolean editRolloutEnabled;
 
@@ -155,14 +144,16 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
      * Create components and layout.
      */
     public void init() {
+
+        setSizeFull();
         createRequiredComponents();
         buildLayout();
     }
 
-    public Window getWindow() {
+    public CommonDialogWindow getWindow() {
+
         addUpdateRolloutWindow = SPUIComponentProvider.getWindow(i18n.get("caption.configure.rollout"), null,
-                SPUIDefinitions.CREATE_UPDATE_WINDOW);
+                SPUIDefinitions.CREATE_UPDATE_WINDOW, this, event -> onRolloutSave(), event -> onDiscard());
-        addUpdateRolloutWindow.setContent(this);
         return addUpdateRolloutWindow;
     }
 
@@ -200,39 +191,37 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
     }
 
     private void buildLayout() {
-        final VerticalLayout mainLayout = new VerticalLayout();
-        mainLayout.setSpacing(Boolean.TRUE);
-        mainLayout.setSizeUndefined();
 
-        mainLayout.addComponents(madatoryLabel, rolloutName, distributionSet, getTargetFilterLayout(),
+        setSpacing(Boolean.TRUE);
-                getGroupDetailsLayout(), getTriggerThresoldLayout(), getErrorThresholdLayout(), description,
+        setSizeUndefined();
-                actionTypeOptionGroupLayout, linkToHelp, getSaveDiscardButtonLayout());
+        setRows(9);
-        mainLayout.setComponentAlignment(linkToHelp, Alignment.BOTTOM_RIGHT);
+        setColumns(3);
-        setCompositionRoot(mainLayout);
+
+        addComponent(mandatoryLabel, 0, 0, 2, 0);
+        addComponent(getLabel("textfield.name"), 0, 1);
+        addComponent(rolloutName, 1, 1);
+        addComponent(getLabel("prompt.distribution.set"), 0, 2);
+        addComponent(distributionSet, 1, 2);
+        addComponent(getLabel("prompt.target.filter"), 0, 3);
+        addComponent(getTargetFilterLayout(), 1, 3);
+        addComponent(getLabel("prompt.number.of.groups"), 0, 4);
+        addComponent(getGroupDetailsLayout(), 1, 4);
+        addComponent(getLabel("prompt.tigger.threshold"), 0, 5);
+        addComponent(triggerThreshold, 1, 5);
+        addComponent(getPercentHintLabel(), 2, 5);
+        addComponent(getLabel("prompt.error.threshold"), 0, 6);
+        addComponent(errorThreshold, 1, 6);
+        addComponent(errorThresholdOptionGroup, 2, 6);
+        addComponent(getLabel("textfield.description"), 0, 7);
+        addComponent(description, 1, 7, 2, 7);
+        addComponent(actionTypeOptionGroupLayout, 0, 8, 2, 8);
+
         rolloutName.focus();
     }
 
-    private HorizontalLayout getGroupDetailsLayout() {
-        final HorizontalLayout groupLayout = new HorizontalLayout();
-        groupLayout.setCaption(i18n.get("prompt.number.of.groups"));
-        groupLayout.setSizeFull();
-        groupLayout.addComponents(noOfGroups, groupSizeLabel);
-        groupLayout.setExpandRatio(noOfGroups, 1.0F);
-        groupLayout.setComponentAlignment(groupSizeLabel, Alignment.MIDDLE_LEFT);
-        return groupLayout;
-    }
-
-    private HorizontalLayout getErrorThresholdLayout() {
-        final HorizontalLayout errorThresoldLayout = new HorizontalLayout();
-        errorThresoldLayout.setSizeFull();
-        errorThresoldLayout.addComponents(errorThreshold, errorThresholdOptionGroup);
-        errorThresoldLayout.setExpandRatio(errorThreshold, 1.0F);
-        return errorThresoldLayout;
-    }
-
     private HorizontalLayout getTargetFilterLayout() {
         final HorizontalLayout targetFilterLayout = new HorizontalLayout();
-        targetFilterLayout.setSizeFull();
+        targetFilterLayout.setSizeUndefined();
         targetFilterLayout.addComponents(targetFilterQueryCombo, targetFilterQuery, totalTargetsLabel);
         targetFilterLayout.setExpandRatio(targetFilterQueryCombo, 0.71F);
         targetFilterLayout.setExpandRatio(targetFilterQuery, 0.70F);
@@ -241,13 +230,22 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
         return targetFilterLayout;
     }
 
-    private HorizontalLayout getTriggerThresoldLayout() {
+    private HorizontalLayout getGroupDetailsLayout() {
-        final HorizontalLayout triggerThresholdLayout = new HorizontalLayout();
+        final HorizontalLayout groupLayout = new HorizontalLayout();
-        triggerThresholdLayout.setCaption(i18n.get("prompt.tigger.thresold"));
+        groupLayout.setSizeUndefined();
-        triggerThresholdLayout.setSizeFull();
+        groupLayout.addComponents(noOfGroups, groupSizeLabel);
-        triggerThresholdLayout.addComponents(triggerThreshold, getPercentHintLabel());
+        groupLayout.setExpandRatio(noOfGroups, 1.0F);
-        triggerThresholdLayout.setExpandRatio(triggerThreshold, 1.0F);
+        groupLayout.setComponentAlignment(groupSizeLabel, Alignment.MIDDLE_LEFT);
-        return triggerThresholdLayout;
+        return groupLayout;
+    }
+
+    private Label getLabel(final String key) {
+        return SPUIComponentProvider.getLabel(i18n.get(key), SPUILabelDefinitions.SP_LABEL_SIMPLE);
+    }
+
+    private TextField getTextfield(final String key) {
+        return SPUIComponentProvider.getTextField(null, "", ValoTheme.TEXTFIELD_TINY, true, null, i18n.get(key), true,
+                SPUILabelDefinitions.TEXT_FIELD_MAX_LENGTH);
     }
 
     private Label getPercentHintLabel() {
@@ -257,18 +255,8 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
         return percentSymbol;
     }
 
-    private HorizontalLayout getSaveDiscardButtonLayout() {
-        final HorizontalLayout buttonsLayout = new HorizontalLayout();
-        buttonsLayout.setSizeFull();
-        buttonsLayout.addComponents(saveRolloutBtn, discardRollloutBtn);
-        buttonsLayout.setComponentAlignment(saveRolloutBtn, Alignment.BOTTOM_LEFT);
-        buttonsLayout.setComponentAlignment(discardRollloutBtn, Alignment.BOTTOM_RIGHT);
-        buttonsLayout.addStyleName("window-style");
-        return buttonsLayout;
-    }
-
     private void createRequiredComponents() {
-        madatoryLabel = createMandatoryLabel();
+        mandatoryLabel = createMandatoryLabel();
         rolloutName = createRolloutNameField();
         distributionSet = createDistributionSetCombo();
         populateDistributionSet();
@@ -279,20 +267,14 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
         noOfGroups = createNoOfGroupsField();
         groupSizeLabel = createGroupSizeLabel();
         triggerThreshold = createTriggerThresold();
-        errorThreshold = createErrorThresold();
+        errorThreshold = createErrorThreshold();
         description = createDescription();
         errorThresholdOptionGroup = createErrorThresholdOptionGroup();
         setDefaultSaveStartGroupOption();
-        saveRolloutBtn = createSaveButton();
-        discardRollloutBtn = createDiscardButton();
         actionTypeOptionGroupLayout.selectDefaultOption();
-
         totalTargetsLabel = createTotalTargetsLabel();
         targetFilterQuery = createTargetFilterQuery();
-
-        linkToHelp = SPUIComponentProvider.getHelpLink(uiProperties.getLinks().getDocumentation().getRolloutView());
         actionTypeOptionGroupLayout.addStyleName(SPUIStyleDefinitions.ROLLOUT_ACTION_TYPE_LAYOUT);
-
     }
 
     private Label createGroupSizeLabel() {
@@ -312,7 +294,7 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
         filterField.setNullRepresentation(HawkbitCommonUtil.SP_STRING_EMPTY);
         filterField.setVisible(false);
         filterField.setEnabled(false);
-        filterField.setSizeFull();
+        filterField.setSizeUndefined();
         return filterField;
     }
 
@@ -350,13 +332,13 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
     }
 
     private ComboBox createTargetFilterQueryCombo() {
-        final ComboBox targetFilter = SPUIComponentProvider.getComboBox(null, "", "", null, null, true, "",
+        final ComboBox targetFilter = SPUIComponentProvider.getComboBox(null, "", "", null, ValoTheme.COMBOBOX_SMALL,
-                i18n.get("prompt.target.filter"));
+                true, "", i18n.get("prompt.target.filter"));
         targetFilter.setImmediate(true);
         targetFilter.setPageLength(7);
         targetFilter.setItemCaptionPropertyId(SPUILabelDefinitions.VAR_NAME);
         targetFilter.setId(SPUIComponetIdProvider.ROLLOUT_TARGET_FILTER_COMBO_ID);
-        targetFilter.setSizeFull();
+        targetFilter.setSizeUndefined();
         targetFilter.addValueChangeListener(event -> onTargetFilterChange());
         return targetFilter;
     }
@@ -393,24 +375,6 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
         return new LazyQueryContainer(
                 new LazyQueryDefinition(true, SPUIDefinitions.PAGE_SIZE, SPUILabelDefinitions.VAR_NAME),
                 targetFilterQF);
-
-    }
-
-    private Button createDiscardButton() {
-        final Button discardRollloutBtn = SPUIComponentProvider.getButton(
-                SPUIComponetIdProvider.ROLLOUT_CREATE_UPDATE_DISCARD_ID, "", "", "", true, FontAwesome.TIMES,
-                SPUIButtonStyleSmallNoBorder.class);
-        discardRollloutBtn.addClickListener(event -> onDiscard());
-        return discardRollloutBtn;
-    }
-
-    private Button createSaveButton() {
-        final Button saveRolloutBtn = SPUIComponentProvider.getButton(
-                SPUIComponetIdProvider.ROLLOUT_CREATE_UPDATE_SAVE_ID, "", "", "", true, FontAwesome.SAVE,
-                SPUIButtonStyleSmallNoBorder.class);
-        saveRolloutBtn.addClickListener(event -> onRolloutSave());
-        saveRolloutBtn.setImmediate(true);
-        return saveRolloutBtn;
     }
 
     private void onDiscard() {
@@ -589,44 +553,38 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
     }
 
     private TextArea createDescription() {
-        final TextArea descriptionField = SPUIComponentProvider.getTextArea(i18n.get("textfield.description"),
+        final TextArea descriptionField = SPUIComponentProvider.getTextArea(null, "text-area-style",
-                "text-area-style", ValoTheme.TEXTFIELD_TINY, false, null, i18n.get("textfield.description"),
+                ValoTheme.TEXTAREA_TINY, false, null, i18n.get("textfield.description"),
                 SPUILabelDefinitions.TEXT_AREA_MAX_LENGTH);
         descriptionField.setId(SPUIComponetIdProvider.ROLLOUT_DESCRIPTION_ID);
         descriptionField.setNullRepresentation(HawkbitCommonUtil.SP_STRING_EMPTY);
-        descriptionField.setSizeFull();
+        descriptionField.setSizeUndefined();
         return descriptionField;
     }
 
-    private TextField createErrorThresold() {
+    private TextField createErrorThreshold() {
-        final TextField errorField = SPUIComponentProvider.getTextField(i18n.get("prompt.error.threshold"), "",
+        final TextField errorField = getTextfield("prompt.error.threshold");
-                ValoTheme.TEXTFIELD_TINY, true, null, i18n.get("prompt.error.threshold"), true,
-                SPUILabelDefinitions.TEXT_FIELD_MAX_LENGTH);
         errorField.addValidator(new ThresholdFieldValidator());
         errorField.setId(SPUIComponetIdProvider.ROLLOUT_ERROR_THRESOLD_ID);
         errorField.setMaxLength(7);
-        errorField.setSizeFull();
+        errorField.setSizeUndefined();
         return errorField;
     }
 
     private TextField createTriggerThresold() {
-        final TextField thresholdField = SPUIComponentProvider.getTextField(i18n.get("prompt.tigger.thresold"), "",
+        final TextField thresholdField = getTextfield("prompt.tigger.threshold");
-                ValoTheme.TEXTFIELD_TINY, true, null, i18n.get("prompt.tigger.thresold"), true,
-                SPUILabelDefinitions.TEXT_FIELD_MAX_LENGTH);
         thresholdField.setId(SPUIComponetIdProvider.ROLLOUT_TRIGGER_THRESOLD_ID);
         thresholdField.addValidator(new ThresholdFieldValidator());
-        thresholdField.setSizeFull();
+        thresholdField.setSizeUndefined();
         thresholdField.setMaxLength(3);
         return thresholdField;
     }
 
     private TextField createNoOfGroupsField() {
-        final TextField noOfGroupsField = SPUIComponentProvider.getTextField(i18n.get("prompt.number.of.groups"), "",
+        final TextField noOfGroupsField = getTextfield("prompt.number.of.groups");
-                ValoTheme.TEXTFIELD_TINY, true, null, i18n.get("prompt.number.of.groups"), true,
-                SPUILabelDefinitions.TEXT_FIELD_MAX_LENGTH);
         noOfGroupsField.setId(SPUIComponetIdProvider.ROLLOUT_NO_OF_GROUPS_ID);
         noOfGroupsField.addValidator(new GroupNumberValidator());
-        noOfGroupsField.setSizeFull();
+        noOfGroupsField.setSizeUndefined();
         noOfGroupsField.setMaxLength(3);
         noOfGroupsField.addValueChangeListener(evevt -> onGroupNumberChange());
         return noOfGroupsField;
@@ -642,13 +600,13 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
     }
 
     private ComboBox createDistributionSetCombo() {
-        final ComboBox dsSet = SPUIComponentProvider.getComboBox(i18n.get("prompt.distribution.set"), "", "", null,
+        final ComboBox dsSet = SPUIComponentProvider.getComboBox(null, "", "", null, ValoTheme.COMBOBOX_SMALL, true, "",
-                null, true, "", i18n.get("prompt.distribution.set"));
+                i18n.get("prompt.distribution.set"));
         dsSet.setImmediate(true);
         dsSet.setPageLength(7);
         dsSet.setItemCaptionPropertyId(SPUILabelDefinitions.VAR_NAME);
         dsSet.setId(SPUIComponetIdProvider.ROLLOUT_DS_ID);
-        dsSet.setSizeFull();
+        dsSet.setSizeUndefined();
         return dsSet;
     }
 
@@ -667,11 +625,9 @@ public class AddUpdateRolloutWindowLayout extends CustomComponent {
     }
 
     private TextField createRolloutNameField() {
-        final TextField rolloutNameField = SPUIComponentProvider.getTextField(i18n.get("textfield.name"), "",
+        final TextField rolloutNameField = getTextfield("textfield.name");
-                ValoTheme.TEXTFIELD_TINY, true, null, i18n.get("textfield.name"), true,
-                SPUILabelDefinitions.TEXT_FIELD_MAX_LENGTH);
         rolloutNameField.setId(SPUIComponetIdProvider.ROLLOUT_NAME_FIELD_ID);
-        rolloutNameField.setSizeFull();
+        rolloutNameField.setSizeUndefined();
         return rolloutNameField;
     }
 

hawkbit-ui/src/main/resources/VAADIN/themes/hawkbit/customstyles/popup-window.scss

@@ -163,6 +163,6 @@
   }
   
   .actionButtonsMargin {
-  	margin-top: 10px;
+  	margin-top: 30px;
   }
 }

hawkbit-ui/src/main/resources/messages.properties

@@ -462,7 +462,7 @@ rollout.group.label.target.truncated = {0} targets has been truncated in the lis
 
 
 prompt.number.of.groups = Number of groups
-prompt.tigger.thresold = Trigger threshold
+prompt.tigger.threshold = Trigger threshold
 prompt.error.threshold = Error threshold
 prompt.distribution.set = Distribution set
 caption.configure.rollout = Configure rollout

hawkbit-ui/src/main/resources/messages_de.properties

@@ -452,7 +452,7 @@ menu.title = Software Provisioning
 
 #Rollout management
 prompt.number.of.groups = Number of groups
-prompt.tigger.thresold = Trigger threshold
+prompt.tigger.threshold = Trigger threshold
 prompt.error.threshold = Error threshold
 prompt.distribution.set = Distribution set
 caption.configure.rollout = Configure rollout

hawkbit-ui/src/main/resources/messages_en.properties

@@ -443,7 +443,7 @@ menu.title = Software Provisioning
 
 #Rollout management
 prompt.number.of.groups = Number of groups
-prompt.tigger.thresold = Trigger threshold
+prompt.tigger.threshold = Trigger threshold
 prompt.error.threshold = Error threshold
 prompt.distribution.set = Distribution set
 caption.configure.rollout = Configure rollout