better error toast (#406)

This commit is contained in:
BlowaterNostr 2024-03-15 23:18:36 +08:00 committed by GitHub
parent 2947fbdf1d
commit 1f98d7f66a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 46 additions and 36 deletions

View File

@ -48,7 +48,7 @@ import { HidePopOver } from "./components/popover.tsx";
import { Social_Model } from "./channel-container.tsx";
import { DM_Model } from "./dm.tsx";
import { SyncEvent } from "./message-panel.tsx";
import { ToastChannel } from "./components/toast.tsx";
import { SendingEventRejection, ToastChannel } from "./components/toast.tsx";
import { LinkColor } from "./style/colors.ts";
export type UI_Interaction_Event =
@ -225,26 +225,9 @@ export async function* UI_Interaction_Update(args: {
).then((res) => {
if (res instanceof Error) {
console.error(res);
app.toastInputChan.put(() => (
<div
class="hover:cursor-pointer"
onClick={() => {
eventBus.emit({
type: "ViewRelayDetail",
url: current_relay.url,
});
}}
>
sending message is rejected
<div>reason: {res.message}</div>
<div>please contact the admin of relay</div>
<div
class={`text-[${LinkColor}] hover:underline`}
>
{current_relay.url}
</div>
</div>
));
app.toastInputChan.put(
SendingEventRejection(eventBus.emit, current_relay.url, res.message),
);
}
});
} else if (event.type == "UpdateMessageFiles") {
@ -258,6 +241,8 @@ export async function* UI_Interaction_Update(args: {
else if (event.type == "SaveProfile") {
if (current_relay.status() != "Open") {
app.toastInputChan.put(() => `${current_relay.url} is not connected yet`);
} else if (event.profile == undefined) {
app.toastInputChan.put(() => "profile is empty");
} else {
const result = await saveProfile(
event.profile,
@ -266,7 +251,9 @@ export async function* UI_Interaction_Update(args: {
);
app.popOverInputChan.put({ children: undefined });
if (result instanceof Error) {
app.toastInputChan.put(() => result.message);
app.toastInputChan.put(
SendingEventRejection(eventBus.emit, current_relay.url, result.message),
);
} else {
app.toastInputChan.put(() => "profile has been updated");
}

View File

@ -1,9 +1,11 @@
/** @jsx h */
import { Component, ComponentChildren } from "https://esm.sh/preact@10.17.1";
import { h } from "https://esm.sh/preact@10.17.1";
import { PrimaryBackgroundColor, PrimaryTextColor } from "../style/colors.ts";
import { LinkColor, PrimaryBackgroundColor, PrimaryTextColor } from "../style/colors.ts";
import { Channel, sleep } from "https://raw.githubusercontent.com/BlowaterNostr/csp/master/csp.ts";
import { setState } from "../_helper.ts";
import { emitFunc } from "../../event-bus.ts";
import { ViewRelayDetail } from "../setting.tsx";
export type ToastChannel = Channel<() => ComponentChildren>;
@ -44,3 +46,24 @@ export class Toast extends Component<Props, State> {
);
}
}
export const SendingEventRejection = (emit: emitFunc<ViewRelayDetail>, url: string, reason: string) => () => (
<div
class="hover:cursor-pointer"
onClick={() => {
emit({
type: "ViewRelayDetail",
url: url,
});
}}
>
sending message is rejected
<div>reason: {reason}</div>
<div>please contact the admin of relay</div>
<div
class={`text-[${LinkColor}] hover:underline`}
>
{url}
</div>
</div>
);

View File

@ -26,7 +26,7 @@ import { robohash } from "./relay-detail.tsx";
export type SaveProfile = {
type: "SaveProfile";
profile: ProfileData;
profile: ProfileData | undefined;
ctx: NostrAccountContext;
};
@ -129,10 +129,6 @@ export class EditProfile extends Component<Props, State> {
};
onSubmit = () => {
if (!this.state.profile) {
return;
}
this.props.emit({
type: "SaveProfile",
ctx: this.props.ctx,

View File

@ -60,13 +60,13 @@ export class Editor extends Component<EditorProps, EditorState> {
files: [],
};
componentWillReceiveProps(nextProps: Readonly<EditorProps>) {
if (!isMobile()) {
componentWillReceiveProps() {
if (!isMobile() && this.textareaElement.current) {
this.textareaElement.current.focus();
}
}
textareaElement = createRef();
textareaElement = createRef<HTMLTextAreaElement>();
sendMessage = async () => {
const props = this.props;
@ -75,7 +75,7 @@ export class Editor extends Component<EditorProps, EditorState> {
files: this.state.files,
text: this.state.text,
});
this.textareaElement.current.setAttribute(
this.textareaElement.current?.setAttribute(
"rows",
"1",
);

View File

@ -79,7 +79,7 @@ export class RelaySwitchList extends Component<RelaySwitchListProps, RelaySwitch
<input
type="text"
class="flex-grow border rounded-lg mx-2 my-1 px-2"
placeholder="Search relay"
placeholder="filter relays"
value={this.state.searchRelayValue}
onInput={this.handleSearchRelayInput}
/>

View File

@ -45,7 +45,7 @@ type State = {
export class Search extends Component<Props, State> {
state: State = { searchResults: [] };
inputRef = createRef();
inputRef = createRef<HTMLInputElement>();
styles = {
container: `flex flex-col h-full w-full bg-[${SecondaryBackgroundColor}]`,
searchInput:
@ -62,7 +62,9 @@ export class Search extends Component<Props, State> {
};
componentDidMount() {
this.inputRef.current?.focus();
if (this.inputRef.current) {
this.inputRef.current.focus();
}
}
search = (e: h.JSX.TargetedEvent<HTMLInputElement, Event>) => {
@ -82,7 +84,9 @@ export class Search extends Component<Props, State> {
};
onSelect = (profile: Profile_Nostr_Event | PublicKey) => () => {
this.inputRef.current.value = "";
if (this.inputRef.current) {
this.inputRef.current.value = "";
}
this.setState({
searchResults: [],
});