alfresco-content-app/src/app/common/dialogs/folder-dialog.component.html

<h2 mat-dialog-title>
    {{
        (editing
            ? 'APP.FOLDER_DIALOG.EDIT_FOLDER_TITLE'
            : 'APP.FOLDER_DIALOG.CREATE_FOLDER_TITLE'
        ) | translate
    }}
</h2>

<mat-dialog-content>
    <form [formGroup]="form" (submit)="submit()">
        <mat-form-field style="width: 100%">
            <input
                placeholder="{{ 'APP.FOLDER_DIALOG.FOLDER_NAME.LABEL' | translate }}"
                matInput
                required
                [formControl]="form.controls['name']"
            />

            <mat-hint *ngIf="form.controls['name'].dirty">
                <span *ngIf="form.controls['name'].errors?.required">
                    {{ 'APP.FOLDER_DIALOG.FOLDER_NAME.ERRORS.REQUIRED' | translate }}
                </span>

                <span *ngIf="!form.controls['name'].errors?.required && form.controls['name'].errors?.message">
                    {{ form.controls['name'].errors?.message | translate }}
                </span>
            </mat-hint>
        </mat-form-field>

        <br />
        <br />

        <mat-form-field style="width: 100%">
            <textarea
                matInput
                placeholder="{{ 'APP.FOLDER_DIALOG.FOLDER_DESCRIPTION.LABEL' | translate }}"
                rows="4"
                [formControl]="form.controls['description']"></textarea>
        </mat-form-field>
    </form>
</mat-dialog-content>

<mat-dialog-actions>
    <button
        mat-raised-button
        (click)="submit()"
        [disabled]="!form.valid">
        {{
            (editing
                ? 'APP.FOLDER_DIALOG.UPDATE_BUTTON.LABEL'
                : 'APP.FOLDER_DIALOG.CREATE_BUTTON.LABEL'
            ) | translate
        }}
    </button>

    <button
        mat-button
        mat-dialog-close>
        {{ 'APP.FOLDER_DIALOG.CANCEL_BUTTON.LABEL' | translate }}
    </button>
</mat-dialog-actions>