Add motion update form

client/package-lock.json

@@ -4645,12 +4645,14 @@
                 "balanced-match": {
                     "version": "1.0.0",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "brace-expansion": {
                     "version": "1.1.11",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "balanced-match": "^1.0.0",
                         "concat-map": "0.0.1"
@@ -4665,17 +4667,20 @@
                 "code-point-at": {
                     "version": "1.1.0",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "concat-map": {
                     "version": "0.0.1",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "console-control-strings": {
                     "version": "1.1.0",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "core-util-is": {
                     "version": "1.0.2",
@@ -4792,7 +4797,8 @@
                 "inherits": {
                     "version": "2.0.3",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "ini": {
                     "version": "1.3.5",
@@ -4804,6 +4810,7 @@
                     "version": "1.0.0",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "number-is-nan": "^1.0.0"
                     }
@@ -4818,6 +4825,7 @@
                     "version": "3.0.4",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "brace-expansion": "^1.1.7"
                     }
@@ -4825,12 +4833,14 @@
                 "minimist": {
                     "version": "0.0.8",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "minipass": {
                     "version": "2.2.4",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "safe-buffer": "^5.1.1",
                         "yallist": "^3.0.0"
@@ -4849,6 +4859,7 @@
                     "version": "0.5.1",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "minimist": "0.0.8"
                     }
@@ -4929,7 +4940,8 @@
                 "number-is-nan": {
                     "version": "1.0.1",
                     "bundled": true,
-                    "dev": true
+                    "dev": true,
+                    "optional": true
                 },
                 "object-assign": {
                     "version": "4.1.1",
@@ -4941,6 +4953,7 @@
                     "version": "1.4.0",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "wrappy": "1"
                     }
@@ -5062,6 +5075,7 @@
                     "version": "1.0.2",
                     "bundled": true,
                     "dev": true,
+                    "optional": true,
                     "requires": {
                         "code-point-at": "^1.0.0",
                         "is-fullwidth-code-point": "^1.0.0",

client/src/app/shared/directives/os-perms.directive.ts

@@ -78,7 +78,6 @@ export class OsPermsDirective extends OpenSlidesComponent {
     private updateView(): void {
         if (this.checkPermissions()) {
             // will just render the page normally
-            console.log('do show: ', this.template, ' - ', this.viewContainer);
             this.viewContainer.createEmbeddedView(this.template);
         } else {
             // will remove the content of the container

client/src/app/shared/models/motions/motion.ts

@@ -6,6 +6,7 @@ import { Config } from '../core/config';
 import { Workflow } from './workflow';
 import { User } from '../users/user';
 import { Category } from './category';
+import { WorkflowState } from './workflow-state';
 
 /**
  * Representation of Motion.
@@ -123,7 +124,7 @@ export class Motion extends BaseModel {
     get submitterName() {
         const mainSubmitter = this.DS.get(User, this.submitters[0].user_id) as User;
         if (mainSubmitter) {
-            return mainSubmitter.username;
+            return mainSubmitter;
         } else {
             return '';
         }
@@ -132,40 +133,74 @@ export class Motion extends BaseModel {
     /**
      * get the category of a motion as object
      */
-    get category() {
+    get category(): any {
         if (this.category_id) {
             const motionCategory = this.DS.get(Category, this.category_id);
-            return motionCategory;
+            return motionCategory as Category;
         } else {
             return 'none';
         }
     }
 
+    /**
+     * Set the category in the motion
+     */
+    set category(newCategory: any) {
+        this.category_id = newCategory.id;
+    }
+
+    /**
+     * Returns the workflow
+     *
+     * TODO this is the default workflow, not yet the coresponding for the motion
+     */
+    get workflow(): Workflow {
+        const motionsWorkflowConfig = this.DS.filter(Config, config => config.key === 'motions_workflow')[0] as Config;
+        //make sure this is a number
+        const workflowId = +motionsWorkflowConfig.value;
+        //get the workflow for our motion
+        const selectedWorkflow = this.DS.get(Workflow, workflowId) as Workflow;
+        return selectedWorkflow;
+    }
+
     /**
      * return the workflow state
      *
      * Right now only the default workflow is assumed
      * TODO: Motion workflow needs to be specific on the server
      */
-    get stateName() {
+    get state() {
-        //get the default workflow
+        const workflow = this.workflow;
-        const motionsWorkflowConfig = this.DS.filter(Config, config => config.key === 'motions_workflow')[0] as Config;
+        const state = workflow.state_by_id(this.state_id);
-        //make sure this is a number
+        return state;
-        const workflowId = +motionsWorkflowConfig.value;
-        //get the workflow for out motion
-        const selectedWorkflow = this.DS.get(Workflow, workflowId) as Workflow;
-        const stateName = selectedWorkflow.getStateNameById(this.state_id);
-        if (stateName !== 'NULL') {
-            return stateName;
-        } else {
-            return '';
-        }
     }
 
-    get possibleStates() {
+    /**
-        return '';
+     * returns possible states for the motion
+     */
+    get possible_states(): WorkflowState[] {
+        return this.workflow.states;
     }
 
+    /**
+     * Returns possible "initial" states for a motion.
+     *
+     * Will filter "submitted"
+     */
+    // get initial_states(): WorkflowState[] {
+    //     const states = this.workflow.states;
+
+    //     //find index of 'submitted'
+    //     const submitted = states.findIndex(state => state.name === 'submitted');
+
+    //     //if found a valid index, remove "submitted" from array
+    //     if (typeof submitted === 'number' && submitted >= 0) {
+    //         states.splice(submitted, 1);
+    //     }
+
+    //     return states;
+    // }
+
     /**
      * Returns the name of the recommendation.
      *
@@ -173,13 +208,10 @@ export class Motion extends BaseModel {
      * TODO: Motion workflow needs to be specific on the server
      */
     get recommendation() {
-        //get the default workflow
+        // const stateName = this.workflow.getStateNameById(this.recommendation_id);
-        const motionsWorkflowConfig = this.DS.filter(Config, config => config.key === 'motions_workflow')[0] as Config;
+        const state = this.workflow.state_by_id(this.recommendation_id);
-        const workflowId = +motionsWorkflowConfig.value;
+        if (state) {
-        const selectedWorkflow = this.DS.get(Workflow, workflowId) as Workflow;
+            return state.recommendation_label;
-        const stateName = selectedWorkflow.getStateNameById(this.recommendation_id);
-        if (stateName !== 'NULL') {
-            return stateName;
         } else {
             return '';
         }

client/src/app/shared/models/motions/workflow-state.ts

@@ -83,4 +83,8 @@ export class WorkflowState implements Deserializable {
         Object.assign(this, input);
         return this;
     }
+
+    public toString = (): string => {
+        return this.name;
+    };
 }

client/src/app/shared/models/motions/workflow.ts

@@ -21,14 +21,14 @@ export class Workflow extends BaseModel {
         this.first_state = first_state;
     }
 
-    getStateNameById(id: number): string {
+    state_by_id(id: number): WorkflowState {
-        let stateName = 'NULL';
+        let targetState;
         this.states.forEach(state => {
             if (id === state.id) {
-                stateName = state.name;
+                targetState = state;
             }
         });
-        return stateName;
+        return targetState as WorkflowState;
     }
 
     deserialize(input: any): this {

client/src/app/shared/models/users/user.ts

@@ -64,4 +64,39 @@ export class User extends BaseModel {
     getGroups(): BaseModel | BaseModel[] {
         return this.DS.get('users/group', ...this.groups_id);
     }
+
+    //TODO get full_name
+
+    // TODO read config values  for "users_sort_by"
+    get short_name(): string {
+        const title = this.title.trim();
+        const firstName = this.first_name.trim();
+        const lastName = this.last_name.trim();
+        let shortName = '';
+
+        // TODO need DS adjustment first first
+        // if (this.DS.getConfig('users_sort_by').value === 'last_name') {
+        //     if (lastName && firstName) {
+        //         shortName += `${lastName}, ${firstName}`;
+        //     } else {
+        //         shortName += lastName || firstName;
+        //     }
+        // }
+
+        shortName += `${firstName} ${lastName}`;
+
+        if (shortName.trim() === '') {
+            shortName = this.username;
+        }
+
+        if (title) {
+            shortName = `${title} ${shortName}`;
+        }
+
+        return shortName.trim();
+    }
+
+    public toString = (): string => {
+        return this.short_name;
+    };
 }

client/src/app/shared/shared.module.ts

@@ -20,6 +20,8 @@ import { MatDialogModule } from '@angular/material/dialog';
 import { MatListModule } from '@angular/material/list';
 import { MatExpansionModule } from '@angular/material/expansion';
 import { MatMenuModule } from '@angular/material/menu';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatSelectModule } from '@angular/material/select';
 
 // FontAwesome modules
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
@@ -48,6 +50,8 @@ library.add(fas);
     imports: [
         CommonModule,
         FormsModule,
+        MatFormFieldModule,
+        MatSelectModule,
         ReactiveFormsModule,
         MatButtonModule,
         MatCheckboxModule,
@@ -68,6 +72,8 @@ library.add(fas);
     ],
     exports: [
         FormsModule,
+        MatFormFieldModule,
+        MatSelectModule,
         ReactiveFormsModule,
         MatButtonModule,
         MatCheckboxModule,

client/src/app/site/motions/motion-detail/motion-detail.component.html

@@ -1,11 +1,11 @@
 <mat-toolbar color='primary'>
 
-    <button class='generic-mini-button on-transition-fade' mat-mini-fab>
+    <button (click)='editMotionButton()' class='generic-mini-button on-transition-fade' mat-mini-fab>
-        <fa-icon icon='pen'></fa-icon>
+
+        <fa-icon *ngIf="!editMotion" icon='pen'></fa-icon>
+        <fa-icon *ngIf="editMotion" icon='check'></fa-icon>
     </button>
 
-    <!-- motion.identifier -->
-    <!-- motion.versions[0].title -->
     <div class='motion-title on-transition-fade'>
         <span translate>Motion</span> {{motion.identifier}}: {{motion.currentTitle}}
         <br>
@@ -16,37 +16,63 @@
 </mat-toolbar>
 
 <mat-accordion multi='true' class='on-transition-fade'>
-    <!-- <mat-expansion-panel [expanded]='true' class='meta-info-panel'> -->
+
-    <mat-expansion-panel class='meta-info-panel'>
+    <!-- MetaInfo -->
+    <mat-expansion-panel #metaInfoPanel [expanded]='true' class='meta-info-panel'>
         <mat-expansion-panel-header>
             <mat-panel-title>
                 <fa-icon icon='info-circle' [fixedWidth]="true"></fa-icon>
                 <span translate>Meta information</span>
             </mat-panel-title>
         </mat-expansion-panel-header>
-        <div class='meta-info-panel-body'>
 
-            <div *ngIf="motion.submitterName">
+        <!-- Meta info -->
+        <form [formGroup]='metaInfoForm' class='expansion-panel-custom-body' (ngSubmit)='saveMotion()'>
+
+            <!-- Identifier -->
+            <div *ngIf="editMotion">
+                <div *ngIf='!editMotion'>
+                    <h3 translate>Identifier</h3>
+                    {{motion.identifier}}
+                </div>
+                <mat-form-field *ngIf="editMotion">
+                    <input matInput #identifier placeholder='Identifier' [value]='motion.identifier'>
+                </mat-form-field>
+            </div>
+
+            <!-- Submitter -->
+            <div *ngIf="motion.submitterName || editMotion">
                 <h3 translate>Submitters</h3>
                 {{motion.submitterName}}
             </div>
 
-            <div *ngIf='motion.supporters_id && motion.supporters_id.length > 0'>
+            <!-- Supporter -->
-                <h3>translate>Supporters</h3>
+            <div *ngIf='motion.supporters_id && motion.supporters_id.length > 0 || editMotion'>
+                <h3 translate>Supporters</h3>
                 <!-- print all motion supporters -->
             </div>
 
-            <div *ngIf='motion.state_id'>
+            <!-- State -->
-                <h3>
+            <div *ngIf='motion.state_id || editMotion'>
-                    <a [matMenuTriggerFor]="stateMenu">
+                <div *ngIf='!editMotion'>
-                        <span translate>Status</span>
+                    <h3 translate>State</h3>
-                        <fa-icon icon='cog'></fa-icon>
+                    {{motion.state.name}}
-                    </a>
+                </div>
-                </h3>
+                <mat-form-field *ngIf="editMotion">
-                {{motion.stateName}}
+                    <mat-select placeholder='State' formControlName='state'>
+                        <mat-option *ngFor="let state of motion.possible_states" [value]="state">{{state}}</mat-option>
+                        <mat-divider></mat-divider>
+                        <mat-option>
+                            <fa-icon icon='exclamation-triangle'></fa-icon>
+                            Reset State
+                        </mat-option>
+                    </mat-select>
+                </mat-form-field>
             </div>
 
-            <div *ngIf='motion.recommendation_id'>
+            <!-- Recommendation -->
+            <!-- TODO make sure this is only shown if the corresponding setting was set -->
+            <div *ngIf='motion.recommendation_id && editMotion'>
                 <h3>
                     <a [matMenuTriggerFor]="stateMenu">
                         <span>{{motion.recomBy}}</span>
@@ -56,35 +82,41 @@
                 {{motion.recommendation}}
             </div>
 
-            <div *ngIf="motion.category_id">
+            <!-- Category -->
-                <h3>
+            <div *ngIf="motion.category_id || editMotion">
-                    <a [matMenuTriggerFor]="categoryMenu">
+                <div *ngIf='!editMotion'>
-                        <span translate>Category</span>
+                    <h3 translate> Category</h3>
-                        <fa-icon icon='cog'></fa-icon>
+                    {{motion.category}}
-                    </a>
+                </div>
-                </h3>
+                <mat-form-field *ngIf="editMotion">
-                {{motion.category}}
+                    <mat-select placeholder='Category' formControlName='categoryFormControl'>
-            </div>
+                        <mat-option>None</mat-option>
-
+                        <mat-divider></mat-divider>
-            <div *ngIf="motion.origin">
+                        <mat-option *ngFor="let cat of getMotionCategories()" [value]="cat">{{cat}}</mat-option>
-                <h3>
+                    </mat-select>
-                    <span translate>Origin</span>
-                    <fa-icon icon='cog'></fa-icon>
-                </h3>
-                <span>{{motion.origin}}</span>
-
-                <br>
-                <mat-form-field>
-                    <input matInput #origin placeholder='Origin' value={{motion.origin}}>
                 </mat-form-field>
             </div>
 
-            <div *ngIf='motion.polls && motion.polls.length > 0'>
+            <!-- Origin -->
-                <h3 translate>Voting</h3>
+            <div *ngIf="motion.origin || editMotion">
+                <div *ngIf='!editMotion'>
+                    <h3 translate> Origin</h3>
+                    {{motion.origin}}
+                </div>
+                <mat-form-field *ngIf="editMotion">
+                    <input matInput #origin placeholder='Origin' [value]='motion.origin'>
+                </mat-form-field>
             </div>
-        </div>
+
+            <!-- Voting -->
+            <!-- <div *ngIf='motion.polls && motion.polls.length > 0 || editMotion'>
+                <h3 translate>Voting</h3>
+            </div> -->
+        </form>
+        <!-- </div> -->
     </mat-expansion-panel>
-    <!-- <mat-expansion-panel [expanded]='true'> -->
+
+    <!-- Personal Note -->
     <mat-expansion-panel>
         <mat-expansion-panel-header>
             <mat-panel-title>
@@ -94,7 +126,9 @@
         </mat-expansion-panel-header>
         TEST
     </mat-expansion-panel>
-    <mat-expansion-panel [expanded]='true' class='content-panel'>
+
+    <!-- Content -->
+    <mat-expansion-panel #contentPanel [expanded]='true' class='content-panel'>
         <mat-expansion-panel-header>
             <mat-panel-title>
                 <fa-icon icon='align-left' [fixedWidth]="true"></fa-icon>
@@ -102,11 +136,38 @@
             </mat-panel-title>
         </mat-expansion-panel-header>
 
-        <h3 translate>The assembly may decide:</h3>
+        <div class='expansion-panel-custom-body'>
-        <div [innerHtml]='motion.currentText'></div>
+            <!-- Title -->
+            <div *ngIf="motion.currentTitle || editMotion">
+                <div *ngIf='!editMotion'>
+                    <h2>{{motion.currentTitle}}</h2>
+                </div>
+                <mat-form-field *ngIf="editMotion" class='wide-text'>
+                    <input matInput #title placeholder='Title' [value]='motion.currentTitle'>
+                </mat-form-field>
+            </div>
+
+            <!-- Text -->
+            <h3 translate>The assembly may decide:</h3>
+            <div *ngIf='!editMotion'>
+                <div [innerHtml]='motion.currentText'></div>
+            </div>
+            <mat-form-field *ngIf="editMotion" class='wide-text'>
+                <textarea matInput #motionText placeholder='Motion Text' [value]='motion.currentText'></textarea>
+            </mat-form-field>
+
+            <!-- Reason -->
+            <div *ngIf="motion.currentReason || editMotion">
+                <div *ngIf='!editMotion'>
+                    <h4 translate>Reason</h4>
+                    <div [innerHtml]='motion.currentReason'></div>
+                </div>
+                <mat-form-field *ngIf="editMotion" class='wide-text'>
+                    <textarea matInput #reason placeholder="Reason" [value]='motion.currentReason'></textarea>
+                </mat-form-field>
+            </div>
+        </div>
 
-        <h4 *ngIf='motion.currentReason' translate class='motion-reason-label'>Reason</h4>
-        <div [innerHtml]='motion.currentReason'></div>
 
     </mat-expansion-panel>
 </mat-accordion>
@@ -117,8 +178,3 @@
     <button mat-menu-item translate>Reject</button>
     <button mat-menu-item translate>Do not decice</button>
 </mat-menu>
-
-<mat-menu #categoryMenu="matMenu">
-    <button mat-menu-item translate>B - Bildung</button>
-    <button mat-menu-item translate>T - Test</button>
-</mat-menu>

client/src/app/site/motions/motion-detail/motion-detail.component.scss

@@ -52,17 +52,33 @@ mat-panel-title {
             margin-left: 5px;
         }
     }
+}
 
-    .meta-info-panel-body {
+.wide-text {
+    width: 95%;
+
+    textarea {
+        height: 200px;
+    }
+}
+
+mat-expansion-panel {
+    .expansion-panel-custom-body {
         padding-left: 55px;
     }
 }
 
 .content-panel {
+    h2 {
+        display: block;
+        font-weight: bold;
+        font-size: 120%;
+    }
+
     h3 {
+        display: block;
         font-weight: initial;
         font-size: 100%;
-        display: block;
     }
 
     h4 {

client/src/app/site/motions/motion-detail/motion-detail.component.ts

@@ -1,8 +1,10 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { OpenSlidesComponent } from '../../../openslides.component';
 import { BaseComponent } from '../../../base.component';
 import { Motion } from '../../../shared/models/motions/motion';
+import { Category } from '../../../shared/models/motions/category';
+import { FormGroup, FormBuilder } from '@angular/forms';
+import { MatExpansionPanel } from '@angular/material';
 
 @Component({
     selector: 'app-motion-detail',
@@ -10,33 +12,73 @@ import { Motion } from '../../../shared/models/motions/motion';
     styleUrls: ['./motion-detail.component.scss']
 })
 export class MotionDetailComponent extends BaseComponent implements OnInit {
+    @ViewChild('metaInfoPanel') metaInfoPanel: MatExpansionPanel;
+    @ViewChild('contentPanel') contentPanel: MatExpansionPanel;
+
     motion: Motion;
+    metaInfoForm: FormGroup;
+    editMotion = false;
 
-    constructor(private route: ActivatedRoute) {
+    // categoryFormControl: FormControl;
+
+    constructor(private route: ActivatedRoute, private formBuilder: FormBuilder) {
         super();
+        this.createForm();
         this.route.params.subscribe(params => {
-            console.log(params.id);
-
             // has the motion of the DataStore was initialized before.
-            // Otherwise we need to observe DS
             this.motion = this.DS.get(Motion, params.id) as Motion;
+            if (this.motion) {
+                this.patchForm();
+            }
 
             // Observe motion to get the motion in the parameter and also get the changes
             this.DS.getObservable().subscribe(newModel => {
                 if (newModel instanceof Motion) {
                     if (newModel.id === +params.id) {
                         this.motion = newModel as Motion;
-                        console.log('this.motion = ', this.motion);
+                        this.patchForm();
-                        // console.log('motion state name: ', this.motion.stateName);
                     }
                 }
             });
         });
     }
 
+    /** Parches the Form with content from the dataStore */
+    patchForm() {
+        this.metaInfoForm.patchValue({ categoryFormControl: this.motion.category });
+        this.metaInfoForm.patchValue({ state: this.motion.state });
+    }
+
+    /** Create the whole Form with empty or default values */
+    createForm() {
+        this.metaInfoForm = this.formBuilder.group({
+            categoryFormControl: [''],
+            state: ['']
+        });
+    }
+
+    saveMotion() {
+        console.log('Save motion: ', this.metaInfoForm.value);
+    }
+
+    getMotionCategories(): Category[] {
+        const categories = this.DS.get(Category);
+        return categories as Category[];
+    }
+
+    editMotionButton() {
+        this.editMotion ? (this.editMotion = false) : (this.editMotion = true);
+        if (this.editMotion) {
+            this.metaInfoPanel.open();
+            this.contentPanel.open();
+        }
+
+        // console.log('this.motion.possible_states: ', this.motion.possible_states);
+    }
+
     ngOnInit() {
         console.log('(init)the motion: ', this.motion);
-        console.log('motion state name: ', this.motion.stateName);
+        console.log('motion state name: ', this.motion.state);
     }
 
     downloadSingleMotionButton() {

client/src/app/site/motions/motion-list/motion-list.component.html

@@ -53,8 +53,8 @@
     <ng-container matColumnDef="state">
         <mat-header-cell *matHeaderCellDef mat-sort-header> State </mat-header-cell>
         <mat-cell *matCellDef="let motion">
-            <div *ngIf='motion.stateName !== "submitted"' class='innerTable'>
+            <div *ngIf='motion.state.name !== "submitted"' class='innerTable'>
-                <fa-icon icon={{getStateIcon(motion.stateName)}}></fa-icon>
+                <fa-icon icon={{getStateIcon(motion.state)}}></fa-icon>
             </div>
         </mat-cell>
     </ng-container>
@@ -63,4 +63,4 @@
     <mat-row (click)='selectMotion(row)' *matRowDef="let row; columns: columnsToDisplayMinWidth"></mat-row>
 </mat-table>
 
-<mat-paginator class="on-transition-fade" [pageSizeOptions]="[25, 50, 75, 100, 125]"></mat-paginator>
+<mat-paginator class="on-transition-fade" [pageSizeOptions]="[25, 50, 75, 100, 125]"></mat-paginator>

client/src/app/site/motions/motion-list/motion-list.component.ts

@@ -77,23 +77,24 @@ export class MotionListComponent extends BaseComponent implements OnInit {
     }
 
     selectMotion(motion) {
-        console.log('clicked a row, :', motion);
-
         this.router.navigate(['./' + motion.id], { relativeTo: this.route });
     }
 
     /**
      * Get the icon to the coresponding Motion Status
      * TODO Needs to be more accessible (Motion workflow needs adjustment on the server)
-     * @param stateName the name of the state
+     * @param state the name of the state
      */
-    getStateIcon(stateName) {
+    getStateIcon(state) {
+        const stateName = state.name;
         if (stateName === 'accepted') {
             return 'thumbs-up';
         } else if (stateName === 'rejected') {
             return 'thumbs-down';
         } else if (stateName === 'not decided') {
             return 'question';
+        } else {
+            return '';
         }
     }
 

client/src/app/site/site.component.ts

@@ -66,9 +66,9 @@ export class SiteComponent extends BaseComponent implements OnInit {
             });
 
         //get a translation via code: use the translation service
-        this.translate.get('Motions').subscribe((res: string) => {
+        // this.translate.get('Motions').subscribe((res: string) => {
-            console.log('translation of motions in the target language: ' + res);
+        //     console.log('translation of motions in the target language: ' + res);
-        });
+        // });
 
         //start autoupdate if the user is logged in:
         this.operator.whoAmI().subscribe(resp => {