diff --git a/components/agenda/Profile/HistoryList.tsx b/components/agenda/Profile/HistoryList.tsx
index cf98bb192..e9110f459 100644
--- a/components/agenda/Profile/HistoryList.tsx
+++ b/components/agenda/Profile/HistoryList.tsx
@@ -5,6 +5,8 @@ import {
} from 'types/agenda/profile/historyListTypes';
import AgendaTags from 'components/agenda/utils/AgendaTags';
import { countHistoryCoalitions } from 'components/agenda/utils/coalition/countCoalitions';
+import ColorList from 'components/agenda/utils/ColorList';
+import TeamIcon from 'public/image/agenda/rock-and-roll-hand.svg';
import TimeIcon from 'public/image/agenda/Time.svg';
import styles from 'styles/agenda/Profile/HistoryList.module.scss';
@@ -68,6 +70,41 @@ const HistoryList = ({ historyListData }: HistoryListProps) => {
{timeString}
+ {/* Team 정보 UI / host 경우 ❌ */}
+ {historyTeamMates && historyTeamMates.length > 0 ? (
+ <>
+
+
+
+ {historyData.teamName}
+
+
+
+
+
+
+
+ {/* intra id mapping */}
+
+ {historyTeamMates.map((mate, index) => (
+
+ {mate.intraId}
+
+ ))}
+
+
+
+ {/* coalition color mapping */}
+
+
+
+ >
+ ) : null}
);
}
diff --git a/components/agenda/utils/AgendaTags.tsx b/components/agenda/utils/AgendaTags.tsx
index 582bfc1e7..f14e8a618 100644
--- a/components/agenda/utils/AgendaTags.tsx
+++ b/components/agenda/utils/AgendaTags.tsx
@@ -3,7 +3,15 @@ import { AgendaLocation, AgendaStatus } from 'constants/agenda/agenda';
import { DefaultTag } from 'components/agenda/utils/AgendaTag';
import styles from 'styles/agenda/utils/AgendaTag.module.scss';
-const AgendaTags = (data: AgendaDataProps) => {
+interface TagProps {
+ agendaStatus?: AgendaStatus;
+ agendaLocation: AgendaLocation;
+ isOfficial: boolean;
+ agendaMaxPeople: number;
+ isRanking?: boolean;
+}
+
+const AgendaTags = (data: TagProps) => {
const statusToTagName: Record = {
[AgendaStatus.CANCEL]: '취소',
[AgendaStatus.OPEN]: '모집중',
@@ -16,15 +24,15 @@ const AgendaTags = (data: AgendaDataProps) => {
[AgendaLocation.MIX]: '전국',
};
- const status = statusToTagName[data.agendaStatus];
+ const status = data.agendaStatus ? statusToTagName[data.agendaStatus] : '';
const location = LocationToTagName[data.agendaLocation];
const tags = [
data.isOfficial ? '공식' : '비공식',
data.agendaMaxPeople === 1 ? '개인' : '팀',
data.isRanking ? '대회' : null,
- status,
location,
].filter(Boolean);
+ status && tags.push(status);
return (
diff --git a/styles/agenda/Profile/CurrentList.module.scss b/styles/agenda/Profile/CurrentList.module.scss
index 03f36d8d9..6bdb6953d 100644
--- a/styles/agenda/Profile/CurrentList.module.scss
+++ b/styles/agenda/Profile/CurrentList.module.scss
@@ -14,6 +14,10 @@
.currentItemWrapper {
width: 100%;
@media screen and (min-width: 961px) {
- max-width: 22rem;
+ width: 48%;
}
}
+
+.currentItemWrapper:first-child:last-child {
+ width: 100% !important;
+}
diff --git a/styles/agenda/Profile/HistoryList.module.scss b/styles/agenda/Profile/HistoryList.module.scss
index 014fba75f..0e65a2353 100644
--- a/styles/agenda/Profile/HistoryList.module.scss
+++ b/styles/agenda/Profile/HistoryList.module.scss
@@ -15,7 +15,6 @@
.historyItem {
display: flex;
width: 100%;
- max-width: 22rem;
height: auto;
flex-direction: column;
padding: 1rem;
@@ -27,6 +26,13 @@
justify-content: flex-start;
align-items: flex-start;
gap: 0.5rem;
+ @media screen and (min-width: 1401px) {
+ width: 48%;
+ }
+}
+
+.historyItem:first-child:last-child {
+ width: 100% !important;
}
.agendaTitle {
@@ -56,3 +62,30 @@
width: 0.8rem;
height: 0.8rem;
}
+
+.divider {
+ width: 100%;
+}
+
+.teamName {
+ @include text(tab);
+}
+
+.teamIntraIdWrapper {
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+ @include text(description-s);
+
+ .intraIdWrapper {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ }
+}
+
+.coalitionWrapper {
+ display: flex;
+ width: 100%;
+ height: 1rem;
+}
diff --git a/types/agenda/profile/historyListTypes.ts b/types/agenda/profile/historyListTypes.ts
index 51931e58f..1e8a63333 100644
--- a/types/agenda/profile/historyListTypes.ts
+++ b/types/agenda/profile/historyListTypes.ts
@@ -1,10 +1,12 @@
+import { AgendaLocation } from 'constants/agenda/agenda';
+
export interface HistoryItemProps {
agendaId: string;
agendaTitle: string;
agendaStartTime: string;
agendaEndTime: string;
agendaCurrentTeam: number;
- agendaLocation: string;
+ agendaLocation: AgendaLocation;
teamKey: string;
isOfficial: boolean;
agendaMaxPeople: number;