Simplified the parent project step. Fixed multiple bugs related to di…

…splaying Copy from Parent button and data on the Summary step #7289

modules/lib/src/main/resources/assets/js/app/settings/dialog/project/create/step/ProjectTypeDialogStep.ts

@@ -15,11 +15,11 @@ export class ProjectTypeDialogStep
 
  protected initEventListeners(): void {
  super.initEventListeners();
-
+/*
  this.getFormItem().onRadioValueChanged(() => {
  this.notifyDataChanged();
  });
-
+*/
  this.getFormItem().onProjectValueChanged(() => {
  this.notifyDataChanged();
  });
@@ -29,10 +29,6 @@ export class ProjectTypeDialogStep
  return 'project-type-step';
  }
 
- isOptional(): boolean {
- return false;
- }
-
  getData(): ProjectParentDialogStepData {
  return new ProjectParentDialogStepData().setParentProjects(this.getFormItem()?.getSelectedProjects());
  }
@@ -41,10 +37,6 @@ export class ProjectTypeDialogStep
  return this.getFormItem()?.hasData();
  }
 
- isValid(): Q.Promise<boolean> {
- return Q.resolve(this.hasData());
- }
-
  getName(): string {
  return 'projectCreate';
  }
@@ -54,6 +46,6 @@ export class ProjectTypeDialogStep
  }
 
  private getFormItem(): ProjectTypeFormItem {
- return this.formItems && this.formItems[0] as ProjectTypeFormItem;
+ return this.formItems?.[0] as ProjectTypeFormItem;
  }
 }

modules/lib/src/main/resources/assets/js/app/settings/dialog/project/create/step/summary/ProjectSummaryStep.ts

@@ -14,6 +14,7 @@ import {ApplicationsValueContainer} from './ApplicationsValueContainer';
 import {AccessValueContainer} from './AccessValueContainer';
 import {PermissionsValueContainer} from './PermissionsValueContainer';
 import {ProjectsValueContainer} from './ProjectsValueContainer';
+import {ProjectConfigContext} from '../../../../../data/project/ProjectConfigContext';
 
 export class ProjectSummaryStep
  extends DialogStep {
@@ -103,10 +104,19 @@ export class ProjectSummaryStep
  }
 
  this.descriptionContainer.updateValue(this.data.description);
- this.descriptionContainer.show();
+ this.setContainerVisible(this.descriptionContainer, true);
  } else {
- this.descriptionContainer?.getPreviousElement()?.hide();
- this.descriptionContainer?.hide();
+ this.setContainerVisible(this.descriptionContainer, false);
+ }
+ }
+
+ private setContainerVisible(container: SummaryValueContainer, show: boolean): void {
+ if (show) {
+ container?.getPreviousElement()?.show();
+ container?.show();
+ } else {
+ container?.getPreviousElement()?.hide();
+ container?.hide();
  }
  }
 
@@ -119,26 +129,26 @@ export class ProjectSummaryStep
  }
 
  private updateParentProjectBlock(): void {
- if (this.data.parents) {
+ if (this.data.parents?.length) {
  if (!this.parentProjectsContainer) {
  this.createAndAddParentProjectContainer();
  }
 
  this.parentProjectsContainer.updateValue(this.data.parents);
- this.parentProjectsContainer.show();
+ this.setContainerVisible(this.parentProjectsContainer, true);
  } else {
- this.parentProjectsContainer?.getPreviousElement()?.hide();
- this.parentProjectsContainer?.hide();
+ this.setContainerVisible(this.parentProjectsContainer, false);
  }
  }
 
  private createAndAddParentProjectContainer(): void {
+ const isMultiInheritance: boolean = ProjectConfigContext.get().getProjectConfig()?.isMultiInheritance();
  const parentNameContainer: SummaryNameContainer = new SummaryNameContainer().updateName(
- i18n('dialog.project.wizard.summary.parent.title'));
+ isMultiInheritance ? i18n('dialog.project.wizard.summary.parents.title') : i18n('dialog.project.wizard.summary.parent.title')
+ );
  this.parentProjectsContainer = new ProjectsValueContainer();
- const insertAfterEl: Element = this.descriptionContainer || this.idContainer || this.dataContainer;
- parentNameContainer.insertAfterEl(insertAfterEl);
- this.parentProjectsContainer.insertAfterEl(parentNameContainer);
+ this.dataContainer.prependChild(this.parentProjectsContainer);
+ this.dataContainer.prependChild(parentNameContainer);
  }
 
  private updateLanguageBlock(): void {
@@ -148,18 +158,17 @@ export class ProjectSummaryStep
  }
 
  this.languageContainer.updateValue(this.data.locale);
- this.languageContainer.show();
+ this.setContainerVisible(this.languageContainer, true);
  } else {
- this.languageContainer?.getPreviousElement()?.hide();
- this.languageContainer?.hide();
+ this.setContainerVisible(this.languageContainer, false);
  }
  }
 
  private createAndAddLanguageContainer(): void {
  const languageNameContainer: SummaryNameContainer = new SummaryNameContainer().updateName(
  i18n('dialog.project.wizard.summary.language.title'));
  this.languageContainer = new LanguageValueContainer();
- const insertAfterEl: Element = this.parentProjectsContainer || this.descriptionContainer || this.idContainer || this.dataContainer;
+ const insertAfterEl: Element = this.descriptionContainer || this.idContainer;
  languageNameContainer.insertAfterEl(insertAfterEl);
  this.languageContainer.insertAfterEl(languageNameContainer);
  }
@@ -172,19 +181,17 @@ export class ProjectSummaryStep
 
  this.accessContainer.updateValue(i18n(`settings.items.wizard.readaccess.${this.data.access.getAccess()}`));
  this.accessContainer.setPrincipals(this.data.access.getPrincipals());
- this.accessContainer.show();
+ this.setContainerVisible(this.accessContainer, true);
  } else {
- this.accessContainer?.getPreviousElement()?.hide();
- this.accessContainer?.hide();
+ this.setContainerVisible(this.accessContainer, false);
  }
  }
 
  private createAndAddAccessContainer(): void {
  const accessNameContainer: SummaryNameContainer = new SummaryNameContainer().updateName(
  i18n('dialog.project.wizard.summary.access.title'));
  this.accessContainer = new AccessValueContainer(this.currentUser);
- const insertAfterEl: Element = this.languageContainer || this.parentProjectsContainer || this.descriptionContainer ||
- this.idContainer || this.dataContainer;
+ const insertAfterEl: Element = this.languageContainer || this.descriptionContainer || this.idContainer;
  accessNameContainer.insertAfterEl(insertAfterEl);
  this.accessContainer.insertAfterEl(accessNameContainer);
  }
@@ -196,18 +203,18 @@ export class ProjectSummaryStep
  }
 
  this.permissionsContainer.updateValue(this.data.permissions);
- this.permissionsContainer.show();
+ this.setContainerVisible(this.permissionsContainer, true);
  } else {
- this.permissionsContainer?.hide();
+ this.setContainerVisible(this.permissionsContainer, false);
  }
  }
 
  private createAndAddPermissions(): void {
  const permissionsNameContainer: SummaryNameContainer = new SummaryNameContainer().updateName(
  i18n('dialog.project.wizard.summary.permissions.title'));
  this.permissionsContainer = new PermissionsValueContainer(this.currentUser);
- const insertAfterEl: Element = this.accessContainer || this.languageContainer || this.parentProjectsContainer ||
- this.descriptionContainer || this.idContainer || this.dataContainer;
+ const insertAfterEl: Element = this.accessContainer || this.languageContainer ||
+  this.descriptionContainer || this.idContainer;
  permissionsNameContainer.insertAfterEl(insertAfterEl);
  this.permissionsContainer.insertAfterEl(permissionsNameContainer);
  }
@@ -219,9 +226,9 @@ export class ProjectSummaryStep
  }
 
  this.applicationsContainer.updateValue(this.data.applications);
- this.applicationsContainer.show();
+ this.setContainerVisible(this.applicationsContainer, true);
  } else {
- this.applicationsContainer?.hide();
+ this.setContainerVisible(this.applicationsContainer, false);
  }
  }
 
@@ -230,7 +237,7 @@ export class ProjectSummaryStep
  i18n('dialog.project.wizard.summary.applications.title'));
  this.applicationsContainer = new ApplicationsValueContainer();
  const insertAfterEl: Element = this.permissionsContainer || this.accessContainer || this.languageContainer ||
- this.parentProjectsContainer || this.descriptionContainer || this.idContainer || this.dataContainer;
+ this.descriptionContainer || this.idContainer;
  applicationsNameContainer.insertAfterEl(insertAfterEl);
  this.applicationsContainer.insertAfterEl(applicationsNameContainer);
  }

modules/lib/src/main/resources/assets/js/app/settings/wizard/panel/form/element/CopyFromParentFormItem.ts

@@ -18,7 +18,7 @@ export abstract class CopyFromParentFormItem
 
  this.parentProjects = value;
 
- if (value) {
+ if (value.length > 0) {
  this.appendCopyButton();
  } else {
  this.removeCopyButton();

modules/lib/src/main/resources/assets/js/app/settings/wizard/panel/form/element/ProjectTypeFormItem.ts

@@ -1,80 +1,38 @@
-import {Validators} from '@enonic/lib-admin-ui/ui/form/Validators';
 import {i18n} from '@enonic/lib-admin-ui/util/Messages';
 import {ProjectFormItem, ProjectFormItemBuilder} from './ProjectFormItem';
 import {ProjectsDropdownBuilder, ProjectsSelector} from './ProjectsSelector';
-import {RadioGroup} from '@enonic/lib-admin-ui/ui/RadioGroup';
-import {ValueChangedEvent} from '@enonic/lib-admin-ui/ValueChangedEvent';
 import {Project} from '../../../../data/project/Project';
-import {DivEl} from '@enonic/lib-admin-ui/dom/DivEl';
 import {ProjectConfigContext} from '../../../../data/project/ProjectConfigContext';
 
-enum PARENT_TYPE {
- PROJECT = 'project', LAYER = 'layer'
-}
-
 export class ProjectTypeFormItem
  extends ProjectFormItem {
 
  private projectsSelector: ProjectsSelector;
 
- private projectsComboLabel: DivEl;
-
  constructor() {
- super(new ProjectFormItemBuilder(
- new RadioGroup('read-access-radio-group'))
- .setHelpText(i18n('settings.projects.parent.helptext'))
- .setLabel(i18n('settings.field.project.type'))
- .setValidator(Validators.required) as ProjectFormItemBuilder);
-
- this.initElements();
- this.initListeners();
- this.addClass('project-type-form-item');
- }
-
- protected initElements(): void {
- const readAccessRadioGroup: RadioGroup = this.getRadioGroup();
+ const isMultiInheritance: boolean = ProjectConfigContext.get().getProjectConfig()?.isMultiInheritance();
+ const maxParents: number = isMultiInheritance ? 0 : 1;
+ const inputBuilder = new ProjectsDropdownBuilder().setMaximumOccurrences(maxParents) as ProjectsDropdownBuilder;
 
- readAccessRadioGroup.addOption(PARENT_TYPE.PROJECT, i18n('settings.items.type.project'));
- readAccessRadioGroup.addOption(PARENT_TYPE.LAYER, i18n('settings.items.type.layer'));
+ const projectSelector = new ProjectsSelector(inputBuilder);
 
- const maxParents: number = ProjectConfigContext.get().getProjectConfig()?.isMultiInheritance() ? 0 : 1;
- const builder = new ProjectsDropdownBuilder().setMaximumOccurrences(maxParents) as ProjectsDropdownBuilder;
- this.projectsSelector = new ProjectsSelector(builder);
- this.projectsSelector.insertAfterEl(this.getRadioGroup());
- this.projectsSelector.setEnabled(false);
- this.projectsSelector.hide();
-
- this.projectsComboLabel = new DivEl('projects-label').setHtml(i18n('settings.field.project.parent'));
- this.projectsSelector.prependChild(this.projectsComboLabel);
- }
+ const projectFormItemBuilder = new ProjectFormItemBuilder(projectSelector)
+ .setHelpText(i18n('settings.projects.parent.helptext'))
+ .setLabel(i18n(isMultiInheritance ? 'dialog.project.wizard.summary.parents.title' : 'dialog.project.wizard.summary.parent.title'));
 
- protected initListeners(): void {
- this.getRadioGroup().onValueChanged((event: ValueChangedEvent) => {
- const newValue: string = event.getNewValue();
- const isLayer: boolean = newValue === PARENT_TYPE.LAYER.toString();
- const isToBeVisible: boolean = isLayer || !!this.projectsSelector.getValue();
+ super(projectFormItemBuilder as ProjectFormItemBuilder);
 
- this.projectsSelector.setEnabled(isLayer);
- this.projectsSelector.setVisible(isToBeVisible);
- this.projectsComboLabel.setVisible(isToBeVisible);
- });
- }
+ this.projectsSelector = this.getInput() as ProjectsSelector;
 
- private getRadioGroup(): RadioGroup {
- return this.getInput() as RadioGroup;
+ this.addClass('project-type-form-item');
  }
 
  hasData(): boolean {
- const selectedType: string = this.getRadioGroup().getValue();
- return selectedType === PARENT_TYPE.PROJECT.toString() || (selectedType === PARENT_TYPE.LAYER.toString() && !!this.projectsSelector.getValue());
+ return !!this.projectsSelector.getValue();
  }
 
  getSelectedProjects(): Project[] {
- return this.getRadioGroup().getValue() === PARENT_TYPE.LAYER.toString() ? this.projectsSelector.getSelectedDisplayValues() : null;
- }
-
- onRadioValueChanged(listener: () => void): void {
- this.getRadioGroup().onValueChanged(listener);
+ return this.projectsSelector.getSelectedDisplayValues();
  }
 
  onProjectValueChanged(listener: () => void): void {

modules/lib/src/main/resources/assets/styles/settings/wizard/panel/form/element/project-type-form-item.less

@@ -1,18 +1,6 @@
+/*
 .project-type-form-item {
- .radio-group {
- padding-left: 0;
-
- .radio-button {
- &:last-child {
- margin-bottom: 15px;
- }
- }
- }
-
  .projects-selector {
- width: auto;
- padding-left: 23px;
-
  .projects-label {
  line-height: 20px;
 
@@ -33,3 +21,4 @@
  }
  }
 }
+*/

modules/lib/src/main/resources/i18n/dialogs.properties

@@ -139,7 +139,8 @@ dialog.project.wizard.step.id.exists=This project identifier already exists
 dialog.project.wizard.action.submit=Create Project
 dialog.project.wizard.summary.id.title=Project name/id
 dialog.project.wizard.summary.description.title=Description
-dialog.project.wizard.summary.parent.title=Parent Projects
+dialog.project.wizard.summary.parent.title=Parent Project
+dialog.project.wizard.summary.parents.title=Parent Projects
 dialog.project.wizard.summary.language.title=Default language
 dialog.project.wizard.summary.access.title=Access mode
 dialog.project.wizard.summary.permissions.title=Permissions

modules/lib/src/main/resources/i18n/phrases.properties

@@ -448,7 +448,6 @@ settings.projects.parent.helptext=NB! Parent project cannot be changed after the
 settings.projects.applications.helptext=Content items in this project can be powered by schemas from these applications
 settings.field.project.parent=Parent projects
 settings.field.project.parent.none=None
-settings.field.project.type=Project type
 settings.statistics.canread=Can Read
 settings.statistics.authors=Authors
 settings.statistics.editors=Editors