feat(done): Support done state of Deck 1.12.0

Signed-off-by: Stefan Niedermann <[email protected]>

cypress/e2e/spec.cy.ts

@@ -53,6 +53,9 @@ describe('Analyzer main screen', () => {
     cases.forEach(([description, expected]) => {
       cy.visit('/');
 
+      if (description.isDone) {
+        cy.get('[formControlName="isDone"]').click()
+      }
       if (description.isSharedBoard) {
         cy.get('[formControlName="isSharedBoard"]').click()
       }

src/app/analyzer/analyzer.component.html

@@ -12,6 +12,9 @@
     </mat-card-header>
     <mat-card-content>
         <form [formGroup]="form">
+            <mat-slide-toggle formControlName="isDone"  matTooltip="Available since Deck 1.12.0" matTooltipPosition="after">
+                Is your card <strong>marked as completed</strong>?
+            </mat-slide-toggle><br />
             <mat-slide-toggle formControlName="isSharedBoard">
                 Is your card on a <strong>shared board</strong>?
             </mat-slide-toggle><br />
@@ -47,7 +50,7 @@
         <mat-card-subtitle>Learn in which cases a card appears in the upcoming view</mat-card-subtitle>
     </mat-card-header>
     <mat-card-content>
-        <p>Starting with Deck 1.5 cards will appear in the upcoming view if one of the following two cases matches:</p>
+        <p>Starting with Deck 1.5 cards will appear in the upcoming view if they are <em>not marked as <code>completed</code></em> and additionally one of the following two cases matches:</p>
         <ul>
             <li>Card has a due date <strong>and</strong> card is in a not shared board</li>
             <li>Card is in a board which is also shared with others <strong>and</strong> one of the following two cases

src/app/analyzer/analyzer.component.scss

@@ -10,6 +10,7 @@
         margin: auto;
 
         grid-template-columns: repeat(2, 50%);
+
         mat-card:first-child {
             grid-column: 1 / span 2
         }
@@ -25,7 +26,8 @@ mat-card-actions {
 }
 
 mat-slide-toggle {
-    display: block;
+    display: inline-block;
+    padding: .5rem 0;
 }
 
 mat-icon {
@@ -36,6 +38,7 @@ mat-icon {
 
 mat-card.result {
     border-bottom: .3rem solid #E9322D;
+
     &.visible {
         border-color: #46BA61;
     }

src/app/analyzer/analyzer.component.ts

@@ -12,13 +12,15 @@ import { AnalyzerService, CardDescription, Hint } from './analyzer.service';
 export class AnalyzerComponent implements OnDestroy {
 
   form: UntypedFormGroup = new UntypedFormGroup({
+    isDone: new UntypedFormControl(),
     isSharedBoard: new UntypedFormControl(),
     hasDueDate: new UntypedFormControl(),
     youAssigned: new UntypedFormControl(),
     someoneElseAssigned: new UntypedFormControl()
   });
 
   private readonly unsubscribe$ = new Subject<void>();
+  private readonly isDoneCheckbox = this.form.get('isDone');
   private readonly isSharedBoardCheckbox = this.form.get('isSharedBoard');
   private readonly hasDueDateCheckbox = this.form.get('hasDueDate');
   private readonly youAssignedCheckbox = this.form.get('youAssigned');
@@ -47,6 +49,7 @@ export class AnalyzerComponent implements OnDestroy {
    */
   private getInitialCardDescription(): CardDescription {
     return {
+      isDone: !!this.isDoneCheckbox?.value,
       isSharedBoard: !!this.isSharedBoardCheckbox?.value,
       hasDueDate: !!this.hasDueDateCheckbox?.value,
       youAssigned: !!this.youAssignedCheckbox?.value,
@@ -59,12 +62,14 @@ export class AnalyzerComponent implements OnDestroy {
    */
   private getCardDescription(): Observable<CardDescription> {
     return merge(
+      this.isDoneCheckbox?.valueChanges || EMPTY,
       this.isSharedBoardCheckbox?.valueChanges || EMPTY,
       this.hasDueDateCheckbox?.valueChanges || EMPTY,
       this.youAssignedCheckbox?.valueChanges || EMPTY,
       this.someoneElseAssignedCheckbox?.valueChanges || EMPTY,
     ).pipe(map(() => {
       return {
+        isDone: this.isDoneCheckbox?.value,
         isSharedBoard: this.isSharedBoardCheckbox?.value,
         hasDueDate: this.hasDueDateCheckbox?.value,
         youAssigned: this.youAssignedCheckbox?.value,

src/app/analyzer/analyzer.service.ts

@@ -9,16 +9,30 @@ export class AnalyzerService {
   constructor() { }
 
   public isVisible(cardDescription: CardDescription): boolean {
-    return (cardDescription.hasDueDate && !cardDescription.isSharedBoard) ||
-      (cardDescription.isSharedBoard && (cardDescription.youAssigned || (cardDescription.hasDueDate && !cardDescription.someoneElseAssigned)))
+    return !cardDescription.isDone && (
+      (
+        cardDescription.hasDueDate &&
+        !cardDescription.isSharedBoard
+      ) ||
+      (
+        cardDescription.isSharedBoard && (
+          cardDescription.youAssigned || (
+            cardDescription.hasDueDate &&
+            !cardDescription.someoneElseAssigned
+          )
+        )
+      )
+    )
   }
 
   /**
    * Card has a due date AND card is in a not shared board OR
    * Card is in a board which is also shared with others AND (card is assigned to you OR (card has a due date AND nobody is assigned to the card))
    */
   public mapCardDescriptionToHint(cardDescription: CardDescription): Hint {
-    if (cardDescription.isSharedBoard && cardDescription.hasDueDate && cardDescription.youAssigned && cardDescription.someoneElseAssigned) {
+    if (cardDescription.isDone) {
+      return Hint.CARD_MUST_NOT_BE_DONE;
+    } else if (cardDescription.isSharedBoard && cardDescription.hasDueDate && cardDescription.youAssigned && cardDescription.someoneElseAssigned) {
       return Hint.CARD_SHOULD_BE_SHOWN;
     } else if (!cardDescription.isSharedBoard && cardDescription.hasDueDate && cardDescription.youAssigned && cardDescription.someoneElseAssigned) {
       return Hint.CARD_SHOULD_BE_SHOWN;
@@ -56,13 +70,15 @@ export class AnalyzerService {
 }
 
 export interface CardDescription {
+  isDone: boolean;
   isSharedBoard: boolean;
   hasDueDate: boolean;
   youAssigned: boolean;
   someoneElseAssigned: boolean;
 }
 
 export enum Hint {
+  CARD_MUST_NOT_BE_DONE = 'Mark your card as "not completed".',
   CARD_SHOULD_BE_SHOWN = 'Your card should be visible.',
   SET_DUE_DATE = 'Set a due date to the card.',
   ASSIGN_CARD_OR_SET_DUE_DATE = 'Assign the card to you or set a due date.',