Fix drag and drop and initial container.

backend/i18n/frontend_en.json

@@ -204,6 +204,7 @@
   "common.backups": "Backups",
   "common.bytes": "bytes",
   "common.cancel": "Cancel",
+  "common.category": "Category",
   "common.clear": "Clear",
   "common.clientId": "Client Id",
   "common.clients": "Clients",

backend/i18n/frontend_it.json

@@ -204,6 +204,7 @@
   "common.backups": "Backup",
   "common.bytes": "byte",
   "common.cancel": "Annulla",
+  "common.category": "Category",
   "common.clear": "Pulisci",
   "common.clientId": "Id Client",
   "common.clients": "Client",

backend/i18n/frontend_nl.json

@@ -204,6 +204,7 @@
   "common.backups": "Back-ups",
   "common.bytes": "bytes",
   "common.cancel": "Annuleren",
+  "common.category": "Category",
   "common.clear": "Wissen",
   "common.clientId": "Client-ID",
   "common.clients": "Clients",

backend/i18n/source/frontend_en.json

@@ -204,6 +204,7 @@
   "common.backups": "Backups",
   "common.bytes": "bytes",
   "common.cancel": "Cancel",
+  "common.category": "Category",
   "common.clear": "Clear",
   "common.clientId": "Client Id",
   "common.clients": "Clients",

backend/src/Squidex.Shared/Texts.it.resx

@@ -176,7 +176,7 @@
     <value>Hai raggiunto la dimensione massima consentito per le risorse.</value>
   </data>
   <data name="assets.referenced" xml:space="preserve">
-    <value>Assets is referenced by a content and cannot be deleted.</value>
+    <value>La risorsa è collegata ad un contenuto pertanto non può essere cancellata.</value>
   </data>
   <data name="backups.alreadyRunning" xml:space="preserve">
     <value>E' in esecuzione una altro processo di backup.</value>
@@ -476,7 +476,7 @@
     <value>{count} Collegamenti(s)</value>
   </data>
   <data name="contents.referenced" xml:space="preserve">
-    <value>Content is referenced by another content and cannot be deleted.</value>
+    <value>Il contenuto è collegato ad un altro contenuto e pertanto non può essere cancellato.</value>
   </data>
   <data name="contents.singletonNotChangeable" xml:space="preserve">
     <value>Il contenuto singleton non può essere aggiornato</value>
@@ -512,7 +512,7 @@
     <value>Non può avere valori duplicati.</value>
   </data>
   <data name="contents.validation.error" xml:space="preserve">
-    <value>Validation failed with internal error.</value>
+    <value>Non è stato possibile validare a causa di un errore interno.</value>
   </data>
   <data name="contents.validation.exactValue" xml:space="preserve">
     <value>Deve essere esattamente {value}.</value>
@@ -677,7 +677,7 @@
     <value>La query Json non è valida: {message}</value>
   </data>
   <data name="exceptions.domainObjectConflict" xml:space="preserve">
-    <value>Entity ({id}) already exists.</value>
+    <value>L'entità ({id}) esiste già.</value>
   </data>
   <data name="exceptions.domainObjectDeleted" xml:space="preserve">
     <value>L'entità ({id}) è stata cancellata.</value>

frontend/app/features/schemas/pages/schemas/schema-form.component.html

@@ -14,17 +14,17 @@
             <sqx-form-error [error]="createForm.error | async"></sqx-form-error>
         
             <div class="form-group">
-                <label for="schemaName">{{ 'common.name' | sqxTranslate }} <small class="hint">({{ 'common.requiredHint' | sqxTranslate }})</small></label>
+                <label for="name">{{ 'common.name' | sqxTranslate }} <small class="hint">({{ 'common.requiredHint' | sqxTranslate }})</small></label>
                 
                 <sqx-control-errors for="name"></sqx-control-errors>
         
-                <input type="text" class="form-control" id="schemaName" formControlName="name" autocomplete="off" sqxTransformInput="LowerCase" sqxFocusOnInit>
+                <input type="text" class="form-control" id="name" formControlName="name" autocomplete="off" sqxTransformInput="LowerCase" sqxFocusOnInit>
 
                 <sqx-form-hint>
                     {{ 'schemas.schemaNameHint' | sqxTranslate }}
                 </sqx-form-hint>
             </div>
-
+        
             <div class="form-group mt-4">
                 <div class="row">
                     <div class="col-6 type">
@@ -65,6 +65,21 @@
                 </div>
             </div>
 
+            <sqx-form-alert>
+                {{ 'schemas.nameWarning' | sqxTranslate }}
+            </sqx-form-alert>
+
+            <ng-container *ngIf="schemasState.categories | async; let categories">
+                <div class="form-group" *ngIf="categories.length > 1">
+                    <label for="category">{{ 'common.category' | sqxTranslate }}</label>
+            
+                    <select class="custom-select" id="category" formControlName="initialCategory">
+                        <option></option>
+                        <option *ngFor="let category of categories | slice:1" [ngValue]="category.name">{{category.name}}</option>
+                    </select>
+                </div>
+            </ng-container>
+
             <div class="form-group">
                 <button type="button" class="btn btn-sm btn-text" (click)="toggleImport()" [class.hidden]="showImport">
                     {{ 'schemas.import' | sqxTranslate }}
@@ -75,10 +90,6 @@
         
                 <sqx-json-editor height="250" *ngIf="showImport" formControlName="importing"></sqx-json-editor>
             </div>
-
-            <sqx-form-alert marginBottom="0">
-                {{ 'schemas.nameWarning' | sqxTranslate }}
-            </sqx-form-alert>
         </ng-container>
 
         <ng-container footer>

frontend/app/features/schemas/pages/schemas/schema-form.component.ts

@@ -31,8 +31,8 @@ export class SchemaFormComponent implements OnInit {
     constructor(
         public readonly apiUrl: ApiUrlConfig,
         public readonly appsState: AppsState,
-        private readonly formBuilder: FormBuilder,
+        public readonly schemasState: SchemasState,
-        private readonly schemasState: SchemasState
+        private readonly formBuilder: FormBuilder
     ) {
     }
 

frontend/app/shared/components/schema-category.component.html

@@ -12,7 +12,14 @@
                 </button>
             </div>
             <div class="col">
-                <h3 class="truncate">{{schemaCategory.name}} </h3>
+                <h3 class="truncate">
+                    <ng-container *ngIf="schemaCategory.name?.length > 0; else noName">
+                        {{schemaCategory.name}}
+                    </ng-container>
+                    <ng-template #noName>
+                        {{ 'i18n:common.schemas' | sqxTranslate }}
+                    </ng-template>
+                </h3>
             </div>
             <div class="col-auto">
                 <ng-container *ngIf="schemaCategory.schemas.length > 0; else noSchemas">
@@ -31,7 +38,6 @@
         <ng-container *ngIf="!forContent; else simpleMode">
             <div *ngFor="let schema of filteredSchemas; trackBy: trackBySchema" class="nav-item"
                 routerLinkActive="active"
-                cdkDropList
                 cdkDrag
                 cdkDragLockAxis="y"
                 [cdkDragData]="schema">

frontend/app/shared/components/schema-category.component.scss

@@ -94,10 +94,6 @@ $drag-margin: -8px;
     }
 }
 
-.cdk-drag-placeholder {
-    display: none;
-}
-
 .cdk-drag-animating {
     transition: none;
 }

frontend/app/shared/services/schemas.service.ts

@@ -345,8 +345,10 @@ export interface UpdateUIFields {
 export interface CreateSchemaDto {
     readonly name: string;
     readonly fields?: ReadonlyArray<RootFieldDto>;
-    readonly properties?: SchemaPropertiesDto;
+    readonly category?: string;
     readonly isSingleton?: boolean;
+    readonly isPublished?: boolean;
+    readonly properties?: SchemaPropertiesDto;
 }
 
 export interface UpdateSchemaCategoryDto {

frontend/app/shared/state/schemas.forms.ts

@@ -31,21 +31,22 @@ export class CreateSchemaForm extends Form<FormGroup, CreateSchemaDto> {
                     ValidatorsEx.pattern('[a-z0-9]+(\-[a-z0-9]+)*', 'i18n:schemas.schemaNameValidationMessage')
                 ]
             ],
+            initialCategory: undefined,
             isSingleton: false,
             importing: {}
         }));
     }
 
     public transformLoad(value: CreateSchemaDto) {
-        const { name, isSingleton, ...importing } = value;
+        const { name, isSingleton, category, ...importing } = value;
 
-        return { name, isSingleton, importing };
+        return { name, isSingleton, importing, initialCategory: category };
     }
 
     public transformSubmit(value: any): CreateSchemaDto {
-        const { name, isSingleton, importing } = value;
+        const { name, isSingleton, importing, initialCategory } = value;
 
-        return { name, isSingleton, ...importing };
+        return { name, isSingleton, category: initialCategory, ...importing };
     }
 }
 

frontend/app/shared/state/schemas.state.ts

@@ -43,7 +43,7 @@ function sameSchema(lhs: SchemaDetailsDto | null, rhs?: SchemaDetailsDto | null)
 
 @Injectable()
 export class SchemasState extends State<Snapshot> {
-    public categoriesPlain =
+    public categoryNames =
         this.project(x => x.categories);
 
     public selectedSchemaOrNull =
@@ -68,7 +68,7 @@ export class SchemasState extends State<Snapshot> {
         this.projectFrom(this.schemas, x => x.filter(s => s.isPublished));
 
     public categories =
-        this.projectFrom2(this.schemas, this.categoriesPlain, (s, c) => buildCategories(c, s));
+        this.projectFrom2(this.schemas, this.categoryNames, (s, c) => buildCategories(c, s));
 
     public get schemaId() {
         return this.snapshot.selectedSchema?.id || '';
@@ -383,8 +383,10 @@ function getField(x: SchemaDetailsDto, request: AddFieldDto, parent?: RootFieldD
     }
 }
 
+const NO_NAME = '';
+
 function buildCategories(categories: ReadonlyArray<string>, schemas: SchemasList): ReadonlyArray<SchemaCategory> {
-    const uniqueCategories: { [name: string]: true } = {};
+    const uniqueCategories: { [name: string]: true } = { [NO_NAME]: true };
 
     for (const category of categories) {
         uniqueCategories[category] = true;
@@ -408,7 +410,7 @@ function buildCategories(categories: ReadonlyArray<string>, schemas: SchemasList
 }
 
 function getCategory(schema: SchemaDto) {
-    return schema.category || 'Schemas';
+    return schema.category || NO_NAME;
 }
 
 export function isSameCategory(name: string, schema: SchemaDto): boolean {