first commit

resources/client/profile/requests/use-profile-comments.ts

@@ -0,0 +1,12 @@
+import {useInfiniteData} from '@common/ui/infinite-scroll/use-infinite-data';
+import {useParams} from 'react-router-dom';
+import {Comment} from '@common/comments/comment';
+
+export function useProfileComments() {
+  const {userId = 'me'} = useParams();
+  return useInfiniteData<Comment>({
+    endpoint: `user-profile/${userId}/comments`,
+    queryKey: ['comment', 'profile-page-comments', userId],
+    paginate: 'simple',
+  });
+}

resources/client/profile/requests/use-profile-followed-users.ts

@@ -0,0 +1,12 @@
+import {useInfiniteData} from '@common/ui/infinite-scroll/use-infinite-data';
+import {useParams} from 'react-router-dom';
+import {User} from '@common/auth/user';
+
+export function useProfileFollowedUsers() {
+  const {userId = 'me'} = useParams();
+  return useInfiniteData<User>({
+    endpoint: `users/${userId}/followed-users`,
+    queryKey: ['users', 'profile-page-followed-users', userId],
+    paginate: 'simple',
+  });
+}

resources/client/profile/requests/use-profile-followers.ts

@@ -0,0 +1,12 @@
+import {useInfiniteData} from '@common/ui/infinite-scroll/use-infinite-data';
+import {useParams} from 'react-router-dom';
+import {User} from '@common/auth/user';
+
+export function useProfileFollowers() {
+  const {userId = 'me'} = useParams();
+  return useInfiniteData<User>({
+    endpoint: `users/${userId}/followers`,
+    queryKey: ['users', 'profile-page-followers', userId],
+    paginate: 'simple',
+  });
+}

resources/client/profile/requests/use-profile-lists.ts

@@ -0,0 +1,12 @@
+import {useInfiniteData} from '@common/ui/infinite-scroll/use-infinite-data';
+import {useParams} from 'react-router-dom';
+import {Channel} from '@common/channels/channel';
+
+export function useProfileLists() {
+  const {userId = 'me'} = useParams();
+  return useInfiniteData<Channel>({
+    endpoint: `user-profile/${userId}/lists`,
+    queryKey: ['channel', 'profile-lists', userId],
+    paginate: 'simple',
+  });
+}

resources/client/profile/requests/use-profile-ratings.ts

@@ -0,0 +1,12 @@
+import {useInfiniteData} from '@common/ui/infinite-scroll/use-infinite-data';
+import {useParams} from 'react-router-dom';
+import {Review} from '@app/titles/models/review';
+
+export function useProfileRatings() {
+  const {userId = 'me'} = useParams();
+  return useInfiniteData<Review>({
+    endpoint: `user-profile/${userId}/ratings`,
+    queryKey: ['reviews', 'profile-page-ratings', userId],
+    paginate: 'simple',
+  });
+}

resources/client/profile/requests/use-profile-reviews.ts

@@ -0,0 +1,12 @@
+import {useInfiniteData} from '@common/ui/infinite-scroll/use-infinite-data';
+import {useParams} from 'react-router-dom';
+import {Review} from '@app/titles/models/review';
+
+export function useProfileReviews() {
+  const {userId = 'me'} = useParams();
+  return useInfiniteData<Review>({
+    endpoint: `user-profile/${userId}/reviews`,
+    queryKey: ['reviews', 'profile-page-reviews', userId],
+    paginate: 'simple',
+  });
+}

resources/client/profile/requests/use-update-user-profile.ts

@@ -0,0 +1,54 @@
+import {useMutation} from '@tanstack/react-query';
+import {useTrans} from '@common/i18n/use-trans';
+import {toast} from '@common/ui/toast/toast';
+import {message} from '@common/i18n/message';
+import {apiClient, queryClient} from '@common/http/query-client';
+import {onFormQueryError} from '@common/errors/on-form-query-error';
+import {UseFormReturn} from 'react-hook-form';
+import {BackendResponse} from '@common/http/backend-response/backend-response';
+import {useAuth} from '@common/auth/use-auth';
+import {UserLink} from '@app/profile/user-link';
+import {userProfileQueryKey} from '@app/profile/requests/use-user-profile';
+import {User} from '@common/auth/user';
+
+interface Response extends BackendResponse {
+  user: User;
+}
+
+export interface UpdateProfilePayload {
+  user: {
+    avatar?: string;
+    first_name?: string;
+    last_name?: string;
+    username?: string;
+  };
+  profile: {
+    city?: string;
+    country?: string;
+    description?: string;
+  };
+  links: UserLink[];
+}
+
+export function useUpdateUserProfile(
+  form: UseFormReturn<UpdateProfilePayload>,
+) {
+  const {user} = useAuth();
+  const {trans} = useTrans();
+  return useMutation({
+    mutationFn: (payload: UpdateProfilePayload) => updateProfile(payload),
+    onSuccess: async () => {
+      if (user) {
+        await queryClient.invalidateQueries({
+          queryKey: userProfileQueryKey(user.id),
+        });
+      }
+      toast(trans(message('Profile updated')));
+    },
+    onError: err => onFormQueryError(err, form),
+  });
+}
+
+function updateProfile(payload: UpdateProfilePayload): Promise<Response> {
+  return apiClient.put('user-profile/me', payload).then(r => r.data);
+}

resources/client/profile/requests/use-user-profile.ts

@@ -0,0 +1,29 @@
+import {useQuery} from '@tanstack/react-query';
+import {BackendResponse} from '@common/http/backend-response/backend-response';
+import {User} from '@common/auth/user';
+import {apiClient} from '@common/http/query-client';
+import {useParams} from 'react-router-dom';
+
+export interface UseUserProfileResponse extends BackendResponse {
+  user: User;
+}
+
+export const userProfileQueryKey = (userId: number | string) => [
+  'users',
+  `${userId}`,
+  'profile',
+];
+
+export function useUserProfile() {
+  const {userId} = useParams();
+  return useQuery({
+    queryKey: userProfileQueryKey(userId!),
+    queryFn: () => fetchProfile(userId!),
+  });
+}
+
+function fetchProfile(userId: string) {
+  return apiClient
+    .get<UseUserProfileResponse>(`user-profile/${userId}`)
+    .then(response => response.data);
+}