~emersion/public-inbox

gamja: Add error reporting on connect and main page v2 SUPERSEDED

bbworld1: 1
 Add error reporting on connect and main page

 5 files changed, 53 insertions(+), 12 deletions(-)
Export patchset (mbox)
How do I use this?

Copy & paste the following snippet into your terminal to import this patchset into git:

curl -s https://lists.sr.ht/~emersion/public-inbox/patches/11704/mbox | git am -3
Learn more about email & git
View this thread in the archives

[PATCH gamja v2] Add error reporting on connect and main page Export this patch

---

Apologies for the duplicate patch! I'm still working out the Git email workflow :)
This one should fix all the things you pointed out. Please let me know if there's
any issues.

 .editorconfig         |  9 +++++++++
 components/app.js     | 29 +++++++++++++++++++++++------
 components/connect.js |  1 +
 lib/client.js         | 11 +++++------
 style.css             | 15 +++++++++++++++
 5 files changed, 53 insertions(+), 12 deletions(-)
 create mode 100644 .editorconfig

diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000..c229150
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,9 @@
root = true

[*]
end_of_line = lf
insert_final_newline = true
charset = utf-8
trim_trailing_whitespace = true
indent_style = tab
indent_size = 4
diff --git a/components/app.js b/components/app.js
index e255b70..bca7477 100644
--- a/components/app.js
+++ b/components/app.js
@@ -84,6 +84,7 @@ export default class App extends Component {
		status: Status.DISCONNECTED,
		buffers: new Map(),
		activeBuffer: null,
		error: null,
	};
	pendingHistory = Promise.resolve(null);
	endOfHistory = new Map();
@@ -94,6 +95,7 @@ export default class App extends Component {
	constructor(props) {
		super(props);

		this.dismissError = this.dismissError.bind(this);
		this.handleConnectSubmit = this.handleConnectSubmit.bind(this);
		this.handleBufferListClick = this.handleBufferListClick.bind(this);
		this.handleComposerSubmit = this.handleComposerSubmit.bind(this);
@@ -143,6 +145,10 @@ export default class App extends Component {
		}
	}

	dismissError() {
		this.setState({ error: null });
	}

	setBufferState(name, updater, callback) {
		this.setState((state) => {
			var buf = state.buffers.get(name);
@@ -323,6 +329,9 @@ export default class App extends Component {
			username: params.username,
			realname: params.realname,
			saslPlain: params.saslPlain,
	  onError: (error) => {
		this.setState({ error });
	  }
		});

		this.client.addEventListener("close", () => {
@@ -337,6 +346,10 @@ export default class App extends Component {
			this.handleMessage(event.detail.message);
		});

		this.client.addEventListener("error", (event) => {
			this.setState({ error: event.detail });
		});

		this.createBuffer(SERVER_BUFFER);
		this.switchBuffer(SERVER_BUFFER);
	}
@@ -440,7 +453,7 @@ export default class App extends Component {
				var after = receipt;
				var before = { time: msg.tags.time || irc.formatDate(new Date()) };
				this.fetchHistoryBetween(channel, after, before, CHATHISTORY_MAX_SIZE).catch((err) => {
					console.error("Failed to fetch history:", err);
		  this.setState({ error: "Failed to fetch history:" + err });
					this.receipts.delete(channel);
					this.saveReceipts();
				});
@@ -526,6 +539,7 @@ export default class App extends Component {
	}

	handleConnectSubmit(connectParams) {
		this.setState({ error: null });
		if (window.localStorage) {
			if (connectParams.autoconnect) {
				localStorage.setItem("autoconnect", JSON.stringify(connectParams));
@@ -584,20 +598,20 @@ export default class App extends Component {

		var cmd = commands[name];
		if (!cmd) {
			console.error("Unknwon command '" + name + "'");
	  this.setState({ error: "Unknown command '" + name + "'" });
			return;
		}

		try {
			cmd(this, args);
		} catch (err) {
			console.error(err);
		} catch (error) {
	  this.setState({ error });
		}
	}

	privmsg(target, text) {
		if (target == SERVER_BUFFER) {
			console.error("Cannot send message in server buffer");
	  this.setState({ error: "Cannot send message in server buffer" });
			return;
		}

@@ -764,7 +778,7 @@ export default class App extends Component {
		if (this.state.status != Status.REGISTERED) {
			return html`
				<section id="connect">
					<${Connect} params=${this.state.connectParams} disabled=${this.state.status != Status.DISCONNECTED} onSubmit=${this.handleConnectSubmit}/>
					<${Connect} error=${this.state.error} params=${this.state.connectParams} disabled=${this.state.status != Status.DISCONNECTED} onSubmit=${this.handleConnectSubmit}/>
				</section>
			`;
		}
@@ -810,6 +824,9 @@ export default class App extends Component {
			</>
			${memberList}
			<${Composer} ref=${this.composer} readOnly=${this.state.activeBuffer == SERVER_BUFFER} onSubmit=${this.handleComposerSubmit} autocomplete=${this.autocomplete}/>
			${this.state.error ? html`
				<p id="error-msg">${this.state.error} <a href="#" onClick=${this.dismissError}>&times;</a></p>
			` : ""}
		`;
	}
}
diff --git a/components/connect.js b/components/connect.js
index 97589e0..f124f7c 100644
--- a/components/connect.js
+++ b/components/connect.js
@@ -140,6 +140,7 @@ export default class Connect extends Component {
				</details>

				<br/>
        <p style=${{color: "red"}}>${this.props.error || ""}</p>

				<button disabled=${this.props.disabled}>Connect</button>
			</form>
diff --git a/lib/client.js b/lib/client.js
index 01fd67b..0815f66 100644
--- a/lib/client.js
+++ b/lib/client.js
@@ -35,12 +35,11 @@ export default class Client extends EventTarget {

		try {
			this.ws = new WebSocket(params.url);
		} catch (err) {
			console.error("Failed to create connection:", err);
		} catch (e) {
			this.dispatchEvent(new CustomEvent("error", { detail: "Failed to create connection: " + err }));
			setTimeout(() => this.dispatchEvent(new CustomEvent("close")), 0);
			return;
		}

		this.ws.addEventListener("open", this.handleOpen.bind(this));
		this.ws.addEventListener("message", this.handleMessage.bind(this));

@@ -50,7 +49,7 @@ export default class Client extends EventTarget {
		});

		this.ws.addEventListener("error", () => {
			console.error("Connection error");
			this.dispatchEvent(new CustomEvent("error", { detail: "Connection error: WebSocket connection failed or was broken" }));
		});
	}

@@ -95,7 +94,7 @@ export default class Client extends EventTarget {
			this.registered = true;
			break;
		case irc.ERR_PASSWDMISMATCH:
			console.error("Password mismatch");
			this.dispatchEvent(new CustomEvent("error", { detail: "Password mismatch" }));
			this.close();
			break;
		case "CAP":
@@ -121,7 +120,7 @@ export default class Client extends EventTarget {
		case irc.ERR_SASLTOOLONG:
		case irc.ERR_SASLABORTED:
		case irc.ERR_SASLALREADY:
			console.error("SASL error:", msg);
			this.dispatchEvent(new CustomEvent("error", { detail: "SASL error: " + msg }));
			this.close();
			break;
		case "PING":
diff --git a/style.css b/style.css
index 3d1166f..e184687 100644
--- a/style.css
+++ b/style.css
@@ -234,3 +234,18 @@ details summary {
#buffer .nick-16 {
	color: #ec273e;
}

#error-msg {
	color: white;
	background-color: red;
	position: fixed;
	bottom: 2rem;
	right: 0;
	padding: 0.5rem;
	margin: 0.5rem;
}

#error-msg a {
	color: white;
	text-decoration: none;
}
-- 
2.27.0
Here I am shamelessly trying out reviewing patches via email. Not even
trying to see if anything is wrong with this one...

It seems you included more commits than you should have. If your patch
only has one commit, you can use:

    git send-email --annotate -v42 'HEAD^'

Also, indentation is mixed tabs/spaces here and there.