Add motion comment section sort view

client/src/app/core/repositories/motions/motion-comment-section-repository.service.ts

@@ -122,7 +122,7 @@ export class MotionCommentSectionRepositoryService extends BaseRepository<
      * Sort all comment sections. All sections must be given excatly once.
      */
     public async sortCommentSections(sections: ViewMotionCommentSection[]): Promise<void> {
-        return await this.http.post('/rest/motions/motion-comment-section', {
+        return await this.http.post('/rest/motions/motion-comment-section/sort/', {
             ids: sections.map(section => section.id)
         });
     }

client/src/app/site/motions/modules/motion-comment-section/components/motion-comment-section-list/motion-comment-section-list.component.html

@@ -3,6 +3,13 @@
     <div class="title-slot">
         <h2 translate>Comment fields</h2>
     </div>
+
+    <!-- Menu -->
+    <div class="menu-slot">
+        <button type="button" mat-icon-button [matMenuTriggerFor]="commentListMenu">
+            <mat-icon>more_vert</mat-icon>
+        </button>
+    </div>
 </os-head-bar>
 
 <div class="head-spacer"></div>
@@ -139,3 +146,10 @@
         </mat-action-row>
     </mat-expansion-panel>
 </mat-accordion>
+
+<mat-menu #commentListMenu="matMenu">
+    <button mat-menu-item routerLink="sort">
+        <mat-icon>sort</mat-icon>
+        <span translate>Sort</span>
+    </button>
+</mat-menu>

client/src/app/site/motions/modules/motion-comment-section/components/motion-comment-section-sort/motion-comment-section-sort.component.html

@@ -0,0 +1,13 @@
+<os-head-bar [nav]="false">
+    <!-- Title -->
+    <div class="title-slot">
+        <h2 translate>Sort Comments</h2>
+    </div>
+</os-head-bar>
+
+<!-- Content -->
+<mat-card class="os-form-card">
+    <!-- The sorting component -->
+    <os-sorting-list (sortEvent)="onSortingChange($event)" [live]="true" [input]="comments" #sorter>
+    </os-sorting-list>
+</mat-card>

client/src/app/site/motions/modules/motion-comment-section/components/motion-comment-section-sort/motion-comment-section-sort.component.spec.ts

@@ -0,0 +1,26 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MotionCommentSectionSortComponent } from './motion-comment-section-sort.component';
+import { E2EImportsModule } from 'e2e-imports.module';
+
+describe('MotionCommentSectionSortComponent', () => {
+    let component: MotionCommentSectionSortComponent;
+    let fixture: ComponentFixture<MotionCommentSectionSortComponent>;
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            imports: [E2EImportsModule],
+            declarations: [MotionCommentSectionSortComponent]
+        }).compileComponents();
+    }));
+
+    beforeEach(() => {
+        fixture = TestBed.createComponent(MotionCommentSectionSortComponent);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it('should create', () => {
+        expect(component).toBeTruthy();
+    });
+});

client/src/app/site/motions/modules/motion-comment-section/components/motion-comment-section-sort/motion-comment-section-sort.component.ts

@@ -0,0 +1,58 @@
+import { Component, OnInit } from '@angular/core';
+import { Title } from '@angular/platform-browser';
+import { MatSnackBar } from '@angular/material';
+
+import { TranslateService } from '@ngx-translate/core';
+
+import { BaseViewComponent } from 'app/site/base/base-view';
+import { MotionCommentSectionRepositoryService } from 'app/core/repositories/motions/motion-comment-section-repository.service';
+import { ViewMotionCommentSection } from 'app/site/motions/models/view-motion-comment-section';
+
+/**
+ * Sorting view for motion comments
+ */
+@Component({
+    selector: 'os-motion-comment-section-sort',
+    templateUrl: './motion-comment-section-sort.component.html',
+    styleUrls: ['./motion-comment-section-sort.component.scss']
+})
+export class MotionCommentSectionSortComponent extends BaseViewComponent implements OnInit {
+    /**
+     * Holds the models
+     */
+    public comments: ViewMotionCommentSection[];
+
+    /**
+     * Constructor
+     *
+     * @param title Title service
+     * @param translate Translate service
+     * @param snackBar Snack bar
+     * @param repo Motion comment repository service
+     */
+    public constructor(
+        title: Title,
+        translate: TranslateService, // protected required for ng-translate-extract
+        snackBar: MatSnackBar,
+        private repo: MotionCommentSectionRepositoryService
+    ) {
+        super(title, translate, snackBar);
+        super.setTitle('Sort comments');
+    }
+
+    /**
+     * Get the view models from the repo
+     */
+    public ngOnInit(): void {
+        this.repo.getViewModelListObservable().subscribe(comments => (this.comments = comments));
+    }
+
+    /**
+     * Executed if the sorting changes
+     *
+     * @param commentsInOrder
+     */
+    public onSortingChange(commentsInOrder: ViewMotionCommentSection[]): void {
+        this.repo.sortCommentSections(commentsInOrder).then(null, this.raiseError);
+    }
+}

client/src/app/site/motions/modules/motion-comment-section/motion-comment-section-routing.module.ts

@@ -1,9 +1,13 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
-import { MotionCommentSectionListComponent } from './motion-comment-section-list.component';
+import { MotionCommentSectionListComponent } from './components/motion-comment-section-list/motion-comment-section-list.component';
+import { MotionCommentSectionSortComponent } from './components/motion-comment-section-sort/motion-comment-section-sort.component';
 
-const routes: Routes = [{ path: '', component: MotionCommentSectionListComponent, pathMatch: 'full' }];
+const routes: Routes = [
+    { path: '', component: MotionCommentSectionListComponent, pathMatch: 'full' },
+    { path: 'sort', component: MotionCommentSectionSortComponent }
+];
 
 @NgModule({
     imports: [RouterModule.forChild(routes)],

client/src/app/site/motions/modules/motion-comment-section/motion-comment-section.module.ts

@@ -3,10 +3,11 @@ import { CommonModule } from '@angular/common';
 
 import { MotionCommentSectionRoutingModule } from './motion-comment-section-routing.module';
 import { SharedModule } from 'app/shared/shared.module';
-import { MotionCommentSectionListComponent } from './motion-comment-section-list.component';
+import { MotionCommentSectionListComponent } from './components/motion-comment-section-list/motion-comment-section-list.component';
+import { MotionCommentSectionSortComponent } from './components/motion-comment-section-sort/motion-comment-section-sort.component';
 
 @NgModule({
-    declarations: [MotionCommentSectionListComponent],
+    declarations: [MotionCommentSectionListComponent, MotionCommentSectionSortComponent],
     imports: [CommonModule, MotionCommentSectionRoutingModule, SharedModule]
 })
 export class MotionCommentSectionModule {}