- var page_Title = 'Manage API';
- var form_validation       = true;
- var modal                 = true;
- var theme_customizer      = true;
- var sidebar               = true;
- var slick                 = true;
- var scrollbar             = true;
- var header_slider         = true;
- var select_dt             = true;
- var datatable             = true;
- var page_datatable        = true;
- var validation_modal      = true;
- var sweetalert2           = true;
- var trash_popup           = true;
- var copy_box              = true;

doctype html
html(lang='en')
  include ../../components/header-files
  body
    include ../../components/loader
    include ../../components/taptop
    // page-wrapper Start
    #pageWrapper.page-wrapper.compact-wrapper
      include ../../components/header
      // Page Body Start
      .page-body-wrapper
        include ../../components/sidebar
        .page-body
          .container.w-full
            .page-title
              .grid.grid-cols-12.mx-2.items-center
                div(class="col-span-6 sm:col-span-12")
                  h3 
                    | Manage API
                div(class="col-span-6 sm:col-span-12")
                  ol.breadcrumb.flex
                    li.breadcrumb-item
                      a(href='index.html')                                        
                        svg.stroke-icon
                          use(href='../assets/svg/icon-sprite.svg#stroke-home')
                    li.breadcrumb-item Pages
                    li.breadcrumb-item.active Manage API
          // Container-fluid starts
          .container.api-manage
            .grid.grid-cols-12 
              div(class="col-span-12") 
                .card.relative
                  .card-header.card-no-border.text-end
                    .card-header-right-icon.text-right
                      a.btn.btn-primary.font-medium.text-white.inline-block(href="#!" data-bs-toggle='modal' data-bs-target='#apiManagement' class="hover:text-white")
                        i.fa-solid.fa-plus.pe-2
                        | Add
                  .card-body.pt-0(class="!px-0")
                    .api-management
                      .recent-table.overflow-x-auto.custom-scrollbar
                        table#api-manage-table.table
                          thead 
                            tr 
                              th
                              th 
                                span.c-o-light.font-semibold API Name
                              th 
                                span.c-o-light.font-semibold API Key 
                              th 
                                span.c-o-light.font-semibold Status
                              th 
                                span.c-o-light.font-semibold Action
                          tbody 
                            tr.product-removes.inbox-data
                              td
                              td 
                                span International Flight Tracking API
                              td 
                                .common-f-start
                                  span.copied-api 9b78c5a1-f4e9-4b3d-a8ef-13b9e6ad48a2
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Comprehensive StockMarket Data API
                              td 
                                .common-f-start
                                  span.copied-api e5f8d9a1-3b7c-4d6a-a8e4-9c2d1b3e8f4a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Detailed Movie Information Ratings API
                              td 
                                .common-f-start
                                  span.copied-api d8e1b7a4-0c6d-4b3f-9a8e-3b9d2e7f1c5a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") GeoLocation Mapping API
                              td 
                                .common-f-start
                                  span.copied-api a3f9e8b1-4c6d-4d2f-8b1e-9a4d6e8f3b0a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Weather Forecasting Monitoring API
                              td
                                .common-f-start
                                  span.copied-api a4f1b0a9-cfd6-4f5b-ae31-3e8a1b6e5d22
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Cryptocurrency Price Tracking API
                              td
                                .common-f-start
                                  span.copied-api d9b1f4e8-3a6d-4c2f-8e7b-1d5c9e3b2f4a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Book Search Information API
                              td
                                .common-f-start
                                  span.copied-api e9f1d8b4-9a6c-4f7d-8e2b-3a1d7c9b5f8e
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span Music Streaming Metadata API
                              td
                                .common-f-start
                                  span.copied-api f7b8c3e1-0d6a-4c9b-8e1f-9b4d2a3f7c5e
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Seismic Data on Earthquake Activity API
                              td
                                .common-f-start
                                  span.copied-api d3e7a8b9-5c1d-4f2b-9e3a-1b6f9d4e8c2a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Route Optimization for Traffic Conditions API
                              td
                                .common-f-start
                                  span.copied-api e4a9f1b3-2c8d-4d6e-8b7a-3c1f5e9b4d7a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Global Property Listings / Appraisal Services API
                              td
                                .common-f-start
                                  span.copied-api c7f8a1d9-5b2d-4c3e-9a6f-2e4d9b1c7f8a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Comprehensive Reviews of Restaurant Searches API
                              td
                                .common-f-start
                                  span.copied-api e9b2f1a8-7d3c-4e6b-9a1d-4c8b3f7a2d9e
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Statistics for Sports Scores API
                              td
                                .common-f-start
                                  span.copied-api a2e9b1d7-9c6d-4f3b-8e1a-6f4d3b7e2c5a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Booking and Planning Travel Itineraries API
                              td
                                .common-f-start
                                  span.copied-api b3f1c8a2-0d7e-4c2b-9a6f-1d8b9e3f5c7a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Image Identification and Processing API
                              td
                                .common-f-start
                                  span.copied-api c4a9e7b1-1d6c-4f3e-9b8a-2e7d1c5b8f3a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Voice Synthesis using Voice Recognition API
                              td
                                .common-f-start
                                  span.copied-api d5c3b8f1-2e7a-4d6b-8a9c-3f4e9d1a5c7e
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Virtual Reality Integration API
                              td
                                .common-f-start
                                  span.copied-api e6b9a1c4-3d8e-4f2b-9c7a-1d9f3e5b7c6a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Alert System for Natural Disasters API
                              td
                                .common-f-start
                                  span.copied-api b8f1e4c7-6d9b-4f3a-8e1d-2c5a9d3e7b4a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-danger Inactive
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Global Financial Market Analytics API
                              td
                                .common-f-start
                                  span.copied-api c9a1b7e2-5d4f-4b8c-9e3a-1f7d2c6b5e4a
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
                            tr.product-removes.inbox-data
                              td
                              td 
                                span(class="[@media(max-width:1310px)_and_(min-width:992px)]:!line-clamp-[1]") Energy Use Efficiency Tracking API
                              td
                                .common-f-start
                                  span.copied-api d7c1f8e5-2b9a-4d3f-8e1d-6a9f3c2b4e5d
                                  .square-l-white
                                    i.fa-solid.fa-copy.copy-btn
                              td  
                                span.badge.badge-light-success Active
                              td 
                                .common-align.gap-2.justify-start 
                                  a.square-white(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#edit-content")
                                  a.square-white.trash-4(href="#!")
                                    svg
                                      use(href="../assets/svg/icon-sprite.svg#trash1")
            //-  Modal
            #apiManagement.modal.fade(tabindex='-1' aria-labelledby='apiManagement' aria-hidden='true')
              .modal-dialog.modal-dialog-centered.modal-md
                  .modal-content.category-popup
                      .modal-header
                          h5.modal-title ADD API
                          button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
                      .modal-body.p-0.custom-input
                          .text-start
                            .p-5
                              form.grid.grid-cols-12.gap-3.needs-validation(novalidate='')
                                div(class="col-span-12")
                                  label.form-label(for='validationAPIName') API Name
                                    span.txt-danger *
                                  input#validationAPIName.form-control(type='text' placeholder='Enter your API name' required='')
                                  .invalid-feedback 
                                    | Please enter a API name.
                                  .valid-feedback
                                    | Looks good!
                                div(class="col-span-12")
                                  label.form-label(for='validationAPIKey') API Key
                                    span.txt-danger *
                                  input#validationAPIKey.form-control(type='text' placeholder='3e4a9461-cb9b-4179-91be-2bf4998461d6' required='')
                                  .invalid-feedback 
                                    | Please enter a API Key.
                                  .valid-feedback
                                    | Looks good!
                                div(class="col-span-12").flex.justify-end
                                  button.btn.btn-primary.text-white(type='submit') Create +          
          // Container-fluid Ends
        include ../../components/footer
    include ../../components/footer-files
