Minor CSS changes

src/app/actions/action-list/action-list.component.scss

@@ -6,9 +6,9 @@ main {
   grid-gap: 1rem;
   justify-content: center;
   text-align: center;
+  justify-self: center;
   background-color: #fafafa;
   width: 80%;
-  justify-self: center;
 
   & .container {
     border-color: grey;

src/app/actions/actions/actions.component.scss

@@ -4,6 +4,16 @@ body, h3 {
   margin: 0;
 }
 
+body {
+  height: 100vh;
+  overflow: auto;
+  margin-top: 3em;
+}
+
+h3 {
+  margin-bottom: 2em;
+}
+
 section {
   display: flex;
   justify-content: space-between;

src/app/redemptions/redemption-item-edit/redemption-item-edit.component.ts

@@ -100,6 +100,9 @@ export class RedemptionItemEditComponent implements OnInit {
   }
 
   save() {
+    if (this.formGroups.invalid)
+      return;
+
     this.responseError = undefined;
     const order = this.orderFormControl.value;
     if (order == null) {

src/app/shared/services/twitch-redemption.service.ts

@@ -3,14 +3,24 @@ import { inject, Injectable } from '@angular/core';
 import { environment } from '../../../environments/environment';
 import TwitchRedemption from '../models/twitch-redemption';
 import { of } from 'rxjs';
+import EventService from './EventService';
 
 @Injectable({
   providedIn: 'root'
 })
 export class TwitchRedemptionService {
-  private http = inject(HttpClient);
+  private readonly http = inject(HttpClient);
+  private readonly events = inject(EventService);
   private twitchRedemptions: TwitchRedemption[] = [];
-  private loaded = false
+  private loaded = false;
+
+
+  constructor() {
+    this.events.listen('logoff', () => {
+      this.twitchRedemptions = [];
+      this.loaded = false;
+    });
+  }
 
   fetch(force: boolean = false) {
     if (!force && this.loaded)