<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
</head>

<body>
<aside class="pt-sidebar border" th:fragment="collectionFragment" style="min-width: 200px;">
    <div class="p-1">
        <button type="button" class="btn btn-primary btn-sm" id="new_collection"><i class="fa fa-plus"></i>새 컬렉션</button>
        <button type="button" class="btn btn-primary btn-sm" id="new_request"><i class="fa fa-plus"></i>새 요청</button>
    </div>
    <div class="collapse pt-links" aria-label="sidebar menu">
        <ul class="list-unstyled mb-0 py-3 pt-md-1" id="side_menubar">
        </ul>
    </div>
    <div class="modal fade" id="new_collection_modal" tabindex="-1" aria-labelledby="new_collection_modal" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">새로운 컬렉션 추가</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <input type="text" id="new_collection_name" class="form-control" placeholder="이름을 입력하세요" aria-label="이름을 입력하세요" name="collection_name" required/>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                    <button type="button" class="btn btn-primary save_collection">저장</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="edit_name_modal" tabindex="-1" aria-labelledby="edit_name_modal" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">새로운 이름</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <input type="text" class="form-control" placeholder="이름을 입력하세요" aria-label="이름을 입력하세요" name="name" required/>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                    <button type="button" class="btn btn-primary change_name">저장</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="confirm_delete_modal" tabindex="-1" aria-labelledby="confirm_delete_modal" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">컬렉션 삭제</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div>삭제 하시겠습니까?</div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                    <button type="button" class="btn btn-primary confirm_delete">삭제</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="confirm_delete_api_modal" tabindex="-1" aria-labelledby="confirm_delete_api_modal" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">API 삭제</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div>삭제 하시겠습니까?</div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                    <button type="button" class="btn btn-primary confirm_delete_api">삭제</button>
                </div>
            </div>
        </div>
    </div>
</aside>

<!-- menu script -->
<th:block th:fragment="collectionScript">
    <script th:inline="javascript">
    </script>
</th:block>
</body>

</html>
