From 27c27f46a75d70eb892de355889335eee597d350 Mon Sep 17 00:00:00 2001
From: amsyarasyiq <82711525+amsyarasyiq@users.noreply.github.com>
Date: Mon, 24 Jul 2023 00:24:41 +0800
Subject: [PATCH] Publish BetterSpotifyIntegration

---
 .../BetterSpotifyIntegration/manifest.json    |  6 +++
 .../src/components/ListenAlongButton.tsx      | 38 +++++++++++++++++++
 .../BetterSpotifyIntegration/src/index.tsx    | 30 +++++++++++++++
 .../src/utils/useListeningParty.ts            | 15 ++++++++
 4 files changed, 89 insertions(+)
 create mode 100644 plugins/BetterSpotifyIntegration/manifest.json
 create mode 100644 plugins/BetterSpotifyIntegration/src/components/ListenAlongButton.tsx
 create mode 100644 plugins/BetterSpotifyIntegration/src/index.tsx
 create mode 100644 plugins/BetterSpotifyIntegration/src/utils/useListeningParty.ts

diff --git a/plugins/BetterSpotifyIntegration/manifest.json b/plugins/BetterSpotifyIntegration/manifest.json
new file mode 100644
index 0000000..011e41c
--- /dev/null
+++ b/plugins/BetterSpotifyIntegration/manifest.json
@@ -0,0 +1,6 @@
+{
+    "name": "BetterSpotifyIntegration",
+    "description": "Shrimply better integration with Spotify",
+    "vendetta": { },
+    "main": "src/index.tsx"
+}
diff --git a/plugins/BetterSpotifyIntegration/src/components/ListenAlongButton.tsx b/plugins/BetterSpotifyIntegration/src/components/ListenAlongButton.tsx
new file mode 100644
index 0000000..6e5b677
--- /dev/null
+++ b/plugins/BetterSpotifyIntegration/src/components/ListenAlongButton.tsx
@@ -0,0 +1,38 @@
+import { findByProps, findByStoreName } from "@vendetta/metro";
+import { getAssetIDByName } from "@vendetta/ui/assets";
+import { Image, View } from "react-native";
+
+const FluxUtils = findByProps("useStateFromStores");
+const SpotifyStore = findByStoreName("SpotifyStore");
+
+const Button = findByProps("Sizes", "Looks") as any;
+const SpotifySyncUtil = findByProps("play", "sync");
+
+interface ListenAlongButtonProps {
+    activity: any;
+    user: any;
+    isCurrentUser: boolean;
+    activityButtonColor: string;
+}
+
+export default function ListenAlongButton(props: ListenAlongButtonProps) {
+    const currentPartyId = FluxUtils.useStateFromStores([SpotifyStore], () => SpotifyStore.getActivity()?.party?.id);
+    const alreadySync = props.isCurrentUser || props.activity?.party?.id === currentPartyId;
+
+    return <View pointerEvents={alreadySync ? "none" : "auto"}>
+        <Button
+            text={!alreadySync ? "Listen Along" : "You are already along for this ride"}
+            size={Button.Sizes.SMALL}
+            style={{
+                marginTop: 12,
+                backgroundColor: props.activityButtonColor,
+                opacity: alreadySync ? 0.5 : 1
+            }}
+            renderIcon={() => <Image
+                style={{ height: 16, width: 16, marginRight: 8, tintColor: "white" }}
+                source={getAssetIDByName("ic_headphone")}
+            />}
+            onPress={() => void SpotifySyncUtil.sync(props.activity, props.user.id)}
+        />
+    </View>;
+}
diff --git a/plugins/BetterSpotifyIntegration/src/index.tsx b/plugins/BetterSpotifyIntegration/src/index.tsx
new file mode 100644
index 0000000..10fa1f6
--- /dev/null
+++ b/plugins/BetterSpotifyIntegration/src/index.tsx
@@ -0,0 +1,30 @@
+import { findByName } from "@vendetta/metro";
+import { before } from "@vendetta/patcher";
+import { findInReactTree } from "@vendetta/utils";
+
+import ListenAlongButton from "./components/ListenAlongButton";
+
+let sectionPatch: () => void;
+
+export default {
+    onLoad() {
+        sectionPatch = before("default", findByName("UserProfileSection", false), ([props]) => {
+            if (props?.title?.includes?.("Spotify") || props.activity.type !== 2) return;
+
+            const spotifyElement = findInReactTree(props.children, e => e?.style?.padding === 0);
+            const actionsIndex = spotifyElement?.children?.findIndex?.(e => e?.type?.name === "Actions");
+
+            if (actionsIndex && actionsIndex !== -1) {
+                const actions = spotifyElement.children[actionsIndex];
+
+                spotifyElement.children[actionsIndex] = <>
+                    {actions}
+                    {<ListenAlongButton {...actions.props} />}
+                </>;
+            }
+        });
+    },
+    onUnload() {
+        sectionPatch?.();
+    }
+};
diff --git a/plugins/BetterSpotifyIntegration/src/utils/useListeningParty.ts b/plugins/BetterSpotifyIntegration/src/utils/useListeningParty.ts
new file mode 100644
index 0000000..72b4ed4
--- /dev/null
+++ b/plugins/BetterSpotifyIntegration/src/utils/useListeningParty.ts
@@ -0,0 +1,15 @@
+import { findByProps, findByStoreName } from "@vendetta/metro";
+
+const FluxUtils = findByProps("useStateFromStores");
+const SpotifyStore = findByStoreName("SpotifyStore");
+const GamePartyStore = findByStoreName("GamePartyStore");
+const UserStore = findByStoreName("UserStore");
+
+export default function useListeningParty() {
+    const partySet = FluxUtils.useStateFromStores([GamePartyStore, SpotifyStore], () => {
+        const party = GamePartyStore.getParty(SpotifyStore.getActivity()?.party?.id);
+        return party?.size > 1 ? party : null;
+    });
+
+    return partySet ? [...partySet].map(id => UserStore.getUser(id)) : [];
+}