Release-2.0.4

.gitignore

@@ -150,4 +150,5 @@ dist
 
 # Claude Code configuration
 CLAUDE.md
-.claude//
+.claude
+.omc

apps/mobile/package.json

@@ -2,7 +2,7 @@
   "name": "@layer/mobile",
   "main": "expo-router/entry",
   "types": "./bridge/native.ts",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "scripts": {
     "start": "expo start",
     "reset-project": "node ./scripts/reset-project.js",

apps/web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@layer/web",
   "private": true,
-  "version": "2.0.3",
+  "version": "2.0.4",
   "type": "module",
   "scripts": {
     "dev": "vite",

apps/web/src/app/desktop/component/home/InProgressRetrospectsWrapper/index.tsx

@@ -11,10 +11,9 @@ import "swiper/css/navigation";
 import { useGetAllRetrospects } from "@/hooks/api/retrospect/useApiOptionsGetRetrospects";
 import { LoadingSpinner } from "@/component/space/view/LoadingSpinner";
 import RetrospectCard from "../RetrospectCard";
-import EmptyInProgressRetrospects from "./EmptyInProgressRetrospects";
 
 export default function InProgressRetrospectsWrapper() {
-  // * 작성중인 모든 회고 리스트 요청
+  // * 진행 중인 모든 회고 리스트 요청
   const { data: retrospects, isPending: isRetrospectsPending } = useGetAllRetrospects({
     select: (data) => data.retrospects.filter((retrospect) => retrospect.writeStatus === "PROCEEDING"),
   });
@@ -27,10 +26,10 @@ export default function InProgressRetrospectsWrapper() {
     >
       {/* ---------- 제목 ---------- */}
       <Typography variant="body15Bold" color="gray800">
-        작성중인 회고 ({retrospects?.length || 0})
+        진행 중인 회고 ({retrospects?.length || 0})
       </Typography>
 
-      {/* ---------- 작성중인 회고 컨텐츠 ---------- */}
+      {/* ---------- 진행 중인 회고 컨텐츠 ---------- */}
       <Swiper
         modules={[Navigation]}
         spaceBetween={12}
@@ -156,3 +155,22 @@ export default function InProgressRetrospectsWrapper() {
     </section>
   );
 }
+
+function EmptyInProgressRetrospects() {
+  return (
+    <div
+      css={css`
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        height: 13.8rem;
+        border-radius: 1.6rem;
+        background-color: ${DESIGN_TOKEN_COLOR.gray00};
+      `}
+    >
+      <Typography variant="body15Medium" color="gray500">
+        진행 중인 회고가 없어요
+      </Typography>
+    </div>
+  );
+}

apps/web/src/app/desktop/component/retrospect/template/list/TemplateListItem/index.tsx

@@ -42,6 +42,7 @@ export function TemplateListItem({ id, title, tag, imageUrl }: DesktopTemplateLi
         padding: 1.6rem;
         border: 0.1rem solid ${DESIGN_SYSTEM_COLOR.grey100};
         border-radius: 0.8rem;
+        background-color: #fff;
         cursor: pointer;
       `}
       onClick={handleClickDetail}

apps/web/src/app/desktop/component/retrospect/template/list/TemplateListTab/index.tsx

@@ -2,6 +2,7 @@ import { css } from "@emotion/react";
 
 import { useTabs } from "@/hooks/useTabs";
 import { DESIGN_TOKEN_COLOR } from "@/style/designTokens";
+import { useFunnelModal } from "@/hooks/useFunnelModal";
 
 export type TabProps<T extends string> = Omit<ReturnType<typeof useTabs<T>>, "tabs"> & { tab: T };
 
@@ -10,13 +11,21 @@ type TabsProps<T extends string> = ReturnType<typeof useTabs<T>> & {
 };
 
 export function TemplateListTab<T extends string>({ tabs, curTab, selectTab, TabComp }: TabsProps<T>) {
+  const { funnelModalState } = useFunnelModal();
+
+  const BACKGROUND_COLORS: Record<string, string> = {
+    listTemplate: DESIGN_TOKEN_COLOR.gray100,
+  };
+
+  const curBackgroundColor = (funnelModalState.step && BACKGROUND_COLORS[funnelModalState.step]) ?? "#fff";
+
   return (
     <div
       css={[
         css`
           position: sticky;
           top: 5.7rem;
-          background-color: #fff;
+          background-color: ${curBackgroundColor};
           display: inline-flex;
           gap: 0.8rem;
           padding-top: 2rem;

apps/web/src/app/desktop/component/retrospect/template/list/index.tsx

@@ -58,7 +58,7 @@ export function TemplateList() {
       {/* ---------- 템플릿 카드 리스트 UI ---------- */}
       <div
         css={css`
-          margin-top: 0.8rem;
+          margin-top: 2rem;
         `}
       >
         <TemplateListPageContext.Provider value={{ spaceId, isLeader: isLeader.current }}>

apps/web/src/app/desktop/component/retrospectCreate/QuestionEditSection/MainQuestionsContents.tsx

@@ -16,7 +16,13 @@ type MainQuestionsContentsProps = {
   handleContentChange: (index: number, newContent: string) => void;
 };
 
-export default function MainQuestionsContents({ questions, isDeleteMode, handleDelete, handleDragEnd, handleContentChange }: MainQuestionsContentsProps) {
+export default function MainQuestionsContents({
+  questions,
+  isDeleteMode,
+  handleDelete,
+  handleDragEnd,
+  handleContentChange,
+}: MainQuestionsContentsProps) {
   const { toast } = useToast();
 
   const originalContentRef = useRef<{ [key: number]: string }>({});
@@ -190,7 +196,6 @@ export default function MainQuestionsContents({ questions, isDeleteMode, handleD
                           cursor: grab;
                           display: flex;
                           align-items: center;
-                          padding: 0.4rem;
 
                           &:active {
                             cursor: grabbing;

apps/web/src/app/desktop/component/retrospectCreate/QuestionEditSection/index.tsx

@@ -211,13 +211,18 @@ export default function QuestionEditSection({ onClose }: QuestionEditSectionProp
    * 삭제 모드 완료 핸들러
    */
   const handleDeleteModeComplete = () => {
+    const hasChanged = !isEqual(originalQuestions, editingQuestions);
     const hasDeleted = questions.length < backupQuestions.length;
     setIsDeleteMode(false);
     setBackupQuestions([]);
 
     if (hasDeleted) {
       toast.success("삭제가 완료되었어요!");
     }
+
+    if (hasChanged) {
+      toast.success("수정이 완료되었어요!");
+    }
   };
 
   // 제출 완료 핸들러
@@ -237,6 +242,10 @@ export default function QuestionEditSection({ onClose }: QuestionEditSectionProp
       setRetrospectQuestions(editingQuestions);
     }
 
+    if (hasChanged) {
+      toast.success("수정이 완료되었어요!");
+    }
+
     onClose();
   };
 

apps/web/src/app/desktop/component/retrospectWrite/writeDialog/QuestionsOverview.tsx

@@ -34,12 +34,17 @@ export function QuestionsOverview({ isAnswerFilled, hasChanges, onSaveTemporary,
         display: flex;
         flex-direction: column;
         width: 29.4rem;
+        height: 100%;
       `}
     >
       <div
         css={css`
           border: 0.1rem solid ${DESIGN_TOKEN_COLOR.opacity8};
           border-radius: 1.8rem;
+          display: flex;
+          flex-direction: column;
+          flex: 1;
+          min-height: 0;
         `}
       >
         {/* -------- 질믄 전체보기 상단 UI------- */}
@@ -49,6 +54,7 @@ export function QuestionsOverview({ isAnswerFilled, hasChanges, onSaveTemporary,
             justify-content: space-between;
             align-items: center;
             padding: 1.6rem 1.6rem 0.8rem;
+            flex-shrink: 0;
           `}
         >
           <Typography variant="subtitle14Strong" color="gray800" as="p">
@@ -68,6 +74,9 @@ export function QuestionsOverview({ isAnswerFilled, hasChanges, onSaveTemporary,
         <ul
           css={css`
             padding: 0 0.8rem 0.8rem;
+            flex: 1;
+            overflow-y: auto;
+            min-height: 0;
           `}
         >
           {data?.questions.map((question, index) => {
@@ -121,6 +130,7 @@ export function QuestionsOverview({ isAnswerFilled, hasChanges, onSaveTemporary,
           display: flex;
           align-items: center;
           gap: 1.2rem;
+          flex-shrink: 0;
         `}
       >
         <button

apps/web/src/app/desktop/component/retrospectWrite/writeDialog/index.tsx

@@ -319,7 +319,7 @@ export function WriteDialog({ isOverviewVisible, handleToggleOverview }: WriteDi
           css={css`
             display: flex;
             flex: 1;
-            height: 100%;
+            min-height: 0;
             padding: 2.4rem 0 0 5.6rem;
           `}
         >

apps/web/src/assets/svgs/space/index.ts

@@ -31,3 +31,4 @@ export { default as ic_people_color } from "./ic_people_color.svg?react";
 export { default as icon_file_open } from "./icon_file_open.svg?react";
 export { default as ic_crown } from "./ic_crown.svg?react";
 export { default as ic_new_clock } from "./ic_new_clock.svg?react";
+export { default as ic_member } from "./ic_member.svg?react";