Standardize on links for refresh.

Turns out I was doubling-up unnecessarily and had an event handler _and_
a hash change detection. This just made things complex. Now I use the
hash for both the mailbox and the email navigation.

I don't yet do anything with the email part.
This commit is contained in:
Eli Ribble 2024-08-28 10:35:48 -07:00
parent bf1ad0326d
commit fb53a7506f
4 changed files with 34 additions and 43 deletions

View file

@ -2,13 +2,14 @@ import "./App.css";
import "./style.scss";
import Client, { IAuth } from "./client/Client";
import { AccountIdMap, IAccount, IMailbox } from "./client/types";
import { AccountIdMap, IAccount, IEmail, IMailbox } from "./client/types";
import AppLayout from "./AppLayout";
import AuthModal from "./AuthModal";
import React from "react";
interface ILocation {
accountId: string;
emailId: string;
mailboxId: string;
}
@ -16,6 +17,7 @@ type AppState = {
auth: IAuth;
account: IAccount | null;
accounts: AccountIdMap;
email: IEmail | null;
location: ILocation;
mailbox: IMailbox | null;
};
@ -37,7 +39,8 @@ class App extends React.Component<AppProps, AppState> {
account: null,
accounts: {},
auth: { email: "", password: "" },
location: { accountId: "", mailboxId: "" },
email: null,
location: { accountId: "", emailId: "", mailboxId: "" },
mailbox: null,
};
@ -46,14 +49,19 @@ class App extends React.Component<AppProps, AppState> {
const parts = hash.split("/");
const accountId = parts[0];
const mailboxId = parts[1];
const emailId = parts[2];
this.setState({
...this.state,
account: this.account(),
location: {
accountId: accountId,
emailId: emailId,
mailboxId: mailboxId,
},
mailbox: this.client.mailbox(accountId, mailboxId),
});
if (!this.state.account) return;
this.client.ensureEmailList(accountId, mailboxId);
}
// When the user provides credentials
@ -70,16 +78,6 @@ class App extends React.Component<AppProps, AppState> {
this.client.doLogin({ email, password });
}
onMailboxSelect(mailboxId: string) {
if (!this.state.account) return;
this.client.emailList(this.state.account.id, mailboxId, []);
this.setState({
...this.state,
mailbox: this.client.mailbox(this.state.account.id, mailboxId),
});
window.location.hash = this.state.location.accountId + "/" + mailboxId;
}
// Load up auth credentials from the local store
loadAuth() {
const data = localStorage.getItem("auth");
@ -131,10 +129,8 @@ class App extends React.Component<AppProps, AppState> {
account={this.state.account}
accounts={this.state.accounts}
client={this.client}
email={this.state.email}
mailbox={this.state.mailbox}
onMailboxSelect={(m) => {
this.onMailboxSelect(m);
}}
/>
<AuthModal
show={this.client.state.session == null}