WIP PWA for Grain
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

fix: bottom nav updates on all navigation events

+11 -12
+9 -12
src/components/organisms/grain-bottom-nav.js
··· 5 5 6 6 export class GrainBottomNav extends LitElement { 7 7 static properties = { 8 - _user: { state: true }, 9 - _path: { state: true } 8 + _user: { state: true } 10 9 }; 11 10 12 11 static styles = css` ··· 47 46 constructor() { 48 47 super(); 49 48 this._user = auth.user; 50 - this._path = window.location.pathname; 51 - this._onPopState = () => this._path = window.location.pathname; 49 + this._onNavigate = () => this.requestUpdate(); 52 50 } 53 51 54 52 connectedCallback() { ··· 56 54 this._unsubscribe = auth.subscribe(user => { 57 55 this._user = user; 58 56 }); 59 - window.addEventListener('popstate', this._onPopState); 57 + window.addEventListener('popstate', this._onNavigate); 58 + window.addEventListener('grain:navigate', this._onNavigate); 60 59 } 61 60 62 61 disconnectedCallback() { 63 62 super.disconnectedCallback(); 64 63 this._unsubscribe?.(); 65 - window.removeEventListener('popstate', this._onPopState); 64 + window.removeEventListener('popstate', this._onNavigate); 65 + window.removeEventListener('grain:navigate', this._onNavigate); 66 66 } 67 67 68 68 get #isHome() { 69 - return this._path === '/'; 69 + return window.location.pathname === '/'; 70 70 } 71 71 72 72 get #isOwnProfile() { 73 - return this._user?.handle && this._path === `/profile/${this._user.handle}`; 73 + return this._user?.handle && window.location.pathname === `/profile/${this._user.handle}`; 74 74 } 75 75 76 76 #handleHome() { 77 77 router.push('/'); 78 - this._path = '/'; 79 78 } 80 79 81 80 #handleProfile() { 82 81 if (this._user?.handle) { 83 - const path = `/profile/${this._user.handle}`; 84 - router.push(path); 85 - this._path = path; 82 + router.push(`/profile/${this._user.handle}`); 86 83 } 87 84 } 88 85
+2
src/router.js
··· 19 19 if (location.pathname !== path) { 20 20 history.pushState(null, '', path); 21 21 this.#navigate(); 22 + window.dispatchEvent(new CustomEvent('grain:navigate')); 22 23 } 23 24 } 24 25 ··· 26 27 if (location.pathname !== path) { 27 28 history.replaceState(null, '', path); 28 29 this.#navigate(); 30 + window.dispatchEvent(new CustomEvent('grain:navigate')); 29 31 } 30 32 } 31 33