web/components: improve error handling in ak-search-select (#8228)

* unrelated: remove deprecated sentry tracing package since its in the main package

no of course this does not fix the circular import, sigh

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix syntax error in group view page

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* improve error handling in search-select

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* remove requiredness from flow input for invitation

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix dark theme for date and datetime input fields' picker button

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* update locale

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

---------

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens L
2024-01-18 23:24:52 +01:00
committed by GitHub
parent 02791e765f
commit 5be9d1fc6a
22 changed files with 402 additions and 241 deletions

View File

@ -1,12 +1,13 @@
import { APIErrorTypes, parseAPIError } from "@goauthentik/app/common/errors";
import { PreventFormSubmit } from "@goauthentik/app/elements/forms/helpers";
import { EVENT_REFRESH } from "@goauthentik/common/constants";
import { ascii_letters, digits, groupBy, randomString } from "@goauthentik/common/utils";
import { AKElement } from "@goauthentik/elements/Base";
import { CustomEmitterElement } from "@goauthentik/elements/utils/eventEmitter";
import { msg } from "@lit/localize";
import { msg, str } from "@lit/localize";
import { TemplateResult, html, render } from "lit";
import { customElement, property } from "lit/decorators.js";
import { customElement, property, state } from "lit/decorators.js";
import { styleMap } from "lit/directives/style-map.js";
import PFDropdown from "@patternfly/patternfly/components/Dropdown/dropdown.css";
@ -15,6 +16,8 @@ import PFFormControl from "@patternfly/patternfly/components/FormControl/form-co
import PFSelect from "@patternfly/patternfly/components/Select/select.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
import { ResponseError } from "@goauthentik/api";
type Group<T> = [string, T[]];
@customElement("ak-search-select")
@ -99,6 +102,9 @@ export class SearchSelect<T> extends CustomEmitterElement(AKElement) {
isFetchingData = false;
@state()
error?: APIErrorTypes;
static styles = [PFBase, PFForm, PFFormControl, PFSelect];
constructor() {
@ -139,15 +145,23 @@ export class SearchSelect<T> extends CustomEmitterElement(AKElement) {
return;
}
this.isFetchingData = true;
this.fetchObjects(this.query).then((objects) => {
objects.forEach((obj) => {
if (this.selected && this.selected(obj, objects || [])) {
this.selectedObject = obj;
}
this.fetchObjects(this.query)
.then((objects) => {
objects.forEach((obj) => {
if (this.selected && this.selected(obj, objects || [])) {
this.selectedObject = obj;
}
});
this.objects = objects;
this.isFetchingData = false;
})
.catch((exc: ResponseError) => {
this.isFetchingData = false;
this.objects = undefined;
parseAPIError(exc).then((err) => {
this.error = err;
});
});
this.objects = objects;
this.isFetchingData = false;
});
}
connectedCallback(): void {
@ -307,11 +321,19 @@ export class SearchSelect<T> extends CustomEmitterElement(AKElement) {
}
get renderedValue() {
// prettier-ignore
return (!this.objects) ? msg("Loading...")
: (this.selectedObject) ? this.renderElement(this.selectedObject)
: (this.blankable) ? this.emptyOption
: "";
if (this.error) {
return msg(str`Failed to fetch objects: ${this.error.detail}`);
}
if (!this.objects) {
return msg("Loading...");
}
if (this.selectedObject) {
return this.renderElement(this.selectedObject);
}
if (this.blankable) {
return this.emptyOption;
}
return "";
}
render(): TemplateResult {