mirror of
https://github.com/AutoMaker-Org/automaker.git
synced 2026-03-19 22:53:08 +00:00
Improve pull request flow, add branch selection for worktree creation, fix auto-mode concurrency count (#787)
* Changes from fix/fetch-before-pull-fetch * feat: Improve pull request flow, add branch selection for worktree creation, fix for automode concurrency count * feat: Add validation for remote names and improve error handling * Address PR comments and mobile layout fixes * ``` refactor: Extract PR target resolution logic into dedicated service ``` * feat: Add app shell UI and improve service imports. Address PR comments * fix: Improve security validation and cache handling in git operations * feat: Add GET /list endpoint and improve parameter handling * chore: Improve validation, accessibility, and error handling across apps * chore: Format vite server port configuration * fix: Add error handling for gh pr list command and improve offline fallbacks * fix: Preserve existing PR creation time and improve remote handling
This commit is contained in:
gsxdsm
@@ -72,30 +72,169 @@
|
||||
height: 100dvh;
|
||||
overflow: hidden;
|
||||
}
|
||||
/* Inline app shell: shows logo + spinner while JS bundle downloads.
|
||||
On slow mobile networks the bundle can take 2-5s; this eliminates
|
||||
the blank screen and gives immediate visual feedback.
|
||||
React's createRoot().render() replaces #app's innerHTML, removing this. */
|
||||
.app-shell {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
gap: 24px;
|
||||
opacity: 1;
|
||||
}
|
||||
.app-shell-logo {
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
opacity: 0.9;
|
||||
}
|
||||
/* Default (dark): light spinner + logo strokes */
|
||||
.app-shell-spinner {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: 2px solid rgba(255, 255, 255, 0.1);
|
||||
border-top-color: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 50%;
|
||||
animation: shell-spin 0.8s linear infinite;
|
||||
}
|
||||
.app-shell-logo-stroke {
|
||||
stroke: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
.app-shell-logo-bg {
|
||||
fill: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
/* Light themes: dark spinner + logo strokes.
|
||||
The theme script below sets data-theme-type="light" on <html> for any light
|
||||
theme, so future theme additions only need to update the script — not CSS. */
|
||||
html[data-theme-type='light'] .app-shell-spinner {
|
||||
border-color: rgba(0, 0, 0, 0.08);
|
||||
border-top-color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
html[data-theme-type='light'] .app-shell-logo-stroke {
|
||||
stroke: rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
html[data-theme-type='light'] .app-shell-logo-bg {
|
||||
fill: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
/* System light preference when no theme class is applied yet */
|
||||
@media (prefers-color-scheme: light) {
|
||||
html:not([class]) .app-shell-spinner {
|
||||
border-color: rgba(0, 0, 0, 0.08);
|
||||
border-top-color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
html:not([class]) .app-shell-logo-stroke {
|
||||
stroke: rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
html:not([class]) .app-shell-logo-bg {
|
||||
fill: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
@keyframes shell-spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
// Prevent theme flash - apply stored theme before React hydrates
|
||||
(function () {
|
||||
try {
|
||||
var stored = localStorage.getItem('automaker-storage');
|
||||
if (stored) {
|
||||
var data = JSON.parse(stored);
|
||||
var theme = data.state?.theme;
|
||||
if (theme && theme !== 'system' && theme !== 'light') {
|
||||
document.documentElement.classList.add(theme);
|
||||
} else if (
|
||||
theme === 'system' &&
|
||||
window.matchMedia('(prefers-color-scheme: dark)').matches
|
||||
) {
|
||||
document.documentElement.classList.add('dark');
|
||||
// Primary key used by current builds for pre-React theme persistence.
|
||||
var theme = localStorage.getItem('automaker:theme');
|
||||
|
||||
// Backward compatibility: older builds stored theme in the Zustand blob.
|
||||
if (!theme) {
|
||||
var stored = localStorage.getItem('automaker-storage');
|
||||
if (stored) {
|
||||
var data = JSON.parse(stored);
|
||||
theme = data?.state?.theme || data?.theme || null;
|
||||
}
|
||||
}
|
||||
|
||||
// Light theme names — kept in sync with the background-color rule above.
|
||||
// Adding a new light theme only requires updating this array.
|
||||
var lightThemes = [
|
||||
'light',
|
||||
'cream',
|
||||
'solarizedlight',
|
||||
'github',
|
||||
'paper',
|
||||
'rose',
|
||||
'mint',
|
||||
'lavender',
|
||||
'sand',
|
||||
'sky',
|
||||
'peach',
|
||||
'snow',
|
||||
'sepia',
|
||||
'gruvboxlight',
|
||||
'nordlight',
|
||||
'blossom',
|
||||
'ayu-light',
|
||||
'onelight',
|
||||
'bluloco',
|
||||
'feather',
|
||||
];
|
||||
|
||||
if (theme && theme !== 'system') {
|
||||
// Apply the stored theme class directly (covers 'light', 'dark', and
|
||||
// all named themes like 'cream', 'nord', etc.)
|
||||
document.documentElement.classList.add(theme);
|
||||
if (lightThemes.indexOf(theme) !== -1) {
|
||||
document.documentElement.setAttribute('data-theme-type', 'light');
|
||||
}
|
||||
} else if (
|
||||
theme === 'system' &&
|
||||
window.matchMedia('(prefers-color-scheme: dark)').matches
|
||||
) {
|
||||
document.documentElement.classList.add('dark');
|
||||
} else if (
|
||||
theme === 'system' &&
|
||||
window.matchMedia('(prefers-color-scheme: light)').matches
|
||||
) {
|
||||
document.documentElement.setAttribute('data-theme-type', 'light');
|
||||
}
|
||||
// Detect PWA standalone mode early so CSS can apply reduced bottom safe-area
|
||||
// before first paint, preventing a layout shift on notched devices.
|
||||
if (
|
||||
window.matchMedia('(display-mode: standalone)').matches ||
|
||||
navigator.standalone === true
|
||||
) {
|
||||
document.documentElement.setAttribute('data-pwa', 'standalone');
|
||||
}
|
||||
} catch (e) {}
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
<body class="antialiased">
|
||||
<div id="app"></div>
|
||||
<div id="app">
|
||||
<!-- Inline app shell: renders instantly while JS downloads on slow mobile networks.
|
||||
React's createRoot().render() replaces this content automatically. -->
|
||||
<div class="app-shell">
|
||||
<svg
|
||||
class="app-shell-logo"
|
||||
viewBox="0 0 256 256"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<rect class="app-shell-logo-bg" x="16" y="16" width="224" height="224" rx="56" />
|
||||
<g
|
||||
class="app-shell-logo-stroke"
|
||||
fill="none"
|
||||
stroke-width="20"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M92 92 L52 128 L92 164" />
|
||||
<path d="M144 72 L116 184" />
|
||||
<path d="M164 92 L204 128 L164 164" />
|
||||
</g>
|
||||
</svg>
|
||||
<div class="app-shell-spinner" role="status" aria-label="Loading…"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="/src/renderer.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user