From f2e3d9819d00dc7fc1706e4705faf3a3e7173b77 Mon Sep 17 00:00:00 2001
From: Doeunnkimm <doeunnkimm@gmail.com>
Date: Wed, 21 Aug 2024 23:11:52 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=ED=83=80=EC=9D=B8=20=EB=A7=88=EC=9D=B4?=
 =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=EC=86=90?=
 =?UTF-8?q?=ED=9D=94=EB=93=A4=EA=B8=B0=20=EB=B2=84=ED=8A=BC=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/containers/ScreenContainer.tsx    | 18 ++++++++++++++----
 .../src/about-me/features/containers/styles.ts | 10 ++++++++++
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/packages/web-domains/src/about-me/features/containers/ScreenContainer.tsx b/packages/web-domains/src/about-me/features/containers/ScreenContainer.tsx
index c3545d2c..683aa5d8 100644
--- a/packages/web-domains/src/about-me/features/containers/ScreenContainer.tsx
+++ b/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>
   );
 };
 
diff --git a/packages/web-domains/src/about-me/features/containers/styles.ts b/packages/web-domains/src/about-me/features/containers/styles.ts
index 1cae13f4..df904b49 100644
--- a/packages/web-domains/src/about-me/features/containers/styles.ts
+++ b/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',
+});