feat(frontend): modernize Angular app

ui/src/app/interfaces/checkable.ts

@@ -0,0 +1,3 @@
+export interface Checkable {
+  checked: boolean;
+}

ui/src/app/interfaces/download.ts

@@ -0,0 +1,22 @@
+
+export interface Download {
+  id: string;
+  title: string;
+  url: string;
+  quality: string;
+  format: string;
+  folder: string;
+  custom_name_prefix: string;
+  playlist_strict_mode: boolean;
+  playlist_item_limit: number;
+  status: string;
+  msg: string;
+  percent: number;
+  speed: number;
+  eta: number;
+  filename: string;
+  checked: boolean;
+  size?: number;
+  error?: string;
+  deleting?: boolean;
+}

ui/src/app/interfaces/format.ts

@@ -0,0 +1,7 @@
+import { Quality } from "./quality";
+
+export interface Format {
+  id: string;
+  text: string;
+  qualities: Quality[];
+}

ui/src/app/interfaces/formats.ts

@@ -0,0 +1,76 @@
+import { Format } from "./format";
+
+
+export const Formats: Format[] = [
+  {
+    id: 'any',
+    text: 'Any',
+    qualities: [
+      { id: 'best', text: 'Best' },
+      { id: '2160', text: '2160p' },
+      { id: '1440', text: '1440p' },
+      { id: '1080', text: '1080p' },
+      { id: '720', text: '720p' },
+      { id: '480', text: '480p' },
+      { id: '360', text: '360p' },
+      { id: '240', text: '240p' },
+      { id: 'worst', text: 'Worst' },
+      { id: 'audio', text: 'Audio Only' },
+    ],
+  },
+  {
+    id: 'mp4',
+    text: 'MP4',
+    qualities: [
+      { id: 'best', text: 'Best' },
+      { id: 'best_ios', text: 'Best (iOS)' },
+      { id: '2160', text: '2160p' },
+      { id: '1440', text: '1440p' },
+      { id: '1080', text: '1080p' },
+      { id: '720', text: '720p' },
+      { id: '480', text: '480p' },
+      { id: '360', text: '360p' },
+      { id: '240', text: '240p' },
+      { id: 'worst', text: 'Worst' },
+    ],
+  },
+  {
+    id: 'm4a',
+    text: 'M4A',
+    qualities: [
+      { id: 'best', text: 'Best' },
+      { id: '192', text: '192 kbps' },
+      { id: '128', text: '128 kbps' },
+    ],
+  },
+  {
+    id: 'mp3',
+    text: 'MP3',
+    qualities: [
+      { id: 'best', text: 'Best' },
+      { id: '320', text: '320 kbps' },
+      { id: '192', text: '192 kbps' },
+      { id: '128', text: '128 kbps' },
+    ],
+  },
+  {
+    id: 'opus',
+    text: 'OPUS',
+    qualities: [{ id: 'best', text: 'Best' }],
+  },
+  {
+    id: 'wav',
+    text: 'WAV',
+    qualities: [{ id: 'best', text: 'Best' }],
+  },
+  {
+    id: 'flac',
+    text: 'FLAC',
+    qualities: [{ id: 'best', text: 'Best' }],
+  },
+  {
+    id: 'thumbnail',
+    text: 'Thumbnail',
+    qualities: [{ id: 'best', text: 'Best' }],
+  },
+];

ui/src/app/interfaces/index.ts

@@ -0,0 +1,9 @@
+export * from './theme';
+export * from './status';
+export * from './quality';
+export * from './state';    
+export * from './download'; 
+export * from './checkable';
+export * from './format';
+export * from './formats';
+

ui/src/app/interfaces/quality.ts

@@ -0,0 +1,5 @@
+
+export interface Quality {
+  id: string;
+  text: string;
+}

ui/src/app/interfaces/state.ts

@@ -0,0 +1 @@
+export type State =  'queue' | 'done';

ui/src/app/interfaces/status.ts

@@ -0,0 +1,4 @@
+export interface Status {
+  status: string;
+  msg?: string;
+}

ui/src/app/interfaces/theme.ts

@@ -0,0 +1,7 @@
+import { IconDefinition } from "@fortawesome/fontawesome-svg-core";
+
+export interface Theme {
+  id: string;
+  displayName: string;
+  icon: IconDefinition;
+}