added view query sample loading indicator

This commit is contained in:
Gani Georgiev
2026-04-22 16:04:57 +03:00
parent 866b8b8029
commit 83e44a7cfb
6 changed files with 24 additions and 8 deletions

View File

@@ -1,11 +1,13 @@
## v0.37.3
- Fixed 0 total count on page back/forward navigation.
- Enabled text wrapping for the API rule fileds.
- Fixed total count load on page back/forward navigation.
- Fixed `editor` floating dialogs position when scrolling ([#7653](https://github.com/pocketbase/pocketbase/issues/7653)).
- Enabled text wrapping for the API rule fields.
- Added view query sample loading indicator.
- Other minor light UI contrast and styles improvements.

View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

4
ui/dist/index.html vendored
View File

@@ -13,9 +13,9 @@
<!-- prism -->
<script src="./libs/prism/prism.js" data-manual></script>
<script type="module" crossorigin src="./assets/index-CRAjAtnU.js"></script>
<script type="module" crossorigin src="./assets/index-CFYkmcdC.js"></script>
<link rel="modulepreload" crossorigin href="./assets/pocketbase.es-B_4DUNUU.js">
<link rel="stylesheet" crossorigin href="./assets/index-DWSRRo-V.css">
<link rel="stylesheet" crossorigin href="./assets/index-BsxX9wuy.css">
</head>
<body>
</body>

View File

@@ -171,9 +171,13 @@ export function collectionViewQueryTab(upsertData) {
),
t.div(
{ className: "col-12" },
t.p({ className: "txt-sm txt-bold" }, "Sample output:"),
t.p(
{ className: "txt-sm txt-bold" },
"Sample output:",
),
t.div(
{ className: "view-query-sample-wrapper" },
t.span({ hidden: () => !local.isTesting, className: "loader sm" }),
app.components.codeBlock({
language: () => local.testError ? "plain" : "js",
className: () => `view-query-sample ${local.testError ? "txt-danger" : ""}`,

View File

@@ -88,7 +88,17 @@
padding: var(--smSpacing);
}
.view-query-sample-wrapper {
position: relative;
.loader {
position: absolute;
z-index: 1;
right: 10px;
top: 10px;
}
}
.view-query-sample code {
z-index: 0;
max-height: 300px;
background: none;
border: 1px solid var(--surfaceAlt2Color);