HLS.js wrapper package (#16)

* Added hlsjs wrapper package * Added Basic UI * Visibility effect on controls * Seekbar delta calculation in order not to jump back to previously seeked offset for a brief amount of time
superstreamerapp · Sep 5, 2024 · e2aea7d · e2aea7d
1 parent 62eed4d
commit e2aea7d
Show file tree

Hide file tree

Showing 49 changed files with 39,579 additions and 91 deletions.
diff --git a/packages/dashboard/src/components/OpenApiReference.tsx b/packages/dashboard/src/components/OpenApiReference.tsx
@@ -1,7 +1,7 @@
 import { ApiReferenceReact } from "@scalar/api-reference-react";
 import { tsr } from "@/tsr";
-import "@scalar/api-reference-react/style.css";
 import { useEffect } from "react";
+import "@scalar/api-reference-react/style.css";
 
 type OpenApiReferenceProps = {
   url: string;

diff --git a/packages/dashboard/src/hooks/useJob.ts b/packages/dashboard/src/hooks/useJob.ts
@@ -1,28 +1,23 @@
 import { tsr } from "@/tsr";
-import { useEffect, useRef } from "react";
 import type { JobDto } from "@/tsr";
 
 export function useJob(id: string) {
-  const lastResultRef = useRef<JobDto>();
-
   const { data } = tsr.getJob.useQuery({
     queryKey: ["jobsFromRoot", id],
     queryData: { params: { id }, query: { fromRoot: true } },
     refetchInterval: 2000,
   });
 
-  useEffect(() => {
-    if (data) {
-      lastResultRef.current = data.body;
-    }
-  }, [data]);
+  const rootJob = data?.body;
 
-  const rootJob = data?.body ?? lastResultRef.current;
   if (!rootJob) {
     return null;
   }
 
   const job = findJob(rootJob, id);
+  if (!job) {
+    throw new Error("Job not found in tree");
+  }
 
   return { job, rootJob };
 }

diff --git a/packages/dashboard/src/pages/JobPage.tsx b/packages/dashboard/src/pages/JobPage.tsx
@@ -17,7 +17,7 @@ export function JobPage() {
   const { job, rootJob } = result;
 
   return (
-    <div className="min-h-full flex flex-col grow bg-white">
+    <div className="min-h-full flex flex-col grow">
       <div className="p-2 border-b border-border">
         <Button asChild variant="ghost">
           <Link to="/jobs">Jobs</Link>

diff --git a/packages/dashboard/src/pages/JobsPage.tsx b/packages/dashboard/src/pages/JobsPage.tsx
@@ -23,21 +23,19 @@ export function JobsPage() {
   const filteredJobs = filterJobs(data.body, filter);
 
   return (
-    <div className="min-h-full bg-[#fafafa]">
-      <Container className="py-4 min-h-full">
-        <h1 className="text-lg font-medium">Jobs</h1>
-        <div className="my-4 flex items-center">
-          <JobsStats jobs={filteredJobs} />
-          <div className="ml-auto">
-            <JobsFilter
-              allJobs={data.body}
-              filter={filter}
-              onChange={setFilter}
-            />
-          </div>
+    <Container className="py-4">
+      <h1 className="text-lg font-medium">Jobs</h1>
+      <div className="my-4 flex items-center">
+        <JobsStats jobs={filteredJobs} />
+        <div className="ml-auto">
+          <JobsFilter
+            allJobs={data.body}
+            filter={filter}
+            onChange={setFilter}
+          />
         </div>
-        <JobsList jobs={filteredJobs} />
-      </Container>
-    </div>
+      </div>
+      <JobsList jobs={filteredJobs} />
+    </Container>
   );
 }
diff --git a/packages/hlsjs/.gitignore b/packages/hlsjs/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/packages/hlsjs/README.md b/packages/hlsjs/README.md
@@ -0,0 +1,9 @@
+# hls.js wrapper
+
+Using https://www.svgrepo.com/collection/solar-broken-line-icons for icons.
+
+## Bugs
+
+- When we have a preroll interstitial and we select the subtitle, it will only respect the first selected subtitle. Changing subtitle afterwards has no effect.
+
+- When interstitials startTime is beyond the end of the content duration, there are stalls sometimes and content stops buffering. This can be replicated manually when setting interstitials further away.