From a562cbeb255790e417bbf72c6848da8311a5c748 Mon Sep 17 00:00:00 2001
From: Astrid <github@astrid.exposed>
Date: Wed, 31 Jan 2024 22:22:07 +0100
Subject: [PATCH 1/8] Proper onClick types and give <a> the callback

---
 src/components/buttons/Button.tsx | 23 +++++++++++++++++------
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/buttons/Button.tsx b/src/components/buttons/Button.tsx
index 70e2c780..1c1a2b61 100644
--- a/src/components/buttons/Button.tsx
+++ b/src/components/buttons/Button.tsx
@@ -7,7 +7,9 @@ import { Spinner } from "@/components/layout/Spinner";
 
 interface Props {
   icon?: Icons;
-  onClick?: () => void;
+  onClick?: (
+    event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>,
+  ) => void;
   children?: ReactNode;
   theme?: "white" | "purple" | "secondary" | "danger";
   padding?: string;
@@ -21,11 +23,19 @@ interface Props {
 export function Button(props: Props) {
   const navigate = useNavigate();
   const { onClick, href, loading } = props;
-  const cb = useCallback(() => {
-    if (loading) return;
-    if (href) navigate(href);
-    else onClick?.();
-  }, [onClick, href, navigate, loading]);
+  const cb = useCallback(
+    (
+      event: React.MouseEvent<
+        HTMLAnchorElement | HTMLButtonElement,
+        MouseEvent
+      >,
+    ) => {
+      if (loading) return;
+      if (href && !onClick) navigate(href);
+      else onClick?.(event);
+    },
+    [onClick, href, navigate, loading],
+  );
 
   let colorClasses = "bg-white hover:bg-gray-200 text-black";
   if (props.theme === "purple")
@@ -80,6 +90,7 @@ export function Button(props: Props) {
         target="_blank"
         rel="noreferrer"
         download={props.download}
+        onClick={cb}
       >
         {content}
       </a>

From 71ddbca657374a46c42def879e8ae79c19fb56b5 Mon Sep 17 00:00:00 2001
From: Astrid <github@astrid.exposed>
Date: Wed, 31 Jan 2024 22:22:26 +0100
Subject: [PATCH 2/8] Copy playlist link instead of download playlist

---
 src/components/player/atoms/settings/Downloads.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/player/atoms/settings/Downloads.tsx b/src/components/player/atoms/settings/Downloads.tsx
index 45c97997..5eb7d798 100644
--- a/src/components/player/atoms/settings/Downloads.tsx
+++ b/src/components/player/atoms/settings/Downloads.tsx
@@ -69,7 +69,17 @@ export function DownloadView({ id }: { id: string }) {
                 <StyleTrans k="player.menus.downloads.hlsDisclaimer" />
               </Menu.Paragraph>
 
-              <Button className="w-full" href={downloadUrl} theme="purple">
+              <Button
+                className="w-full"
+                theme="purple"
+                href={downloadUrl}
+                onClick={(event) => {
+                  // Allow context menu & left click to copy
+                  event.preventDefault();
+
+                  navigator.clipboard.writeText(downloadUrl);
+                }}
+              >
                 {t("player.menus.downloads.downloadPlaylist")}
               </Button>
               <Button

From cd9cf31066dba3e93725d359dd4af8524abe2149 Mon Sep 17 00:00:00 2001
From: Astrid <github@astrid.exposed>
Date: Wed, 31 Jan 2024 22:22:46 +0100
Subject: [PATCH 3/8] Modify english locale for 'copy playlist link'

---
 src/assets/locales/en.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json
index 4d96b752..62176bff 100644
--- a/src/assets/locales/en.json
+++ b/src/assets/locales/en.json
@@ -243,7 +243,7 @@
     "menus": {
       "downloads": {
         "disclaimer": "Downloads are taken directly from the provider. movie-web does not have control over how the downloads are provided.",
-        "downloadPlaylist": "Download playlist",
+        "downloadPlaylist": "Copy playlist link",
         "downloadSubtitle": "Download current subtitle",
         "downloadVideo": "Download video",
         "hlsDisclaimer": "Downloads are taken directly from the provider. movie-web does not have control over how the downloads are provided.<br /><br />Please note that you are downloading an HLS playlist, <bold>it is not recommended to download if you are not familiar with advanced streaming formats</bold>. Try different sources for different formats.",

From 0ba699d66ecad0e70be3b06a3d531d30466b94a3 Mon Sep 17 00:00:00 2001
From: Astrid <github@astrid.exposed>
Date: Wed, 31 Jan 2024 22:58:38 +0100
Subject: [PATCH 4/8] useCopyToClipboard

---
 src/components/player/atoms/settings/Downloads.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/player/atoms/settings/Downloads.tsx b/src/components/player/atoms/settings/Downloads.tsx
index 5eb7d798..4ab7a232 100644
--- a/src/components/player/atoms/settings/Downloads.tsx
+++ b/src/components/player/atoms/settings/Downloads.tsx
@@ -1,5 +1,6 @@
 import { useCallback, useMemo } from "react";
 import { Trans, useTranslation } from "react-i18next";
+import { useCopyToClipboard } from "react-use";
 
 import { Button } from "@/components/buttons/Button";
 import { Icon, Icons } from "@/components/Icon";
@@ -43,6 +44,7 @@ export function DownloadView({ id }: { id: string }) {
   const router = useOverlayRouter(id);
   const { t } = useTranslation();
   const downloadUrl = useDownloadLink();
+  const [, copyToClipboard] = useCopyToClipboard();
 
   const sourceType = usePlayerStore((s) => s.source?.type);
   const selectedCaption = usePlayerStore((s) => s.caption?.selected);
@@ -77,7 +79,7 @@ export function DownloadView({ id }: { id: string }) {
                   // Allow context menu & left click to copy
                   event.preventDefault();
 
-                  navigator.clipboard.writeText(downloadUrl);
+                  copyToClipboard(downloadUrl);
                 }}
               >
                 {t("player.menus.downloads.downloadPlaylist")}

From aba12370f3226e046041022da628f15d72ca0239 Mon Sep 17 00:00:00 2001
From: Boidushya Bhattacharya <boidushyabhattacharya@gmail.com>
Date: Sun, 4 Feb 2024 01:19:01 +0530
Subject: [PATCH 5/8] fix(settings/appearance): improved 'Active' pill

---
 src/pages/parts/settings/ThemePart.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/parts/settings/ThemePart.tsx b/src/pages/parts/settings/ThemePart.tsx
index 50a22b1c..b6b07209 100644
--- a/src/pages/parts/settings/ThemePart.tsx
+++ b/src/pages/parts/settings/ThemePart.tsx
@@ -104,7 +104,7 @@ function ThemePreview(props: {
         <span className="font-medium text-white">{props.name}</span>
         <span
           className={classNames(
-            "inline-block px-3 text-sm transition-opacity duration-150 rounded-full bg-[#27182F] text-white",
+            "inline-block px-3 py-1 leading-tight text-sm transition-opacity duration-150 rounded-full bg-pill-background text-white/85 shadow-[rgba(255,255,255,0.15)_0_1px_0_inset,rgba(46,54,80,0.075)_0_1px_1px]",
             props.active ? "opacity-100" : "opacity-0 pointer-events-none",
           )}
         >

From 4b26ca1bed7c8bd81f546b33f7a8021e8feab082 Mon Sep 17 00:00:00 2001
From: Astrid <github@astrid.exposed>
Date: Sat, 3 Feb 2024 22:03:46 +0100
Subject: [PATCH 6/8] Rename 'downloadPlaylist' to 'copyHlsPlaylist'

---
 src/assets/locales/en.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json
index 62176bff..c46a2527 100644
--- a/src/assets/locales/en.json
+++ b/src/assets/locales/en.json
@@ -243,7 +243,7 @@
     "menus": {
       "downloads": {
         "disclaimer": "Downloads are taken directly from the provider. movie-web does not have control over how the downloads are provided.",
-        "downloadPlaylist": "Copy playlist link",
+        "copyHlsPlaylist": "Copy playlist link",
         "downloadSubtitle": "Download current subtitle",
         "downloadVideo": "Download video",
         "hlsDisclaimer": "Downloads are taken directly from the provider. movie-web does not have control over how the downloads are provided.<br /><br />Please note that you are downloading an HLS playlist, <bold>it is not recommended to download if you are not familiar with advanced streaming formats</bold>. Try different sources for different formats.",

From d4ba87f95e1672cd612295d00d03cf56480611ff Mon Sep 17 00:00:00 2001
From: Boidushya Bhattacharya <boidushyabhattacharya@gmail.com>
Date: Sun, 4 Feb 2024 02:52:24 +0530
Subject: [PATCH 7/8] fix(settings/appearance): Removed inset-shadow & created
 new theme variable

---
 src/pages/parts/settings/ThemePart.tsx | 2 +-
 themes/default.ts                      | 2 ++
 themes/list/blue.ts                    | 4 +++-
 themes/list/gray.ts                    | 4 +++-
 themes/list/red.ts                     | 4 +++-
 themes/list/teal.ts                    | 4 +++-
 6 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/pages/parts/settings/ThemePart.tsx b/src/pages/parts/settings/ThemePart.tsx
index b6b07209..264c5b40 100644
--- a/src/pages/parts/settings/ThemePart.tsx
+++ b/src/pages/parts/settings/ThemePart.tsx
@@ -104,7 +104,7 @@ function ThemePreview(props: {
         <span className="font-medium text-white">{props.name}</span>
         <span
           className={classNames(
-            "inline-block px-3 py-1 leading-tight text-sm transition-opacity duration-150 rounded-full bg-pill-background text-white/85 shadow-[rgba(255,255,255,0.15)_0_1px_0_inset,rgba(46,54,80,0.075)_0_1px_1px]",
+            "inline-block px-3 py-1 leading-tight text-sm transition-opacity duration-150 rounded-full bg-pill-activeBackground text-white/85",
             props.active ? "opacity-100" : "opacity-0 pointer-events-none",
           )}
         >
diff --git a/themes/default.ts b/themes/default.ts
index c4495a0e..c7d32617 100644
--- a/themes/default.ts
+++ b/themes/default.ts
@@ -97,6 +97,8 @@ export const defaultTheme = {
         background: tokens.shade.c300,
         backgroundHover: tokens.shade.c200,
         highlight: tokens.blue.c200,
+
+        activeBackground: tokens.shade.c300,
       },
       
       // meta data for the theme itself
diff --git a/themes/list/blue.ts b/themes/list/blue.ts
index 2cb43766..4266b3c3 100644
--- a/themes/list/blue.ts
+++ b/themes/list/blue.ts
@@ -63,7 +63,9 @@ export default createTheme({
       pill: {
         background: tokens.shade.c300,
         backgroundHover: tokens.shade.c200,
-        highlight: tokens.blue.c200
+        highlight: tokens.blue.c200,
+
+        activeBackground: tokens.shade.c300,
       },
 
       global: {
diff --git a/themes/list/gray.ts b/themes/list/gray.ts
index c6c0144d..bf37f20f 100644
--- a/themes/list/gray.ts
+++ b/themes/list/gray.ts
@@ -63,7 +63,9 @@ export default createTheme({
       pill: {
         background: tokens.shade.c300,
         backgroundHover: tokens.shade.c200,
-        highlight: tokens.blue.c200
+        highlight: tokens.blue.c200,
+
+        activeBackground: tokens.shade.c300,
       },
 
       global: {
diff --git a/themes/list/red.ts b/themes/list/red.ts
index 0ec319e8..5b6fcb44 100644
--- a/themes/list/red.ts
+++ b/themes/list/red.ts
@@ -63,7 +63,9 @@ export default createTheme({
       pill: {
         background: tokens.shade.c300,
         backgroundHover: tokens.shade.c200,
-        highlight: tokens.blue.c200
+        highlight: tokens.blue.c200,
+
+        activeBackground: tokens.shade.c300,
       },
 
       global: {
diff --git a/themes/list/teal.ts b/themes/list/teal.ts
index 1fb66ac4..ea0f1323 100644
--- a/themes/list/teal.ts
+++ b/themes/list/teal.ts
@@ -63,7 +63,9 @@ export default createTheme({
       pill: {
         background: tokens.shade.c300,
         backgroundHover: tokens.shade.c200,
-        highlight: tokens.blue.c200
+        highlight: tokens.blue.c200,
+
+        activeBackground: tokens.shade.c300,
       },
 
       global: {

From 8245353b153fd8e6d94a2e74f22af94166a0c95d Mon Sep 17 00:00:00 2001
From: Astrid <github@astrid.exposed>
Date: Sat, 3 Feb 2024 22:28:09 +0100
Subject: [PATCH 8/8] Update copyHlsPlaylist

---
 src/assets/locales/en.json | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json
index c46a2527..61b7e88b 100644
--- a/src/assets/locales/en.json
+++ b/src/assets/locales/en.json
@@ -128,15 +128,11 @@
       },
       "morning": {
         "default": "What would you like to watch this morning?",
-        "extra": [
-          "I hear Before Sunrise is good"
-        ]
+        "extra": ["I hear Before Sunrise is good"]
       },
       "night": {
         "default": "What would you like to watch tonight?",
-        "extra": [
-          "Tired? I hear The Exorcist is good."
-        ]
+        "extra": ["Tired? I hear The Exorcist is good."]
       }
     }
   },
@@ -243,7 +239,7 @@
     "menus": {
       "downloads": {
         "disclaimer": "Downloads are taken directly from the provider. movie-web does not have control over how the downloads are provided.",
-        "copyHlsPlaylist": "Copy playlist link",
+        "copyHlsPlaylist": "Copy HLS playlist link",
         "downloadSubtitle": "Download current subtitle",
         "downloadVideo": "Download video",
         "hlsDisclaimer": "Downloads are taken directly from the provider. movie-web does not have control over how the downloads are provided.<br /><br />Please note that you are downloading an HLS playlist, <bold>it is not recommended to download if you are not familiar with advanced streaming formats</bold>. Try different sources for different formats.",