Files
ForumMobile/src/index.js
matiasc18 b20ce6da06 People app and navigation + fixes
Index.js
- Fixed issue where incorrect pathname was set while not part of an organization.
- onNavigate(), fetchAppData(), getDefaultNetworkName(), and getDefaultAppName() all modified to account for user not being part of an organization (default path set to /my/dashboard)
- onNavigate() modified to properly set defaults for currentNetwork and currentApp, and modified to fix issue where app would crash when attempting to access nonexistent 'this.currentNetwork.data'
- onNavigate() now correctly switches currentApp

Home.js
- Changed ZStack to a VStack
- Replaced Jobs switch case with People
- Adjusted styling for AppMenu() and VStack height values
- Changed .onNavigate() from function() to () => {} for correct this binding
- !!!(TEMP FIX)!!!: Added extra rerender() call in an .onClick() after .onNavigate()

AppMenu()
- Modified app icons to be highlighted when active
- Changed Forum's app icon to redirect from "/" to "/dashboard"
- Removed fixed styling to account for Home's new responsive VStack layout

People.js
- Added People.js

Messages.js
- Fixed missing 'global." before Socket.send
- Changed 'vh' height values to 'pct' to account for AppMenu() at bottom
- Fixed misnamed modifiers

Forum.js
- Adjusted styling
- Changed 'vh' height values to 'pct' to account for AppMenu() at bottom

styles.css
- Added missing custom color vars
2026-02-02 04:34:26 -05:00

163 lines
5.3 KiB
JavaScript

import Socket from "/_/code/ws/Socket.js"
import "./Home.js"
import "./Login.js"
let Global = class {
Socket = new Socket()
profile = null
currentNetwork = ""
currentApp = ""
openApp = function(appName) {
const appUrl = appName.charAt(0).toLowerCase() + appName.slice(1);
let parts = window.location.pathname.split('/').filter(Boolean);
let newPath = "/" + parts[0] + "/" + appUrl
window.navigateTo(newPath)
const event = new CustomEvent('appchange', {
detail: { name: appName }
});
window.dispatchEvent(event)
}
async fetchAppData() {
let personalSpace = this.currentNetwork === this.profile
if (personalSpace) { return {} }
let appData = await fetch(`/api/${personalSpace ? "my" : "org"}data/` + this.currentNetwork.id, {method: "GET"})
let json = await appData.json()
return json
}
onNavigate = async () => {
let selectedNetwork = this.networkFromPath()
let selectedApp = this.appFromPath()
if(!selectedNetwork) {
if (!this.currentNetwork || this.currentNetwork === this.profile) {
let path = `/${this.getDefaultNetworkName()}/${this.getDefaultAppName()}`
history.replaceState({}, '', path)
} else {
let path = `/${this.currentNetwork.abbreviation}${window.location.pathname}`
history.replaceState({}, '', path)
}
} else if(!selectedApp) {
if(this.currentNetwork === window.profile) {
history.replaceState({}, '', `${window.location.pathname}/${window.profile.apps[0]}`)
} else {
history.replaceState({}, '', `${window.location.pathname}/${this.getDefaultAppName()}`)
}
}
selectedNetwork = this.networkFromPath()
selectedApp = this.appFromPath()
let networkChanged = this.currentNetwork !== selectedNetwork
let appChanged = this.currentApp !== selectedApp
if(networkChanged) {
console.log("onNavigate: network changed ->", selectedNetwork?.abbreviation)
this.currentNetwork = selectedNetwork
this.currentApp = selectedApp
const event = new CustomEvent('networkchange', {
detail: { name: this.currentNetwork }
});
window.dispatchEvent(event)
}
if(!this.currentNetwork?.data) {
this.currentNetwork.data = await this.fetchAppData()
}
if(appChanged && !networkChanged) {
console.log("onNavigate: app changed ->", selectedApp, "\n")
this.currentApp = selectedApp
const event = new CustomEvent('appchange', {
detail: { name: this.currentApp }
});
window.dispatchEvent(event)
}
document.title = (this.currentNetwork === this.profile) ? "Forum" : `${this.currentNetwork.abbreviation} | Forum`
}
setCurrentNetworkAndApp() {
this.currentNetwork = this.networkFromPath()
}
getDefaultNetworkName() {
let defaultNetwork = this.profile.networks[0]
if (!defaultNetwork) { return "my"; }
return defaultNetwork.abbreviation
}
getDefaultAppName() {
let defaultNetwork = this.profile.networks[0]
if (!defaultNetwork) { return this.profile.apps[0].toLowerCase(); }
return defaultNetwork.apps[0].toLowerCase()
}
networkFromPath = function () {
const pathname = window.location.pathname;
const firstSegment = pathname.split('/').filter(Boolean)[0] || '';
if(firstSegment === "my") {
return this.profile
} else {
let networks = this.profile.networks
for(let i = 0; i < networks.length; i++) {
let network = networks[i]
if(network.abbreviation === firstSegment) {
return network
}
}
}
}
appFromPath = function() {
const pathname = window.location.pathname;
const segments = pathname.split('/').filter(Boolean);
const secondSegment = segments[1] || ""
const capitalized = secondSegment.charAt(0).toUpperCase() + secondSegment.slice(1);
return capitalized
}
async getProfile() {
try {
const res = await fetch("/profile", {
method: "GET",
credentials: "include",
headers: {
"Accept": "application/json"
}
});
if(res.status === 401) {
return res.status
}
if (!res.ok) return res.status;
const profile = await res.json();
console.log("getProfile: ", profile);
this.profile = profile
return 200;
} catch (err) {
console.error(err);
return 401;
}
}
constructor() {
window.addEventListener("navigate", this.onNavigate)
this.getProfile().then(async (status) => {
if (status === 401) {
Login()
} else {
await this.Socket.init()
await this.onNavigate()
Home()
}
});
}
}
window.global = new Global()