Initial framework for new UI with React/Typescript (#8885)

* Write a low resolution low fps stream from decoded frames (#8673)

* Generate low res low fps previews for recordings viewer

* Make sure previews end on the hour

* Fix durations and decrase keyframe interval to ensure smooth scrubbing

* Ensure minimized resolution is compatible with yuv

* Add ability to configure preview quality

* Fix

* Clean up previews more efficiently

* Use iterator

* Ensure final frame in preview is not duplicated

* initial react/ts framework

* fix gitignore glob excluding ts files

* ignore folders in web-new

* SWRConfig changes for swr 2.x

* use frigateConfig type in websocket handlers

---------

Co-authored-by: Nicolas Mowen <nickmowen213@gmail.com>

web-new/themes/theme-nord.css

@@ -0,0 +1,61 @@
+.theme-nord.light {
+  --background: 220, 16%, 96%;
+  --foreground: 222, 20%, 16%;
+
+  --muted: 215, 14%, 80%;
+  --muted-foreground: 222, 20%, 16%;
+
+  --popover: 220, 16%, 96%;
+  --popover-foreground: 222, 20%, 16%;
+
+  --border: 222, 20%, 70%;
+  --input: 222, 20%, 70%;
+
+  --card: 220, 16%, 96%;
+  --card-foreground: 222, 20%, 16%;
+
+  --primary: 222, 20%, 70%;
+  --primary-foreground: 220, 16%, 96%;
+
+  --secondary: 215, 14%, 80%;
+  --secondary-foreground: 222, 20%, 16%;
+
+  --accent: 215, 14%, 80%;
+  --accent-foreground: 222, 20%, 16%;
+
+  --destructive: 0, 80%, 50%;
+  --destructive-foreground: 222, 20%, 16%;
+
+  --ring: 222, 20%, 70%;
+}
+
+.theme-nord.dark {
+  --background: 220, 16%, 16%;
+  --foreground: 222, 20%, 96%;
+
+  --muted: 215, 14%, 25%;
+  --muted-foreground: 222, 20%, 96%;
+
+  --popover: 220, 16%, 16%;
+  --popover-foreground: 222, 20%, 96%;
+
+  --border: 222, 20%, 40%;
+  --input: 222, 20%, 40%;
+
+  --card: 220, 16%, 16%;
+  --card-foreground: 222, 20%, 96%;
+
+  --primary: 222, 20%, 65%;
+  --primary-foreground: 220, 16%, 16%;
+
+  --secondary: 215, 14%, 25%;
+  --secondary-foreground: 222, 20%, 96%;
+
+  --accent: 215, 14%, 25%;
+  --accent-foreground: 222, 20%, 96%;
+
+  --destructive: 0, 80%, 50%;
+  --destructive-foreground: 222, 20%, 96%;
+
+  --ring: 222, 20%, 40%;
+}