A decentralized music tracking and discovery platform built on AT Protocol 🎵
rocksky.app
spotify
atproto
lastfm
musicbrainz
scrobbling
listenbrainz
Fetch and sync follows for circles
Call useFollowsQuery for neighbour DIDs (excluding the current DID) and
merge returned follow DIDs into the local follows set using useEffect
+23
-1
+23
-1
apps/web/src/pages/profile/circles/Circles.tsx
+23
-1
apps/web/src/pages/profile/circles/Circles.tsx
···
12
12
import { followsAtom } from "../../../atoms/follows";
13
13
import {
14
14
useFollowAccountMutation,
15
+
useFollowsQuery,
15
16
useUnfollowAccountMutation,
16
17
} from "../../../hooks/useGraph";
17
-
import { useState } from "react";
18
+
import { useEffect, useState } from "react";
18
19
import SignInModal from "../../../components/SignInModal";
19
20
import { activeTabAtom } from "../../../atoms/tab";
20
21
import scrollToTop from "../../../lib/scrollToTop";
···
29
30
const { mutate: followAccount } = useFollowAccountMutation();
30
31
const { mutate: unfollowAccount } = useUnfollowAccountMutation();
31
32
33
+
const allCircles = data?.neighbours ?? [];
34
+
35
+
const { data: followsData } = useFollowsQuery(
36
+
localStorage.getItem("did")!,
37
+
allCircles.length,
38
+
allCircles
39
+
.map((circle) => circle.did)
40
+
.filter((x) => x !== localStorage.getItem("did")),
41
+
);
42
+
32
43
const onFollow = (followerDid: string) => {
33
44
if (!localStorage.getItem("token")) {
34
45
setIsSignInOpen(true);
···
50
61
});
51
62
unfollowAccount(followerDid);
52
63
};
64
+
65
+
useEffect(() => {
66
+
if (!followsData) return;
67
+
setFollows((prev) => {
68
+
const newSet = new Set(prev);
69
+
followsData.follows.forEach((follow: { did: string }) => {
70
+
newSet.add(follow.did);
71
+
});
72
+
return newSet;
73
+
});
74
+
}, [followsData, setFollows]);
53
75
54
76
return (
55
77
<>