explore back button

This commit is contained in:
b1ek 2023-08-26 11:43:17 +10:00
parent 59af88a7c7
commit 32b285c9fe
Signed by: blek
GPG Key ID: 14546221E3595D0C
7 changed files with 43 additions and 8 deletions

View File

@ -15,6 +15,7 @@
"@formkit/auto-animate": "^0.7.0", "@formkit/auto-animate": "^0.7.0",
"@reduxjs/toolkit": "^1.9.5", "@reduxjs/toolkit": "^1.9.5",
"@tauri-apps/api": "^1.4.0", "@tauri-apps/api": "^1.4.0",
"lodash": "^4.17.21",
"redux": "^4.2.1", "redux": "^4.2.1",
"svelte-icons-pack": "^2.1.0", "svelte-icons-pack": "^2.1.0",
"svelte-loading-spinners": "^0.3.4", "svelte-loading-spinners": "^0.3.4",

View File

@ -8,7 +8,7 @@
import Titlebar from './widget/Titlebar/Titlebar.svelte'; import Titlebar from './widget/Titlebar/Titlebar.svelte';
import { Router, Link, Route, navigate } from "svelte-routing"; import { Router, Link, Route, navigate } from "svelte-routing";
import RouteStore from './store/RouteStore'; import RouteStore, { route } from './store/RouteStore';
import Background from './widget/Background/Background.svelte'; import Background from './widget/Background/Background.svelte';
import Explore from './page/Explore/Explore.svelte'; import Explore from './page/Explore/Explore.svelte';
import Sidebar from './widget/Sidebar/Sidebar.svelte'; import Sidebar from './widget/Sidebar/Sidebar.svelte';
@ -31,7 +31,7 @@
}); });
RouteStore.dispatch({ type: 'setPath', path: '/load' }) RouteStore.dispatch({ type: 'setPath', path: '/load' })
setTimeout(() => { RouteStore.dispatch({ type: 'setPath', path: '/' }) }, 3000) setTimeout(() => { route('/') }, 3000)
setCSSVariableFor('sidebar-width', '0px', 3000); setCSSVariableFor('sidebar-width', '0px', 3000);
</script> </script>

View File

@ -6,7 +6,7 @@
import VscArrowLeft from "svelte-icons-pack/vsc/VscArrowLeft"; import VscArrowLeft from "svelte-icons-pack/vsc/VscArrowLeft";
import { invoke } from '@tauri-apps/api/tauri'; import { invoke } from '@tauri-apps/api/tauri';
import { route } from '../../store/RouteStore'; import { back } from '../../store/RouteStore';
let list = []; let list = [];
@ -40,7 +40,7 @@
<div class={style.root}> <div class={style.root}>
<p style='margin:8px'> <p style='margin:8px'>
<button aria-label="back" class={style.backbtn} on:click={(_) => { route('/') }}> <button aria-label="back" class={style.backbtn} on:click={(_) => { back() }}>
<Icon src={VscArrowLeft} color='#b2b2b2' size='17px' /> <Icon src={VscArrowLeft} color='#b2b2b2' size='17px' />
</button> </button>
</p> </p>

View File

@ -2,6 +2,7 @@
import style from './style.module.scss'; import style from './style.module.scss';
import AccountStore from '../../store/AccountStore'; import AccountStore from '../../store/AccountStore';
import { route } from '../../store/RouteStore';
let homeserver = AccountStore.getState().homeserver; let homeserver = AccountStore.getState().homeserver;
let homeserverValid = homeserver.match(/.+(\..+){1,}/gm) !== null; let homeserverValid = homeserver.match(/.+(\..+){1,}/gm) !== null;
@ -22,7 +23,7 @@
<br/> <br/>
<button>What is a homeserver?</button> <button>What is a homeserver?</button>
<button>Explore homeservers</button> <button on:click={() => {route('/explore')}}>Explore homeservers</button>
</p> </p>
<p style="text-align:center"> <p style="text-align:center">
<button class="primary">Choose {homeserver}</button> <button class="primary">Choose {homeserver}</button>

View File

@ -1,9 +1,11 @@
<script lang="ts"> <script lang="ts">
import RouteState from "../store/RouteStore"; import RouteState, { route } from "../store/RouteStore";
export let href = '#'; export let href = '#';
function setUrl() { function setUrl() {
RouteState.dispatch({ type: 'setPath', path: href }); if (!href.startsWith('/')) return;
route(href)
} }
</script> </script>

View File

@ -1,7 +1,9 @@
import { configureStore } from '@reduxjs/toolkit'; import { configureStore } from '@reduxjs/toolkit';
import _ from 'lodash';
export interface RouteState { export interface RouteState {
path: string path: string,
history: string[]
} }
const store = configureStore({ const store = configureStore({
@ -9,6 +11,22 @@ const store = configureStore({
path: (state = '/load', action) => { path: (state = '/load', action) => {
if (action.type != 'setPath') return state; if (action.type != 'setPath') return state;
return action.path ?? state; return action.path ?? state;
},
history: (state = ['/load'], action) => {
let new_state: string[] = _.cloneDeep(state);
if (action.type == 'addHistory') {
// detect attempts to add same as last url
if (new_state[new_state.length - 1] == action.path)
return new_state;
new_state.push(action.path);
}
if (action.type == 'popHistory') {
new_state.pop();
}
return new_state;
} }
}, },
}); });
@ -17,4 +35,12 @@ export default store;
export function route(path) { export function route(path) {
store.dispatch({ type: 'setPath', path }); store.dispatch({ type: 'setPath', path });
store.dispatch({ type: 'addHistory', path });
}
export function back() {
const history: string[] = store.getState().history;
console.log(history[history.length - 2]);
store.dispatch({ type: 'setPath', path: history[history.length - 2] });
store.dispatch({ type: 'popHistory' });
} }

View File

@ -521,6 +521,11 @@ kleur@^4.1.5:
resolved "https://registry.yarnpkg.com/kleur/-/kleur-4.1.5.tgz#95106101795f7050c6c650f350c683febddb1780" resolved "https://registry.yarnpkg.com/kleur/-/kleur-4.1.5.tgz#95106101795f7050c6c650f350c683febddb1780"
integrity sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ== integrity sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==
lodash@^4.17.21:
version "4.17.21"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
magic-string@^0.27.0: magic-string@^0.27.0:
version "0.27.0" version "0.27.0"
resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.27.0.tgz#e4a3413b4bab6d98d2becffd48b4a257effdbbf3" resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.27.0.tgz#e4a3413b4bab6d98d2becffd48b4a257effdbbf3"