Skip to content

feat: 슬랙 채널 연결 안내 정보 추가 #58

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
eheka78 merged 2 commits into from
Jun 22, 2026
Merged

feat: 슬랙 채널 연결 안내 정보 추가 #58

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a010c1f
feat: 슬랙 채널 연결 안내 정보 추가
eheka78 Jun 22, 2026
d2c89e7
Merge branch 'cc-team-8:main' into main
eheka78 Jun 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 61 additions & 1 deletion client/src/pages/dashboard/settings/SettingsPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ export default function SettingsPage() {
// 숫자 입력 편집 중 임시 문자열 — 빈 값·소수점 중간 입력을 허용하기 위함
const [numDraft, setNumDraft] = useState<Record<string, string>>({});
const [showPenaltyInfo, setShowPenaltyInfo] = useState(false);
const [showSlackInfo, setShowSlackInfo] = useState(false);
const [deleteModalOpen, setDeleteModalOpen] = useState(false);
const [deleteConfirmName, setDeleteConfirmName] = useState("");
const [deleting, setDeleting] = useState(false);
Expand Down Expand Up @@ -1039,7 +1040,66 @@ export default function SettingsPage() {
{isLeader && settings && (
<>
<div className="field">
<label className="field-label">워크스페이스 연결</label>
<label
className="field-label"
style={{ display: "flex", alignItems: "center", gap: 5 }}
>
워크스페이스 연결
<span
style={{
position: "relative",
display: "inline-flex",
alignItems: "center",
}}
onMouseEnter={() => setShowSlackInfo(true)}
onMouseLeave={() => setShowSlackInfo(false)}
>
<i
className="ti ti-info-circle"
style={{
fontSize: 15,
color: "var(--text-soft)",
cursor: "default",
}}
/>
{showSlackInfo && (
<div
style={{
position: "absolute",
top: "calc(100% + 6px)",
left: 0,
background: "var(--surface-2)",
border: "1px solid var(--border-2)",
borderRadius: 10,
padding: "10px 12px",
fontSize: 12,
color: "var(--text-soft)",
lineHeight: 1.7,
whiteSpace: "nowrap",
zIndex: 100,
boxShadow: "0 4px 12px rgba(0,0,0,.12)",
}}
>
슬랙 채널 ID를 입력하고 저장 버튼을 누른 뒤,
<br />
Add to Slack을 눌러서 원하는 워크스페이스에 연결하세요.
<br />
이후 원하는 채널에서{" "}
<code
style={{
background: "var(--surface-3)",
borderRadius: 4,
padding: "1px 5px",
fontFamily: "monospace",
}}
>
/invite @무임하차
</code>
를 입력하면 봇을 초대할 수 있습니다.
</div>
)}
</span>
</label>
{settings.slack_bot_token ? (
<div style={{ display: "flex", gap: 8 }}>
<div
Expand Down
Loading