rewrite application navigation handlers

This commit is contained in:
SrGooglo 2023-06-24 11:58:31 +00:00
parent 9f98a9c4ab
commit d1b93eacac
19 changed files with 85 additions and 61 deletions

View File

@ -4,7 +4,7 @@ import { Button } from "antd"
export default (props) => {
return <Button
onClick={() => {
app.setLocation("/security/sessions")
app.location.push("/security/sessions")
props.ctx.close()
}}
>

View File

@ -12,7 +12,7 @@ export default (props) => {
return false
}
app.setLocation(`/featured-event/${props.data?._id}`)
app.location.push(`/featured-event/${props.data?._id}`)
}
return <div

View File

@ -16,7 +16,7 @@ export default (props) => {
if (link.location) {
linkProps.onClick = () => {
app.setLocation(link.location)
app.location.push(link.location)
}
}

View File

@ -311,11 +311,11 @@ export default class Sidebar extends React.Component {
if (typeof this.state.pathResolvers === "object") {
if (typeof this.state.pathResolvers[e.key] !== "undefined") {
return window.app.setLocation(`/${this.state.pathResolvers[e.key]}`, 150)
return window.app.location.push(`/${this.state.pathResolvers[e.key]}`, 150)
}
}
return window.app.setLocation(`/${e.key}`, 150)
return window.app.location.push(`/${e.key}`, 150)
}
toggleExpanded = (to, force) => {

View File

@ -8,7 +8,7 @@ import "./index.less"
export default class NavigationMenu extends React.Component {
onClick = (id) => {
window.app.setLocation(`/${id}`)
window.app.location.push(`/${id}`)
this.props.close()
}

View File

@ -46,7 +46,7 @@ export class AudioPlayer extends React.Component {
}
openVisualizer = () => {
app.setLocation("/lyrics")
app.location.push("/lyrics")
}
inviteSync = () => {

View File

@ -13,7 +13,7 @@ export default (props) => {
}
const navigateToPlaylist = () => {
app.setLocation(`/play/${data._id}`)
app.location.push(`/play/${data._id}`)
}
return <div className="playlistTimelineEntry">

View File

@ -36,7 +36,7 @@ const messageRegexs = [
{
regex: /(@[a-zA-Z0-9_]+)/gi,
fn: (key, result) => {
return <a key={key} onClick={() => window.app.setLocation(`/@${result[1].substr(1)}`)}>{result[1]}</a>
return <a key={key} onClick={() => window.app.location.push(`/@${result[1].substr(1)}`)}>{result[1]}</a>
}
},
]

View File

@ -33,7 +33,7 @@ export default (props) => {
}
const onClickGoMain = () => {
window.app.setLocation(config.app.mainPath ?? "/main")
window.app.location.push(config.app.mainPath ?? "/main")
}
const onClickReload = () => {
window.location.reload()

View File

@ -232,7 +232,7 @@ export default class WidgetsWrapper extends React.Component {
id: "settings",
icon: "Settings",
onClick: () => {
app.setLocation("/settings?tab=widgets")
app.location.push("/settings?tab=widgets")
}
},
]}

View File

@ -7,7 +7,7 @@ export default (props) => {
if (entryParam.startsWith("@")) {
const username = entryParam.replace("@", "")
window.app.setLocation(`/account/${username}`, {
window.app.location.push(`/account/${username}`, {
state: {
"noTransition": true,
}

View File

@ -13,7 +13,7 @@ const emptyListRender = () => {
</h2>
<p>
Search for new people to follow on <a onClick={() => app.setLocation("/?type=global")}>global</a> tab, and start view their posts.
Search for new people to follow on <a onClick={() => app.location.push("/?type=global")}>global</a> tab, and start view their posts.
</p>
</div>
}

View File

@ -620,7 +620,7 @@ export default class SyncLyrics extends React.Component {
// listen when user exit full screen to exit cinematic mode
document.addEventListener("fullscreenchange", () => {
if (!document.fullscreenElement) {
app.backLocation()
app.location.back()
}
})

View File

@ -88,7 +88,7 @@ const openPlaylistCreator = ({
}
const navigateToPlaylist = (playlist_id) => {
return app.setLocation(`/play/${playlist_id}`)
return app.location.push(`/play/${playlist_id}`)
}
export default (props) => {

View File

@ -143,7 +143,7 @@ const PlaylistItem = (props) => {
return props.onClick(playlist)
}
return app.setLocation(`/play/${playlist._id}`)
return app.location.push(`/play/${playlist._id}`)
}
const onClickPlay = (e) => {

View File

@ -332,7 +332,7 @@ export default (props) => {
return <div className="tracksUploads">
<p>
Uploading files that are not permitted by our <a onClick={() => app.setLocation("/terms")}>Terms of Service</a> may result in your account being suspended.
Uploading files that are not permitted by our <a onClick={() => app.location.push("/terms")}>Terms of Service</a> may result in your account being suspended.
</p>
<div className="uploadBox">

View File

@ -88,7 +88,7 @@ export default (props) => {
const [L_Streams, R_Streams, E_Streams] = app.cores.api.useRequest(Livestream.getLivestreams)
const onClickItem = (livestream) => {
app.setLocation(`/live/${livestream.streamUrl}`)
app.location.push(`/live/${livestream.streamUrl}`)
}
if (E_Streams) {

View File

@ -73,8 +73,8 @@ function generatePageElementWrapper(route, element, bindProps) {
if (routeDeclaration) {
if (!bindProps.user && (window.location.pathname !== config.app?.authPath)) {
if (!routeDeclaration.public) {
if (typeof window.app.setLocation === "function") {
window.app.setLocation(config.app?.authPath ?? "/login")
if (typeof window.app.location.push === "function") {
window.app.location.push(config.app?.authPath ?? "/login")
return <div />
}
@ -92,7 +92,7 @@ function generatePageElementWrapper(route, element, bindProps) {
status="403"
title="403"
subTitle="Sorry, you are not authorized to access this page."
extra={<Button type="primary" onClick={() => window.app.setLocation("/")}>Back Home</Button>}
extra={<Button type="primary" onClick={() => window.app.location.push("/")}>Back Home</Button>}
/>
}
}
@ -140,10 +140,8 @@ function generatePageElementWrapper(route, element, bindProps) {
export const PageRender = React.memo((props) => {
const navigate = useNavigate()
app.location = useLocation()
React.useEffect(() => {
app.setLocation = async (to, state = {}) => {
async function setLocation(to, state = {}) {
// clean double slashes
to = to.replace(/\/{2,}/g, "/")
@ -160,14 +158,10 @@ export const PageRender = React.memo((props) => {
state,
})
app.location.lastPathname = app.location.pathname
app.location.last = window.location
if (state.transitionDelay >= 100) {
await new Promise((resolve) => {
setTimeout(() => {
resolve()
}, state.transitionDelay)
})
await new Promise((resolve) => setTimeout(resolve, state.transitionDelay))
}
return navigate(to, {
@ -175,17 +169,25 @@ export const PageRender = React.memo((props) => {
})
}
app.backLocation = (state = {}) => {
let to = app.location.lastPathname
async function backLocation() {
const transitionDuration = app.cores.style.getValue("page-transition-duration") ?? "250ms"
if (!to || to === app.location.pathname) {
console.warn("No last location found, redirecting to /")
to = "/"
app.eventBus.emit("router.navigate")
app.location.last = window.location
if (transitionDuration >= 100) {
await new Promise((resolve) => setTimeout(resolve, transitionDuration))
}
return navigate(to, {
state
})
return window.history.back()
}
React.useEffect(() => {
app.location = {
last: window.location,
push: setLocation,
back: backLocation,
}
}, [])

View File

@ -530,3 +530,25 @@
}
}
}
.adm-action-sheet {
.adm-action-sheet-button-item-wrapper {
border-bottom-color: var(--border-color);
.adm-action-sheet-button-item {
.adm-action-sheet-button-item-name {
color: var(--text-color);
span {
color: currentColor;
}
}
}
.adm-action-sheet-button-item-danger {
.adm-action-sheet-button-item-name {
color: var(--adm-color-danger);
}
}
}
}