feat: 타인 마이페이지에서 손흔들기 버튼 추가

packages/web-domains/src/about-me/features/containers/ScreenContainer.tsx

@@ -1,22 +1,32 @@
 'use client';
 
 import { colors, size } from '@sambad/sds/theme';
-import { Fragment } from 'react';
+import { Button } from '@sds/components';
 
 import { ActionBar } from '@/common/components/ActionBar/ActionBar';
 
+import { useIsMyByParams } from '../hooks/useIsMyByParams';
+
 import { ProfileContainer } from './ProfileContainer';
 import { SegmentedControlContainer } from './SegmentedControlContainer';
+import { handWavingButtonCss, screenRootCss } from './styles';
 
 export const ScreenContainer = () => {
+  const { isMy } = useIsMyByParams();
+
   return (
-    <Fragment>
-      <ActionBar title="프로필" />
+    <div css={screenRootCss}>
+      <ActionBar title={isMy ? '마이 프로필' : '프로필'} />
       <div style={layoutStyle}>
         <ProfileContainer style={{ marginBottom: size['5xs'] }} />
         <SegmentedControlContainer style={sectionStyle} />
       </div>
-    </Fragment>
+      {!isMy && (
+        <Button size="large" css={handWavingButtonCss}>
+          손 흔들어 인사하기
+        </Button>
+      )}
+    </div>
   );
 };
 

packages/web-domains/src/about-me/features/containers/styles.ts

@@ -43,3 +43,13 @@ export const answerContentCss = css({
     marginTop: size['7xs'],
   },
 });
+
+export const handWavingButtonCss = css({
+  position: 'absolute',
+  bottom: size['xl'],
+});
+
+export const screenRootCss = css({
+  position: 'relative',
+  height: '100dvh',
+});