Skip to content

Commit 9324183

Browse files
teawonteawon
authored
Merge pull request #19 from teawon/feat/add-history
History 기능 추가
2 parents 3f5016a + 589edc4 commit 9324183

4 files changed

Lines changed: 333 additions & 102 deletions

File tree

‎.changeset/fancy-squids-move.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"commitcrawler": minor
3+
---
4+
5+
히스토리 기능 추가

‎public/base.html‎

Lines changed: 124 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -369,88 +369,144 @@
369369
outline: none;
370370
border-color: #339af0;
371371
}
372+
.tab-header {
373+
display: flex;
374+
gap: 0;
375+
margin-bottom: 20px;
376+
border-bottom: 2px solid #e9ecef;
377+
background: #f8f9fa;
378+
}
379+
.tab-button {
380+
flex: 1;
381+
padding: 16px 0 12px 0;
382+
background: none;
383+
border: none;
384+
font-size: 16px;
385+
font-weight: 600;
386+
color: #868e96;
387+
cursor: pointer;
388+
border-bottom: 2px solid transparent;
389+
transition: color 0.2s, border-bottom 0.2s;
390+
display: flex;
391+
align-items: center;
392+
justify-content: center;
393+
gap: 8px;
394+
}
395+
.tab-button.active {
396+
color: #339af0;
397+
border-bottom: 2px solid #339af0;
398+
background: #fff;
399+
}
400+
.tab-button:focus {
401+
outline: none;
402+
}
372403
</style>
373404
</head>
374405
<body>
375406
<div class="container">
376407
<div class="editor-section">
377-
<div class="button-container">
378-
<div class="header">
379-
<button id="startButton" class="button">
380-
Commit 메세지 불러오기
381-
</button>
382-
<button
383-
id="toggleRegexButton"
384-
class="icon-button"
385-
title="정규식 설정"
386-
>
387-
<svg viewBox="0 0 24 24" width="20" height="20">
388-
<path
389-
d="M19.14,12.94c0.04-0.3,0.06-0.61,0.06-0.94c0-0.32-0.02-0.64-0.07-0.94l2.03-1.58c0.18-0.14,0.23-0.41,0.12-0.61 l-1.92-3.32c-0.12-0.22-0.37-0.29-0.59-0.22l-2.39,0.96c-0.5-0.38-1.03-0.7-1.62-0.94L14.4,2.81c-0.04-0.24-0.24-0.41-0.48-0.41 h-3.84c-0.24,0-0.43,0.17-0.47,0.41L9.25,5.35C8.66,5.59,8.12,5.92,7.63,6.29L5.24,5.33c-0.22-0.08-0.47,0-0.59,0.22L2.74,8.87 C2.62,9.08,2.66,9.34,2.86,9.48l2.03,1.58C4.84,11.36,4.8,11.69,4.8,12s0.02,0.64,0.07,0.94l-2.03,1.58 c-0.18,0.14-0.23,0.41-0.12,0.61l1.92,3.32c0.12,0.22,0.37,0.29,0.59,0.22l2.39-0.96c0.5,0.38,1.03,0.7,1.62,0.94l0.36,2.54 c0.05,0.24,0.24,0.41,0.48,0.41h3.84c0.24,0,0.44-0.17,0.47-0.41l0.36-2.54c0.59-0.24,1.13-0.56,1.62-0.94l2.39,0.96 c0.22,0.08,0.47,0,0.59-0.22l1.92-3.32c0.12-0.22,0.07-0.47-0.12-0.61L19.14,12.94z M12,15.6c-1.98,0-3.6-1.62-3.6-3.6 s1.62-3.6,3.6-3.6s3.6,1.62,3.6,3.6S13.98,15.6,12,15.6z"
390-
/>
391-
</svg>
392-
</button>
393-
</div>
394-
<div id="regexInputContainer" class="regex-input-container hidden">
395-
<div class="regex-inputs">
396-
<div class="input-wrapper">
397-
<label class="input-label" for="ticketRegexInput"
398-
>키 추출 정규식</label
399-
>
400-
<div class="input-group">
401-
<input
402-
type="text"
403-
id="ticketRegexInput"
404-
class="regex-input"
405-
placeholder="예: [A-Z]+-\d+"
408+
<div class="tab-header">
409+
<button id="tabMain" class="tab-button active">
410+
<span style="font-size: 18px">📝</span>커밋 추출
411+
</button>
412+
<button id="tabHistory" class="tab-button">
413+
<span style="font-size: 18px">📜</span>기록 보기
414+
</button>
415+
</div>
416+
<div id="mainSection">
417+
<div class="button-container">
418+
<div class="header">
419+
<button id="startButton" class="button">
420+
Commit 메세지 불러오기
421+
</button>
422+
<button
423+
id="toggleRegexButton"
424+
class="icon-button"
425+
title="정규식 설정"
426+
>
427+
<svg viewBox="0 0 24 24" width="20" height="20">
428+
<path
429+
d="M19.14,12.94c0.04-0.3,0.06-0.61,0.06-0.94c0-0.32-0.02-0.64-0.07-0.94l2.03-1.58c0.18-0.14,0.23-0.41,0.12-0.61 l-1.92-3.32c-0.12-0.22-0.37-0.29-0.59-0.22l-2.39,0.96c-0.5-0.38-1.03-0.7-1.62-0.94L14.4,2.81c-0.04-0.24-0.24-0.41-0.48-0.41 h-3.84c-0.24,0-0.43,0.17-0.47,0.41L9.25,5.35C8.66,5.59,8.12,5.92,7.63,6.29L5.24,5.33c-0.22-0.08-0.47,0-0.59,0.22L2.74,8.87 C2.62,9.08,2.66,9.34,2.86,9.48l2.03,1.58C4.84,11.36,4.8,11.69,4.8,12s0.02,0.64,0.07,0.94l-2.03,1.58 c-0.18,0.14-0.23,0.41-0.12,0.61l1.92,3.32c0.12,0.22,0.37,0.29,0.59,0.22l2.39-0.96c0.5,0.38,1.03,0.7,1.62,0.94l0.36,2.54 c0.05,0.24,0.24,0.41,0.48,0.41h3.84c0.24,0,0.44-0.17,0.47-0.41l0.36-2.54c0.59-0.24,1.13-0.56,1.62-0.94l2.39,0.96 c0.22,0.08,0.47,0,0.59-0.22l1.92-3.32c0.12-0.22,0.07-0.47-0.12-0.61L19.14,12.94z M12,15.6c-1.98,0-3.6-1.62-3.6-3.6 s1.62-3.6,3.6-3.6s3.6,1.62,3.6,3.6S13.98,15.6,12,15.6z"
406430
/>
407-
<button
408-
id="resetRegexButton"
409-
class="icon-button"
410-
title="기본값으로 초기화"
431+
</svg>
432+
</button>
433+
</div>
434+
<div id="regexInputContainer" class="regex-input-container hidden">
435+
<div class="regex-inputs">
436+
<div class="input-wrapper">
437+
<label class="input-label" for="ticketRegexInput"
438+
>키 추출 정규식</label
411439
>
412-
<svg viewBox="0 0 24 24" width="16" height="16">
413-
<path
414-
d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
415-
/>
416-
</svg>
417-
</button>
440+
<div class="input-group">
441+
<input
442+
type="text"
443+
id="ticketRegexInput"
444+
class="regex-input"
445+
placeholder="예: [A-Z]+-\d+"
446+
/>
447+
<button
448+
id="resetRegexButton"
449+
class="icon-button"
450+
title="기본값으로 초기화"
451+
>
452+
<svg viewBox="0 0 24 24" width="16" height="16">
453+
<path
454+
d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
455+
/>
456+
</svg>
457+
</button>
458+
</div>
418459
</div>
419-
</div>
420-
<div class="input-wrapper">
421-
<label class="input-label" for="cleanRegexInput"
422-
>접두사 제거 정규식</label
423-
>
424-
<div class="input-group">
425-
<input
426-
type="text"
427-
id="cleanRegexInput"
428-
class="regex-input"
429-
placeholder="예: feat:|fix:|refactor:"
430-
/>
431-
<button
432-
id="resetCleanRegexButton"
433-
class="icon-button"
434-
title="기본값으로 초기화"
460+
<div class="input-wrapper">
461+
<label class="input-label" for="cleanRegexInput"
462+
>접두사 제거 정규식</label
435463
>
436-
<svg viewBox="0 0 24 24" width="16" height="16">
437-
<path
438-
d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
439-
/>
440-
</svg>
441-
</button>
464+
<div class="input-group">
465+
<input
466+
type="text"
467+
id="cleanRegexInput"
468+
class="regex-input"
469+
placeholder="예: feat:|fix:|refactor:"
470+
/>
471+
<button
472+
id="resetCleanRegexButton"
473+
class="icon-button"
474+
title="기본값으로 초기화"
475+
>
476+
<svg viewBox="0 0 24 24" width="16" height="16">
477+
<path
478+
d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
479+
/>
480+
</svg>
481+
</button>
482+
</div>
442483
</div>
443484
</div>
444485
</div>
445486
</div>
446-
</div>
447-
<div id="messageList" class="message-list"></div>
448-
<div class="status-container">
449-
<div class="status-wrapper">
450-
<div class="status-checkbox">
451-
<input type="checkbox" id="summaryCheckbox" checked />
487+
<div id="messageList" class="message-list"></div>
488+
<div class="status-container">
489+
<div class="status-wrapper">
490+
<div class="status-checkbox">
491+
<input type="checkbox" id="summaryCheckbox" checked />
492+
</div>
493+
<div id="status" class="status"></div>
452494
</div>
453-
<div id="status" class="status"></div>
495+
</div>
496+
</div>
497+
<div id="historySection" style="display: none">
498+
<div class="history-list-container">
499+
<h3 style="margin-top: 0">복사 미리보기 기록</h3>
500+
<ul
501+
id="historyList"
502+
class="history-list"
503+
style="padding: 0; list-style: none"
504+
></ul>
505+
<div
506+
id="historyDetail"
507+
class="history-detail"
508+
style="display: none"
509+
></div>
454510
</div>
455511
</div>
456512
</div>

0 commit comments

Comments
 (0)