Feat: Add rebuttals

src/app/app-routing.module.ts

@@ -47,6 +47,10 @@ const routes: Routes = [
     path: 'solicitations',
     loadChildren: () => import('./solicitations/solicitations.module').then(m => m.SolicitationsModule),
   },
+  {
+    path: 'rebuttals',
+    loadChildren: () => import('./rebuttals/rebuttals.module').then(m => m.RebuttalsModule),
+  },
 ];
 
 @NgModule({

src/app/instances/pages/instance-detail/instance-detail.component.html

@@ -179,6 +179,7 @@ <h3 class="card-title" id="censures-received">Censures received ({{censuresRecei
               <th>Instance</th>
               <th>Reasons</th>
               <th>Evidence</th>
+              <th>{{'app.rebuttal' | transloco}}</th>
             </tr>
             </thead>
             <tbody>
@@ -196,6 +197,27 @@ <h3 class="card-title" id="censures-received">Censures received ({{censuresRecei
                 <code *ngIf="!instance.censuresEvidence">N/A</code>
                 <ng-container *ngIf="instance.censuresEvidence">{{instance.censuresEvidence}}</ng-container>
               </td>
+              <td>
+                <ng-container *ngIf="!instance.rebuttal">
+                  <ng-container *ngIf="myInstance">
+                    <a class="btn btn-primary" routerLink="/rebuttals/create/{{instance.domain}}">{{'app.rebuttal.create' | transloco}}</a>
+                  </ng-container>
+                  <ng-container *ngIf="!myInstance">
+                    <code>
+                      {{'app.not_applicable' | transloco}}
+                    </code>
+                  </ng-container>
+                </ng-container>
+                <ng-container *ngIf="instance.rebuttal">
+                  {{instance.rebuttal}}
+                  <hr>
+                  <ng-container *ngIf="myInstance">
+                    <br>
+                    <a class="btn btn-primary" routerLink="/rebuttals/edit/{{instance.domain}}">{{'app.rebuttal.edit' | transloco}}</a>&nbsp;
+                    <button class="btn btn-danger" (click)="removeRebuttal(instance.domain)">{{'app.rebuttal.remove' | transloco}}</button>
+                  </ng-container>
+                </ng-container>
+              </td>
             </tr>
             </tbody>
           </table>
@@ -323,6 +345,7 @@ <h3 class="card-title" id="hesitations-received">Hesitations received ({{hesitat
               <th>Instance</th>
               <th>Reasons</th>
               <th>Evidence</th>
+              <th>{{'app.rebuttal' | transloco}}</th>
             </tr>
             </thead>
             <tbody>
@@ -340,6 +363,27 @@ <h3 class="card-title" id="hesitations-received">Hesitations received ({{hesitat
                 <code *ngIf="!instance.hesitationsEvidence">N/A</code>
                 <ng-container *ngIf="instance.hesitationsEvidence">{{instance.hesitationsEvidence}}</ng-container>
               </td>
+              <td>
+                <ng-container *ngIf="!instance.rebuttal">
+                  <ng-container *ngIf="myInstance">
+                    <a class="btn btn-primary" routerLink="/rebuttals/create/{{instance.domain}}">{{'app.rebuttal.create' | transloco}}</a>
+                  </ng-container>
+                  <ng-container *ngIf="!myInstance">
+                    <code>
+                      {{'app.not_applicable' | transloco}}
+                    </code>
+                  </ng-container>
+                </ng-container>
+                <ng-container *ngIf="instance.rebuttal">
+                  {{instance.rebuttal}}
+                  <hr>
+                  <ng-container *ngIf="myInstance">
+                    <br>
+                    <a class="btn btn-primary" routerLink="/rebuttals/edit/{{instance.domain}}">{{'app.rebuttal.edit' | transloco}}</a>&nbsp;
+                    <button class="btn btn-danger" (click)="removeRebuttal(instance.domain)">{{'app.rebuttal.remove' | transloco}}</button>
+                  </ng-container>
+                </ng-container>
+              </td>
             </tr>
             </tbody>
           </table>

src/app/instances/pages/instance-detail/instance-detail.component.ts

@@ -123,4 +123,43 @@ export class InstanceDetailComponent implements OnInit {
   public async onInstanceMoved(event: InstanceMoveEvent) {
 
   }
+
+  public async removeRebuttal(sourceInstance: string) {
+    this.loading = true;
+
+    await toPromise(this.api.removeRebuttal(sourceInstance));
+    const responses = await Promise.all([
+      toPromise(this.cachedApi.getHesitationsForInstance(this.authManager.currentInstanceSnapshot.name, {clear: true})),
+      toPromise(this.cachedApi.getCensuresForInstance(this.authManager.currentInstanceSnapshot.name, {clear: true})),
+    ]);
+    this.cachedApi.clearHesitationsByInstanceCache(sourceInstance);
+    this.cachedApi.clearCensuresByInstanceCache(sourceInstance);
+
+    if (this.apiResponseHelper.handleErrors(responses)) {
+      this.loading = false;
+      return;
+    }
+
+    this.censuresReceived = responses[1].successResponse!.instances.map(
+      instance => {
+        const result = NormalizedInstanceDetailResponse.fromInstanceDetail(instance);
+        if (result.domain === sourceInstance) {
+          result.rebuttal = null;
+        }
+
+        return result;
+      },
+    );
+    this.hesitationsReceived = responses[0].successResponse!.instances.map(
+      instance => {
+        const result = NormalizedInstanceDetailResponse.fromInstanceDetail(instance);
+        if (result.domain === sourceInstance) {
+          result.rebuttal = null;
+        }
+
+        return result;
+      },
+    );
+    this.loading = false;
+  }
 }

src/app/rebuttals/pages/create-edit-rebuttal/create-edit-rebuttal.component.html

@@ -0,0 +1,69 @@
+<app-loader *ngIf="loading else content"></app-loader>
+
+<ng-template #content>
+  <div class="col-md-12">
+    <div class="card" *ngIf="censure">
+      <div class="card-header">
+        <h3 class="card-title">
+          <transloco key="app.rebuttal.censure_by" [params]="{instance: sourceInstance}" />
+        </h3>
+      </div>
+      <div class="card-body">
+        <p *ngIf="censure.reasons.length">
+          <transloco key="app.rebuttal.censures_by.reasons" [params]="{instance: sourceInstance}" />
+        </p>
+        <ul *ngIf="censure.reasons.length">
+          <li *ngFor="let reason of censure.reasons">
+            {{reason}}
+          </li>
+        </ul>
+        <p *ngIf="censure.evidence">
+          <transloco key="app.rebuttal.censures_by.evidence" [params]="{instance: sourceInstance}" />
+        </p>
+        <ul *ngIf="censure.evidence">
+          <li>
+            {{censure.evidence}}
+          </li>
+        </ul>
+      </div>
+    </div>
+    <div class="card" *ngIf="hesitation">
+      <div class="card-header">
+        <h3 class="card-title">
+          <transloco key="app.rebuttal.hesitation_by" [params]="{instance: sourceInstance}" />
+        </h3>
+      </div>
+      <div class="card-body">
+        <p *ngIf="hesitation.reasons.length">
+          <transloco key="app.rebuttal.hesitations_by.reasons" [params]="{instance: sourceInstance}" />
+        </p>
+        <ul *ngIf="hesitation.reasons.length">
+          <li *ngFor="let reason of hesitation.reasons">
+            {{reason}}
+          </li>
+        </ul>
+        <p *ngIf="hesitation.evidence">
+          <transloco key="app.rebuttal.hesitations_by.evidence" [params]="{instance: sourceInstance}" />
+        </p>
+        <ul *ngIf="hesitation.evidence">
+          <li>
+            {{hesitation.evidence}}
+          </li>
+        </ul>
+      </div>
+    </div>
+    <div class="card">
+      <div class="card-header">
+          <h3 class="card-title">{{"app.rebuttal.your_rebuttal" | transloco}}</h3>
+      </div>
+      <div class="card-body">
+        <form [formGroup]="form" (submit)="onSubmit()">
+          <div class="form-group">
+            <textarea class="form-control" formControlName="rebuttal" placeholder="{{'app.rebuttal.no_rebuttal_yet' | transloco}}"></textarea>
+          </div>
+          <button class="btn btn-primary" type="submit">{{'app.button.save' | transloco}}</button>
+        </form>
+      </div>
+    </div>
+  </div>
+</ng-template>

src/app/rebuttals/pages/create-edit-rebuttal/create-edit-rebuttal.component.scss

@@ -0,0 +1,3 @@
+:host {
+  min-width: 100%;
+}

src/app/rebuttals/pages/create-edit-rebuttal/create-edit-rebuttal.component.ts

@@ -0,0 +1,146 @@
+import {Component, OnInit} from '@angular/core';
+import {TitleService} from "../../../services/title.service";
+import {TranslatorService} from "../../../services/translator.service";
+import {CachedFediseerApiService} from "../../../services/cached-fediseer-api.service";
+import {ActivatedRoute, Router} from "@angular/router";
+import {Resolvable, toPromise} from "../../../types/resolvable";
+import {ApiResponseHelperService} from "../../../services/api-response-helper.service";
+import {AuthenticationManagerService} from "../../../services/authentication-manager.service";
+import {NormalizedInstanceDetailResponse} from "../../../response/normalized-instance-detail.response";
+import {MessageService} from "../../../services/message.service";
+import {FormControl, FormGroup} from "@angular/forms";
+import {ApiResponse, FediseerApiService} from "../../../services/fediseer-api.service";
+import {SuccessResponse} from "../../../response/success.response";
+
+interface Reason {
+  reasons: string[];
+  evidence: string;
+}
+
+@Component({
+  selector: 'app-create-rebuttal',
+  templateUrl: './create-edit-rebuttal.component.html',
+  styleUrls: ['./create-edit-rebuttal.component.scss']
+})
+export class CreateEditRebuttalComponent implements OnInit {
+  public hesitation: Reason | null = null;
+  public censure: Reason | null = null;
+  public sourceInstance: string | null = null;
+
+  public form = new FormGroup({
+    rebuttal: new FormControl<string>(''),
+  });
+
+  public loading: boolean = true;
+  public isNew: boolean = false;
+
+  constructor(
+    private readonly titleService: TitleService,
+    private readonly translator: TranslatorService,
+    private readonly cachedApi: CachedFediseerApiService,
+    private readonly api: FediseerApiService,
+    private readonly activatedRoute: ActivatedRoute,
+    private readonly apiResponseHelper: ApiResponseHelperService,
+    private readonly authManager: AuthenticationManagerService,
+    private readonly messageService: MessageService,
+    private readonly router: Router,
+  ) {
+  }
+
+  public async ngOnInit(): Promise<void> {
+    this.activatedRoute.params.subscribe(async params => {
+      this.loading = true;
+      this.sourceInstance = params['sourceInstance'];
+
+      this.titleService.title = this.translator.get('app.rebuttal.title', {
+        instanceName: this.sourceInstance,
+      });
+
+      const responses = await Promise.all([
+        toPromise(this.cachedApi.getHesitationsForInstance(this.authManager.currentInstanceSnapshot.name)),
+        toPromise(this.cachedApi.getCensuresForInstance(this.authManager.currentInstanceSnapshot.name)),
+      ]);
+      if (this.apiResponseHelper.handleErrors(responses)) {
+        this.loading = false;
+        return;
+      }
+
+      const hesitations = responses[0].successResponse!.instances.filter(
+        instance => instance.domain === this.sourceInstance!,
+      ).map(instance => NormalizedInstanceDetailResponse.fromInstanceDetail(instance));
+      const censures = responses[1].successResponse!.instances.filter(
+        instance => instance.domain === this.sourceInstance!,
+      ).map(instance => NormalizedInstanceDetailResponse.fromInstanceDetail(instance));
+
+      let rebuttal: string | null = null;
+      if (hesitations.length && (hesitations[0].hesitationsEvidence || hesitations[0].hesitationReasons.length)) {
+        this.hesitation = {
+          evidence: hesitations[0].hesitationsEvidence,
+          reasons: hesitations[0].hesitationReasons,
+        };
+        if (hesitations[0].rebuttal !== null) {
+          rebuttal = hesitations[0].rebuttal;
+        }
+      }
+      if (censures.length && (censures[0].censuresEvidence || censures[0].censureReasons.length)) {
+        this.censure = {
+          evidence: censures[0].censuresEvidence,
+          reasons: censures[0].censureReasons,
+        };
+        if (censures[0].rebuttal !== null) {
+          rebuttal = censures[0].rebuttal;
+        }
+      }
+
+      this.isNew = rebuttal === null;
+
+      if (this.hesitation === null && this.censure === null) {
+        this.loading = false;
+        this.messageService.createError(this.translator.get('app.error.rebuttal.no_censure_hesitation'));
+        return;
+      }
+
+      this.form.patchValue({rebuttal: rebuttal ?? ''});
+
+      this.loading = false;
+    });
+  }
+
+  public async onSubmit() {
+    this.loading = true;
+    const rebuttal = this.form.controls.rebuttal.value ?? '';
+    if (this.isNew && !rebuttal) {
+      this.messageService.createWarning(this.translator.get('app.warning.empty_rebuttal'));
+      this.loading = false;
+      return;
+    }
+
+    let message: Resolvable<string>;
+    let response: ApiResponse<SuccessResponse>;
+    if (!rebuttal) {
+      response = await toPromise(this.api.removeRebuttal(this.sourceInstance!));
+      message = this.translator.get('app.rebuttal.deleted');
+    } else if (this.isNew) {
+      response = await toPromise(this.api.createRebuttal(this.sourceInstance!, rebuttal));
+      message = this.translator.get('app.rebuttal.created');
+    } else {
+      response = await toPromise(this.api.updateRebuttal(this.sourceInstance!, rebuttal));
+      message = this.translator.get('app.rebuttal.updated');
+    }
+    if (this.apiResponseHelper.handleErrors([response])) {
+      this.loading = false;
+      return;
+    }
+
+    await Promise.all([
+      toPromise(this.cachedApi.getHesitationsForInstance(this.authManager.currentInstanceSnapshot.name, {clear: true})),
+      toPromise(this.cachedApi.getCensuresForInstance(this.authManager.currentInstanceSnapshot.name, {clear: true})),
+    ]);
+    this.cachedApi.clearCensuresByInstanceCache(this.sourceInstance!);
+    this.cachedApi.clearHesitationsByInstanceCache(this.sourceInstance!);
+
+    this.router.navigateByUrl(`/instances/detail/${this.authManager.currentInstanceSnapshot.name}`).then(() => {
+      this.messageService.createSuccess(message);
+    });
+  }
+}

src/app/rebuttals/rebuttals.module.ts

@@ -0,0 +1,33 @@
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {RouterModule, Routes} from "@angular/router";
+import {SharedModule} from "../shared/shared.module";
+import {ReactiveFormsModule} from "@angular/forms";
+import {CreateEditRebuttalComponent} from './pages/create-edit-rebuttal/create-edit-rebuttal.component';
+import {Guards} from "../guards/guards";
+
+const routes: Routes = [
+  {
+    path: 'create/:sourceInstance',
+    component: CreateEditRebuttalComponent,
+    canActivate: [Guards.isLoggedIn()],
+  },
+  {
+    path: 'edit/:sourceInstance',
+    component: CreateEditRebuttalComponent,
+    canActivate: [Guards.isLoggedIn()],
+  }
+];
+
+@NgModule({
+  declarations: [
+    CreateEditRebuttalComponent
+  ],
+  imports: [
+    CommonModule,
+    RouterModule.forChild(routes),
+    SharedModule,
+    ReactiveFormsModule,
+  ]
+})
+export class RebuttalsModule { }

src/app/response/instance-detail.response.ts

@@ -16,6 +16,7 @@ export interface InstanceDetailResponse {
   endorsements: int;
   guarantor?: string | null;
   censure_reasons?: string[] | null;
+  rebuttal: string[] | null;
   sysadmins: int | null;
   moderators: int | null;
   censure_evidence?: string[];