mirror of
https://github.com/usememos/memos.git
synced 2024-10-04 15:28:33 +03:00
chore: update signin button in visitor mode
This commit is contained in:
parent
cfa4151cff
commit
58e68f8f80
@ -1,10 +1,21 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { appRouterSwitch } from "./routers";
|
||||
import { locationService } from "./services";
|
||||
import { useAppSelector } from "./store";
|
||||
|
||||
function App() {
|
||||
const pathname = useAppSelector((state) => state.location.pathname);
|
||||
const [isLoading, setLoading] = useState(true);
|
||||
|
||||
return <>{appRouterSwitch(pathname)}</>;
|
||||
useEffect(() => {
|
||||
locationService.updateStateWithLocation();
|
||||
window.onpopstate = () => {
|
||||
locationService.updateStateWithLocation();
|
||||
};
|
||||
setLoading(false);
|
||||
}, []);
|
||||
|
||||
return <>{isLoading ? null : appRouterSwitch(pathname)}</>;
|
||||
}
|
||||
|
||||
export default App;
|
||||
|
@ -83,7 +83,6 @@ const MemoList: React.FC<Props> = () => {
|
||||
.fetchAllMemos()
|
||||
.then(() => {
|
||||
setFetchStatus(false);
|
||||
memoService.updateTagsState();
|
||||
})
|
||||
.catch(() => {
|
||||
toastHelper.error("😭 Fetching failed, please try again later.");
|
||||
|
@ -1,5 +1,4 @@
|
||||
import { userService } from "../services";
|
||||
import { useAppSelector } from "../store";
|
||||
import Only from "./common/OnlyWhen";
|
||||
import showDailyReviewDialog from "./DailyReviewDialog";
|
||||
import showSettingDialog from "./SettingDialog";
|
||||
@ -13,8 +12,6 @@ import "../less/siderbar.less";
|
||||
interface Props {}
|
||||
|
||||
const Sidebar: React.FC<Props> = () => {
|
||||
const user = useAppSelector((state) => state.user.user);
|
||||
|
||||
const handleMyAccountBtnClick = () => {
|
||||
showSettingDialog();
|
||||
};
|
||||
@ -44,17 +41,6 @@ const Sidebar: React.FC<Props> = () => {
|
||||
<button className="btn action-btn" onClick={handleArchivedBtnClick}>
|
||||
<span className="icon">🗂</span> Archived
|
||||
</button>
|
||||
<Only when={userService.isVisitorMode()}>
|
||||
{user ? (
|
||||
<button className="btn action-btn" onClick={() => (window.location.href = "/")}>
|
||||
<span className="icon">🏠</span> Back to Home
|
||||
</button>
|
||||
) : (
|
||||
<button className="btn action-btn" onClick={() => (window.location.href = "/signin")}>
|
||||
<span className="icon">👉</span> Sign in
|
||||
</button>
|
||||
)}
|
||||
</Only>
|
||||
</div>
|
||||
<Only when={!userService.isVisitorMode()}>
|
||||
<ShortcutList />
|
||||
|
@ -20,7 +20,9 @@ const TagList: React.FC<Props> = () => {
|
||||
const [tags, setTags] = useState<Tag[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
memoService.updateTagsState();
|
||||
if (memos.length > 0) {
|
||||
memoService.updateTagsState();
|
||||
}
|
||||
}, [memos]);
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -18,6 +18,18 @@
|
||||
@apply sticky top-0 w-full h-full flex flex-col justify-start items-start z-10;
|
||||
background-color: #f6f5f4;
|
||||
}
|
||||
|
||||
> .addtion-btn-container {
|
||||
@apply fixed bottom-12 left-1/2 -translate-x-1/2;
|
||||
|
||||
> .btn {
|
||||
@apply bg-blue-600 text-white px-4 py-2 rounded-3xl shadow-2xl hover:opacity-80;
|
||||
|
||||
> .icon {
|
||||
@apply text-lg mr-1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,10 +1,9 @@
|
||||
import { createRoot } from "react-dom/client";
|
||||
import { Provider } from "react-redux";
|
||||
import store from "./store";
|
||||
import { updateStateWithLocation } from "./store/modules/location";
|
||||
import App from "./App";
|
||||
import "./less/global.less";
|
||||
import "./helpers/polyfill";
|
||||
import "./less/global.less";
|
||||
import "./css/index.css";
|
||||
|
||||
const container = document.getElementById("root");
|
||||
@ -14,10 +13,3 @@ root.render(
|
||||
<App />
|
||||
</Provider>
|
||||
);
|
||||
|
||||
window.onload = () => {
|
||||
store.dispatch(updateStateWithLocation());
|
||||
window.onpopstate = () => {
|
||||
store.dispatch(updateStateWithLocation());
|
||||
};
|
||||
};
|
||||
|
@ -12,6 +12,7 @@ import toastHelper from "../components/Toast";
|
||||
import "../less/home.less";
|
||||
|
||||
function Home() {
|
||||
const user = useAppSelector((state) => state.user.user);
|
||||
const location = useAppSelector((state) => state.location);
|
||||
const loadingState = useLoading();
|
||||
|
||||
@ -53,6 +54,19 @@ function Home() {
|
||||
<MemoFilter />
|
||||
</div>
|
||||
<MemoList />
|
||||
<Only when={userService.isVisitorMode()}>
|
||||
<div className="addtion-btn-container">
|
||||
{user ? (
|
||||
<button className="btn" onClick={() => (window.location.href = "/")}>
|
||||
<span className="icon">🏠</span> Back to Home
|
||||
</button>
|
||||
) : (
|
||||
<button className="btn" onClick={() => (window.location.href = "/signin")}>
|
||||
<span className="icon">👉</span> Sign in
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</Only>
|
||||
</main>
|
||||
</div>
|
||||
)}
|
||||
|
@ -1,6 +1,6 @@
|
||||
import { stringify } from "qs";
|
||||
import store from "../store";
|
||||
import { setQuery, setPathname, Query } from "../store/modules/location";
|
||||
import { setQuery, setPathname, Query, updateStateWithLocation } from "../store/modules/location";
|
||||
|
||||
const updateLocationUrl = (method: "replace" | "push" = "replace") => {
|
||||
const { query, pathname, hash } = store.getState().location;
|
||||
@ -23,6 +23,10 @@ const locationService = {
|
||||
return store.getState().location;
|
||||
},
|
||||
|
||||
updateStateWithLocation: () => {
|
||||
store.dispatch(updateStateWithLocation());
|
||||
},
|
||||
|
||||
setPathname: (pathname: string) => {
|
||||
store.dispatch(setPathname(pathname));
|
||||
updateLocationUrl();
|
||||
|
@ -64,12 +64,20 @@ const locationSlice = createSlice({
|
||||
return getStateFromLocation();
|
||||
},
|
||||
setPathname: (state, action: PayloadAction<string>) => {
|
||||
if (state.pathname === action.payload) {
|
||||
return state;
|
||||
}
|
||||
|
||||
return {
|
||||
...state,
|
||||
pathname: action.payload,
|
||||
};
|
||||
},
|
||||
setQuery: (state, action: PayloadAction<Partial<Query>>) => {
|
||||
if (JSON.stringify(action.payload) === state.query) {
|
||||
return state;
|
||||
}
|
||||
|
||||
return {
|
||||
...state,
|
||||
query: {
|
||||
|
Loading…
Reference in New Issue
Block a user