feat(integrations): support GitHub repositories and enhance repo browser UI

Add GitHub repository support to integrations and update related tests. Implement server-side GitHub API calls and normalize GitHub base URLs. Improve the repository browser UI with compact tabs and updated icons. Add a custom, accessible scrollbar with pointer and keyboard support. - Add paging, auth headers, and error handling when listing GitHub repos. - Default GitHub token username to "x-access-token" when saving credentials. - Introduce compact repo tab styles, new icons, and a draggable scrollbar.
2026-08-29 23:55:27 +02:00
parent 91263547db
commit c242a72edd
9 changed files with 414 additions and 34 deletions
@@ -8839,3 +8839,135 @@ input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in s
  .cred-footer { align-items: stretch; flex-direction: column; }
  .cred-btns { display: grid; grid-template-columns: 1fr 1fr; }
 }
+
+/* Compact repository strip, matching the reference's IDE-style tab chrome. */
+.repo-tabbar {
+  display: flex;
+  align-items: stretch;
+  min-height: 36px;
+  height: 36px;
+  padding: 0;
+  border: 0;
+  border-bottom: 1px solid var(--color-border-subtle);
+  border-radius: 0;
+  overflow: hidden;
+}
+
+.repo-tabs-scroll {
+  flex: 0 1 auto;
+  min-height: 35px;
+  min-width: 0;
+  border-left: 1px solid var(--color-border-subtle);
+  scrollbar-width: none;
+}
+
+.repo-tabs-scroll::-webkit-scrollbar { display: none; }
+
+.repo-tab-wrap {
+  flex: 0 0 auto;
+  min-width: 0;
+  max-width: 260px;
+  min-height: 35px;
+  border-right: 1px solid var(--color-border-subtle);
+  border-radius: 0;
+}
+
+.repo-tab {
+  min-height: 35px;
+  height: 35px;
+  padding: 0 31px 0 15px;
+  gap: 6px;
+  font-size: 12.5px;
+  font-weight: 650;
+  letter-spacing: 0;
+}
+
+.repo-tab.management {
+  flex: 0 0 38px;
+  width: 38px;
+  min-width: 38px;
+  height: 35px;
+  min-height: 35px;
+  padding: 0;
+  justify-content: center;
+  border: 0;
+  box-shadow: none;
+}
+
+.repo-tab-wrap.active,
+.repo-tab.management.active {
+  box-shadow: none;
+}
+
+.repo-tab-close {
+  position: absolute;
+  top: 8px;
+  right: 6px;
+  width: 19px;
+  min-width: 19px;
+  max-width: 19px;
+  height: 19px;
+  min-height: 19px;
+  max-height: 19px;
+  margin: 0;
+  border-radius: 2px;
+  color: var(--color-ink-faint);
+  background: transparent;
+  opacity: 0.62;
+}
+
+.repo-tab-wrap.active .repo-tab-close { opacity: 0.72; }
+.repo-tab-wrap:hover .repo-tab-close,
+.repo-tab-wrap:focus-within .repo-tab-close { opacity: 1; }
+.repo-tab-close:hover:not(:disabled),
+.repo-tab-close:focus-visible:not(:disabled) {
+  color: #e1848b;
+  background: transparent;
+}
+
+.repo-tab-add {
+  flex: 0 0 38px;
+  width: 38px;
+  min-width: 38px;
+  height: 35px;
+  min-height: 35px;
+  border-left: 1px solid var(--color-border-subtle);
+}
+
+:root:not([data-theme="light"]) .repo-tabbar {
+  border-bottom-color: #41454c;
+  background: #2b2e34;
+  box-shadow: inset 0 -1px 0 #23262b;
+}
+
+:root:not([data-theme="light"]) .repo-tabs-scroll {
+  border-left-color: #454950;
+}
+
+:root:not([data-theme="light"]) .repo-tab-wrap,
+:root:not([data-theme="light"]) .repo-tab.management,
+:root:not([data-theme="light"]) .repo-tab-add {
+  border-color: #454950;
+  color: #9ca1a9;
+  background: #2b2e34;
+}
+
+:root:not([data-theme="light"]) .repo-tab-wrap:hover,
+:root:not([data-theme="light"]) .repo-tab.management:hover:not(:disabled),
+:root:not([data-theme="light"]) .repo-tab-add:hover:not(:disabled) {
+  color: #d7dae0;
+  background: #32363d;
+}
+
+:root:not([data-theme="light"]) .repo-tab-wrap.active,
+:root:not([data-theme="light"]) .repo-tab.management.active {
+  color: #d7dae0;
+  background: #30343a;
+  box-shadow: inset 0 -1px 0 #30343a;
+}
+
+:root:not([data-theme="light"]) .repo-tab-wrap.active .repo-tab,
+:root:not([data-theme="light"]) .repo-tab-wrap.active .repo-tab > svg,
+:root:not([data-theme="light"]) .repo-tab.management.active > svg {
+  color: #d7dae0;
+}