Display scrobbles

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>

packages/pl-fe/src/api/hooks/accounts/useAccount.ts

@@ -1,4 +1,4 @@
-import { type Account as BaseAccount, accountSchema } from 'pl-api';
+import { type Account as BaseAccount } from 'pl-api';
 import { useEffect, useMemo } from 'react';
 import { useHistory } from 'react-router-dom';
 
@@ -7,10 +7,12 @@ import { useEntity } from 'pl-fe/entity-store/hooks';
 import { useAppSelector, useClient, useFeatures, useLoggedIn } from 'pl-fe/hooks';
 import { type Account, normalizeAccount } from 'pl-fe/normalizers';
 
+import { useAccountScrobble } from './useAccountScrobble';
 import { useRelationship } from './useRelationship';
 
 interface UseAccountOpts {
   withRelationship?: boolean;
+  withScrobble?: boolean;
 }
 
 const useAccount = (accountId?: string, opts: UseAccountOpts = {}) => {
@@ -18,12 +20,12 @@ const useAccount = (accountId?: string, opts: UseAccountOpts = {}) => {
   const history = useHistory();
   const features = useFeatures();
   const { me } = useLoggedIn();
-  const { withRelationship } = opts;
+  const { withRelationship, withScrobble } = opts;
 
   const { entity, isUnauthorized, ...result } = useEntity<BaseAccount, Account>(
     [Entities.ACCOUNTS, accountId!],
     () => client.accounts.getAccount(accountId!),
-    { schema: accountSchema, enabled: !!accountId, transform: normalizeAccount },
+    { enabled: !!accountId, transform: normalizeAccount },
   );
 
   const meta = useAppSelector((state) => accountId && state.accounts_meta[accountId] || {});
@@ -33,12 +35,17 @@ const useAccount = (accountId?: string, opts: UseAccountOpts = {}) => {
     isLoading: isRelationshipLoading,
   } = useRelationship(accountId, { enabled: withRelationship });
 
+  const {
+    scrobble,
+    isLoading: isScrobbleLoading,
+  } = useAccountScrobble(accountId, { enabled: withScrobble });
+
   const isBlocked = entity?.relationship?.blocked_by === true;
   const isUnavailable = (me === entity?.id) ? false : (isBlocked && !features.blockersVisible);
 
   const account = useMemo(
-    () => entity ? { ...entity, relationship, __meta: { meta, ...entity.__meta } } : undefined,
-    [entity, relationship],
+    () => entity ? { ...entity, relationship, scrobble, __meta: { meta, ...entity.__meta } } : undefined,
+    [entity, relationship, scrobble],
   );
 
   useEffect(() => {
@@ -51,6 +58,7 @@ const useAccount = (accountId?: string, opts: UseAccountOpts = {}) => {
     ...result,
     isLoading: result.isLoading,
     isRelationshipLoading,
+    isScrobbleLoading,
     isUnauthorized,
     isUnavailable,
     account,

packages/pl-fe/src/api/hooks/accounts/useAccountLookup.ts

@@ -7,10 +7,12 @@ import { useEntityLookup } from 'pl-fe/entity-store/hooks';
 import { useClient, useFeatures, useLoggedIn } from 'pl-fe/hooks';
 import { type Account, normalizeAccount } from 'pl-fe/normalizers';
 
+import { useAccountScrobble } from './useAccountScrobble';
 import { useRelationship } from './useRelationship';
 
 interface UseAccountLookupOpts {
   withRelationship?: boolean;
+  withScrobble?: boolean;
 }
 
 const useAccountLookup = (acct: string | undefined, opts: UseAccountLookupOpts = {}) => {
@@ -18,7 +20,7 @@ const useAccountLookup = (acct: string | undefined, opts: UseAccountLookupOpts =
   const features = useFeatures();
   const history = useHistory();
   const { me } = useLoggedIn();
-  const { withRelationship } = opts;
+  const { withRelationship, withScrobble } = opts;
 
   const { entity: account, isUnauthorized, ...result } = useEntityLookup<BaseAccount, Account>(
     Entities.ACCOUNTS,
@@ -32,6 +34,11 @@ const useAccountLookup = (acct: string | undefined, opts: UseAccountLookupOpts =
     isLoading: isRelationshipLoading,
   } = useRelationship(account?.id, { enabled: withRelationship });
 
+  const {
+    scrobble,
+    isLoading: isScrobbleLoading,
+  } = useAccountScrobble(account?.id, { enabled: withScrobble });
+
   const isBlocked = account?.relationship?.blocked_by === true;
   const isUnavailable = (me === account?.id) ? false : (isBlocked && !features.blockersVisible);
 
@@ -45,9 +52,10 @@ const useAccountLookup = (acct: string | undefined, opts: UseAccountLookupOpts =
     ...result,
     isLoading: result.isLoading,
     isRelationshipLoading,
+    isScrobbleLoading,
     isUnauthorized,
     isUnavailable,
-    account: account ? { ...account, relationship } : undefined,
+    account: account ? { ...account, relationship, scrobble } : undefined,
   };
 };
 

packages/pl-fe/src/api/hooks/accounts/useAccountScrobble.ts

@@ -0,0 +1,27 @@
+import { useQuery } from '@tanstack/react-query';
+
+import { useClient, useFeatures } from 'pl-fe/hooks';
+
+import type { Scrobble } from 'pl-api';
+
+interface UseScrobblesOpts {
+  enabled?: boolean;
+}
+
+const useAccountScrobble = (accountId?: string, opts: UseScrobblesOpts = {}) => {
+  const client = useClient();
+  const features = useFeatures();
+  const { enabled = false } = opts;
+
+  const { data: scrobble, ...result } = useQuery<Scrobble>({
+    queryKey: ['scrobbles', accountId!],
+    queryFn: async () => (await client.accounts.getScrobbles(accountId!, { limit: 1 })).items[0],
+    placeholderData: undefined,
+    enabled: enabled && !!accountId && features.scrobbles,
+    staleTime: 3 * 60 * 1000,
+  });
+
+  return { scrobble, ...result };
+};
+
+export { useAccountScrobble };

packages/pl-fe/src/api/hooks/announcements/useAnnouncements.ts

@@ -92,6 +92,6 @@ const useAnnouncements = () => {
 };
 
 const compareAnnouncements = (a: Announcement, b: Announcement): number =>
-  new Date(a.starts_at || a.published_at).getDate() - new Date(b.starts_at || b.published_at).getDate();
+  new Date(a.starts_at || a.published_at).getTime() - new Date(b.starts_at || b.published_at).getTime();
 
 export { updateReactions, useAnnouncements };

packages/pl-fe/src/api/hooks/index.ts

@@ -2,6 +2,7 @@
 // Accounts
 export { useAccount } from './accounts/useAccount';
 export { useAccountLookup } from './accounts/useAccountLookup';
+export { useAccountScrobble } from './accounts/useAccountScrobble';
 export {
   useBlocks,
   useMutes,