mirror of
https://github.com/ragestudio/comty.git
synced 2025-06-10 02:54:15 +00:00
rewrite application navigation handlers
This commit is contained in:
parent
9f98a9c4ab
commit
d1b93eacac
@ -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()
|
||||
}}
|
||||
>
|
||||
|
@ -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
|
||||
|
@ -16,7 +16,7 @@ export default (props) => {
|
||||
|
||||
if (link.location) {
|
||||
linkProps.onClick = () => {
|
||||
app.setLocation(link.location)
|
||||
app.location.push(link.location)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -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) => {
|
||||
|
@ -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()
|
||||
}
|
||||
|
||||
|
@ -46,7 +46,7 @@ export class AudioPlayer extends React.Component {
|
||||
}
|
||||
|
||||
openVisualizer = () => {
|
||||
app.setLocation("/lyrics")
|
||||
app.location.push("/lyrics")
|
||||
}
|
||||
|
||||
inviteSync = () => {
|
||||
|
@ -13,7 +13,7 @@ export default (props) => {
|
||||
}
|
||||
|
||||
const navigateToPlaylist = () => {
|
||||
app.setLocation(`/play/${data._id}`)
|
||||
app.location.push(`/play/${data._id}`)
|
||||
}
|
||||
|
||||
return <div className="playlistTimelineEntry">
|
||||
|
@ -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>
|
||||
}
|
||||
},
|
||||
]
|
||||
|
@ -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()
|
||||
|
@ -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")
|
||||
}
|
||||
},
|
||||
]}
|
||||
|
@ -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,
|
||||
}
|
||||
|
@ -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>
|
||||
}
|
||||
|
@ -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()
|
||||
}
|
||||
})
|
||||
|
||||
|
@ -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) => {
|
||||
|
@ -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) => {
|
||||
|
@ -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">
|
||||
|
@ -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) {
|
||||
|
@ -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,52 +140,54 @@ function generatePageElementWrapper(route, element, bindProps) {
|
||||
|
||||
export const PageRender = React.memo((props) => {
|
||||
const navigate = useNavigate()
|
||||
app.location = useLocation()
|
||||
|
||||
React.useEffect(() => {
|
||||
app.setLocation = async (to, state = {}) => {
|
||||
// clean double slashes
|
||||
to = to.replace(/\/{2,}/g, "/")
|
||||
async function setLocation(to, state = {}) {
|
||||
// clean double slashes
|
||||
to = to.replace(/\/{2,}/g, "/")
|
||||
|
||||
// if state is a number, it's a delay
|
||||
if (typeof state !== "object") {
|
||||
state = {}
|
||||
}
|
||||
|
||||
const transitionDuration = app.cores.style.getValue("page-transition-duration") ?? "250ms"
|
||||
|
||||
state.transitionDelay = Number(transitionDuration.replace("ms", ""))
|
||||
|
||||
app.eventBus.emit("router.navigate", to, {
|
||||
state,
|
||||
})
|
||||
|
||||
app.location.lastPathname = app.location.pathname
|
||||
|
||||
if (state.transitionDelay >= 100) {
|
||||
await new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve()
|
||||
}, state.transitionDelay)
|
||||
})
|
||||
}
|
||||
|
||||
return navigate(to, {
|
||||
state
|
||||
})
|
||||
// if state is a number, it's a delay
|
||||
if (typeof state !== "object") {
|
||||
state = {}
|
||||
}
|
||||
|
||||
app.backLocation = (state = {}) => {
|
||||
let to = app.location.lastPathname
|
||||
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 = "/"
|
||||
}
|
||||
state.transitionDelay = Number(transitionDuration.replace("ms", ""))
|
||||
|
||||
return navigate(to, {
|
||||
state
|
||||
})
|
||||
app.eventBus.emit("router.navigate", to, {
|
||||
state,
|
||||
})
|
||||
|
||||
app.location.last = window.location
|
||||
|
||||
if (state.transitionDelay >= 100) {
|
||||
await new Promise((resolve) => setTimeout(resolve, state.transitionDelay))
|
||||
}
|
||||
|
||||
return navigate(to, {
|
||||
state
|
||||
})
|
||||
}
|
||||
|
||||
async function backLocation() {
|
||||
const transitionDuration = app.cores.style.getValue("page-transition-duration") ?? "250ms"
|
||||
|
||||
app.eventBus.emit("router.navigate")
|
||||
|
||||
app.location.last = window.location
|
||||
|
||||
if (transitionDuration >= 100) {
|
||||
await new Promise((resolve) => setTimeout(resolve, transitionDuration))
|
||||
}
|
||||
|
||||
return window.history.back()
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
app.location = {
|
||||
last: window.location,
|
||||
push: setLocation,
|
||||
back: backLocation,
|
||||
}
|
||||
}, [])
|
||||
|
||||
|
@ -529,4 +529,26 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.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);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user