diff --git a/apps/bottle/src/app/bottles/[...slug]/ActionButtons.tsx b/apps/bottle/src/app/bottles/[...slug]/ActionButtons.tsx index 8d88fe7..465f2bb 100644 --- a/apps/bottle/src/app/bottles/[...slug]/ActionButtons.tsx +++ b/apps/bottle/src/app/bottles/[...slug]/ActionButtons.tsx @@ -15,7 +15,7 @@ interface Props { export function ActionButtons({ type, id }: Props) { const { mutate: accept } = useAcceptBottleMutation(type, id); - const { mutate: refuse } = useRefuseBottleMutation(); + const { mutate: refuse } = useRefuseBottleMutation(id); const handleRightClick = type === 'random' @@ -33,7 +33,7 @@ export function ActionButtons({ type, id }: Props) { return ( refuse(id)}>떠내려 보내기} + left={ refuse()}>떠내려 보내기} right={ {type === 'random' ? '호감 표현하기' : '문답 시작하기'} diff --git a/apps/bottle/src/app/bottles/_components/Top.tsx b/apps/bottle/src/app/bottles/_components/Top.tsx index a1efbe3..616146f 100644 --- a/apps/bottle/src/app/bottles/_components/Top.tsx +++ b/apps/bottle/src/app/bottles/_components/Top.tsx @@ -1,5 +1,5 @@ import { ReactNode } from 'react'; -import { useUserInfoQuery } from '../../../store/query/useNameQuery'; +import { useUserInfoQuery } from '../../../store/query/useUserInfoQuery'; import { titleStyle } from './topStyle.css'; interface Props { diff --git a/apps/bottle/src/app/bottles/page.tsx b/apps/bottle/src/app/bottles/page.tsx index bc36dd9..0e27dc0 100644 --- a/apps/bottle/src/app/bottles/page.tsx +++ b/apps/bottle/src/app/bottles/page.tsx @@ -2,7 +2,7 @@ import { getServerSideTokens } from '@/features/server/serverSideTokens'; import { Suspense } from 'react'; import { ServerFetchBoundary } from '../../store/query/ServerFetchBoundary'; import { bottlesQueryOptions } from '../../store/query/useBottlesQuery'; -import { userInfoQueryOptions } from '../../store/query/useNameQuery'; +import { userInfoQueryOptions } from '../../store/query/useUserInfoQuery'; import { Bottles } from './Bottles'; export default function BottlesPage() { diff --git a/apps/bottle/src/app/create-profile/_steps/MBTI/MBTI.spec.tsx b/apps/bottle/src/app/create-profile/_steps/MBTI/MBTI.spec.tsx index 7e63154..9e67942 100644 --- a/apps/bottle/src/app/create-profile/_steps/MBTI/MBTI.spec.tsx +++ b/apps/bottle/src/app/create-profile/_steps/MBTI/MBTI.spec.tsx @@ -1,5 +1,5 @@ import { StepProvider } from '@/features/steps/StepProvider'; -import { userInfoQueryOptions } from '@/store/query/useNameQuery'; +import { userInfoQueryOptions } from '@/store/query/useUserInfoQuery'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { render } from '@testing-library/react'; import { CreateProfileProvider } from '../../CreateProfileProvider'; diff --git a/apps/bottle/src/app/create-profile/_steps/MBTI/index.tsx b/apps/bottle/src/app/create-profile/_steps/MBTI/index.tsx index f50ab2c..99ece69 100644 --- a/apps/bottle/src/app/create-profile/_steps/MBTI/index.tsx +++ b/apps/bottle/src/app/create-profile/_steps/MBTI/index.tsx @@ -2,7 +2,7 @@ import { Control, toggle } from '@/components/control'; import { Step } from '@/features/steps/StepContainer'; import { useStep } from '@/features/steps/StepProvider'; import { EIType, JPType, SNType, TFType } from '@/models/profile/MBTI'; -import { useUserInfoQuery } from '@/store/query/useNameQuery'; +import { useUserInfoQuery } from '@/store/query/useUserInfoQuery'; import { Button, ButtonProps } from '@bottlesteam/ui'; import { useMemo, useState } from 'react'; import { useCreateProfileValues } from '../../CreateProfileProvider'; diff --git a/apps/bottle/src/app/create-profile/layout.tsx b/apps/bottle/src/app/create-profile/layout.tsx index 3ad0980..1f8020a 100644 --- a/apps/bottle/src/app/create-profile/layout.tsx +++ b/apps/bottle/src/app/create-profile/layout.tsx @@ -1,7 +1,7 @@ import { getServerSideTokens } from '@/features/server/serverSideTokens'; import { StepProvider } from '@/features/steps/StepProvider'; import { ServerFetchBoundary } from '@/store/query/ServerFetchBoundary'; -import { userInfoQueryOptions } from '@/store/query/useNameQuery'; +import { userInfoQueryOptions } from '@/store/query/useUserInfoQuery'; import { regionsQueryOptions } from '@/store/query/useRegionsQuery'; import { ReactNode, Suspense } from 'react'; diff --git a/apps/bottle/src/features/server/log.ts b/apps/bottle/src/features/server/log.ts new file mode 100644 index 0000000..9bc634d --- /dev/null +++ b/apps/bottle/src/features/server/log.ts @@ -0,0 +1,5 @@ +'use server'; + +export async function logAction(message: string): Promise { + console.log('[LOG]:', message); +} diff --git a/apps/bottle/src/store/mutation/useAcceptBottleMutation.ts b/apps/bottle/src/store/mutation/useAcceptBottleMutation.ts index edecefa..15d2cc6 100644 --- a/apps/bottle/src/store/mutation/useAcceptBottleMutation.ts +++ b/apps/bottle/src/store/mutation/useAcceptBottleMutation.ts @@ -7,6 +7,9 @@ import { useMutation, useQueryClient } from '@tanstack/react-query'; import { getCookie } from 'cookies-next'; import { useRouter } from 'next/navigation'; import { bottlesQueryOptions } from '../query/useBottlesQuery'; +import { logAction } from '@/features/server/log'; +import { bottleDetailQueryOptions } from '../query/useBottleDetailQuery'; +import { userInfoQueryOptions } from '../query/useUserInfoQuery'; interface AcceptBottleBody { likeMessage: T extends 'random' ? string : null; @@ -16,6 +19,13 @@ export function useAcceptBottleMutation(type: T, id: Bottl const router = useRouter(); const { send } = useAppBridge(); const queryClient = useQueryClient(); + const tokens = getClientSideTokens(); + + async function logAcceptBottleAction() { + const { name: currentUserName } = await queryClient.ensureQueryData(userInfoQueryOptions(tokens)); + const { userName: senderName } = await queryClient.ensureQueryData(bottleDetailQueryOptions(tokens, id)); + await logAction(`${currentUserName} ACCEPTED ${senderName}`); + } return useMutation({ mutationFn: (likeMessage: string | null) => @@ -24,7 +34,7 @@ export function useAcceptBottleMutation(type: T, id: Bottl getClientSideTokens(), createInit(getCookie('accessToken') ?? '', { likeMessage }) ), - onSuccess: () => { + onSuccess: async () => { queryClient.invalidateQueries({ queryKey: bottlesQueryOptions(getClientSideTokens()).queryKey }); if (type === 'random') { send({ type: AppBridgeMessageType.TOAST_OPEN, payload: { message: '호감을 보냈어요' } }); @@ -32,6 +42,7 @@ export function useAcceptBottleMutation(type: T, id: Bottl return; } send({ type: AppBridgeMessageType.BOTTLE_ACCEPT }); + await logAcceptBottleAction(); }, }); } diff --git a/apps/bottle/src/store/mutation/useRefuseBottleMutation.ts b/apps/bottle/src/store/mutation/useRefuseBottleMutation.ts index f3b8f82..c3f19c4 100644 --- a/apps/bottle/src/store/mutation/useRefuseBottleMutation.ts +++ b/apps/bottle/src/store/mutation/useRefuseBottleMutation.ts @@ -2,22 +2,32 @@ import { AppBridgeMessageType, useAppBridge } from '@/features/app-bridge'; import { POST, createInit } from '@/features/server'; import { getClientSideTokens } from '@/features/server/clientSideTokens'; import { Bottle } from '@/models/bottle'; -import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { QueryClient, useMutation, useQueryClient } from '@tanstack/react-query'; import { useRouter } from 'next/navigation'; import { bottlesQueryOptions } from '../query/useBottlesQuery'; +import { logAction } from '@/features/server/log'; +import { userInfoQueryOptions } from '../query/useUserInfoQuery'; +import { bottleDetailQueryOptions } from '../query/useBottleDetailQuery'; -export function useRefuseBottleMutation() { +export function useRefuseBottleMutation(id: Bottle['id']) { const router = useRouter(); const { send } = useAppBridge(); const queryClient = useQueryClient(); const tokens = getClientSideTokens(); + async function logRefuseBottleAction() { + const { name: currentUserName } = await queryClient.ensureQueryData(userInfoQueryOptions(tokens)); + const { userName: senderName } = await queryClient.ensureQueryData(bottleDetailQueryOptions(tokens, id)); + await logAction(`${currentUserName} REFUSED ${senderName}`); + } + return useMutation({ - mutationFn: (id: Bottle['id']) => POST(`/api/v1/bottles/${id}/refuse`, tokens, createInit(tokens.accessToken)), - onSuccess: () => { + mutationFn: () => POST(`/api/v1/bottles/${id}/refuse`, tokens, createInit(tokens.accessToken)), + onSuccess: async () => { queryClient.invalidateQueries({ queryKey: bottlesQueryOptions(tokens).queryKey }); send({ type: AppBridgeMessageType.TOAST_OPEN, payload: { message: '보틀을 떠내려 보냈어요' } }); + await logRefuseBottleAction(); router.back(); }, }); diff --git a/apps/bottle/src/store/query/ServerFetchBoundary.tsx b/apps/bottle/src/store/query/ServerFetchBoundary.tsx index 33e7f17..5768bec 100644 --- a/apps/bottle/src/store/query/ServerFetchBoundary.tsx +++ b/apps/bottle/src/store/query/ServerFetchBoundary.tsx @@ -20,9 +20,5 @@ export async function ServerFetchBoundary({ fetchOptions, children }: Props) { await queryClient.fetchQuery(fetchOptions); } - // Array.isArray(fetchOptions) - // ? await Promise.all(fetchOptions.map(prefetchOption => queryClient.prefetchQuery(prefetchOption))) - // : await queryClient.prefetchQuery(fetchOptions); - return {children}; } diff --git a/apps/bottle/src/store/query/useMyInformation.ts b/apps/bottle/src/store/query/useMyInformation.ts index 67441d0..1ad9c69 100644 --- a/apps/bottle/src/store/query/useMyInformation.ts +++ b/apps/bottle/src/store/query/useMyInformation.ts @@ -5,7 +5,7 @@ import { CurrentUser } from '@/models/user'; import { UseSuspenseQueryOptions, useSuspenseQuery } from '@tanstack/react-query'; export const myInformationQueryOptions = (tokens: Tokens): UseSuspenseQueryOptions => ({ - queryKey: ['bottles'], + queryKey: ['my'], queryFn: () => GET(`/api/v1/profile`, tokens, createInit(tokens.accessToken)), }); export function useMyInformationQuery() { diff --git a/apps/bottle/src/store/query/useNameQuery.ts b/apps/bottle/src/store/query/useUserInfoQuery.ts similarity index 78% rename from apps/bottle/src/store/query/useNameQuery.ts rename to apps/bottle/src/store/query/useUserInfoQuery.ts index 29b6a61..572a172 100644 --- a/apps/bottle/src/store/query/useNameQuery.ts +++ b/apps/bottle/src/store/query/useUserInfoQuery.ts @@ -21,8 +21,12 @@ export interface GetUserInfoData { } export const userInfoQueryOptions = (tokens: Tokens): UseSuspenseQueryOptions => ({ - queryKey: ['userInfo'], - queryFn: () => GET(`/api/v1/profile/info`, tokens, createInit(tokens.accessToken)), + queryKey: ['user-info'], + queryFn: async () => { + const userInfo = await GET(`/api/v1/profile/info`, tokens, createInit(tokens.accessToken)); + console.log('CURRENT USER:', userInfo.name); + return userInfo; + }, }); export function useUserInfoQuery() { return useSuspenseQuery(userInfoQueryOptions(getClientSideTokens()));