YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-06-05 22:09:59 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: customize system profile (#774)

Browse Source 
* feat: system setting for customized profile

* chore: update

* feat: update frontend

* chore: update
This commit is contained in:
boojack
2022-12-18 21:18:30 +08:00
committed by GitHub
parent 55695f2189
commit b67ed1ee13
20 changed files with 259 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
web/src/components/Dialog/BaseDialog.tsx
View File

@ -1,4 +1,4 @@
import { useEffect } from "react";
import { useEffect, useRef } from "react";
import { createRoot } from "react-dom/client";
import { Provider } from "react-redux";
import { ANIMATION_DURATION } from "../../helpers/consts";
@ -10,8 +10,8 @@ import "../../less/base-dialog.less";
interface DialogConfig {
className: string;
clickSpaceDestroy?: boolean;
dialogName: string;
clickSpaceDestroy?: boolean;
}
interface Props extends DialogConfig, DialogProps {
@ -21,13 +21,14 @@ interface Props extends DialogConfig, DialogProps {
const BaseDialog: React.FC<Props> = (props: Props) => {
const { children, className, clickSpaceDestroy, dialogName, destroy } = props;
const dialogStore = useDialogStore();
const dialogContainerRef = useRef<HTMLDivElement>(null);
const dialogIndex = dialogStore.state.dialogStack.findIndex((item) => item === dialogName);
useEffect(() => {
dialogStore.pushDialogStack(dialogName);
const handleKeyDown = (event: KeyboardEvent) => {
if (event.code === "Escape") {
if (dialogName === dialogStore.topDialogStack()) {
dialogStore.popDialogStack();
destroy();
}
}
@ -37,9 +38,16 @@ const BaseDialog: React.FC<Props> = (props: Props) => {
return () => {
document.body.removeEventListener("keydown", handleKeyDown);
dialogStore.removeDialog(dialogName);
};
}, []);
useEffect(() => {
if (dialogIndex > 0 && dialogContainerRef.current) {
dialogContainerRef.current.style.marginTop = `${dialogIndex * 16}px`;
}
}, [dialogIndex]);
const handleSpaceClicked = () => {
if (clickSpaceDestroy) {
destroy();
@ -48,7 +56,7 @@ const BaseDialog: React.FC<Props> = (props: Props) => {
return (
<div className={`dialog-wrapper ${className}`} onMouseDown={handleSpaceClicked}>
<div className="dialog-container" onMouseDown={(e) => e.stopPropagation()}>
<div ref={dialogContainerRef} className="dialog-container" onMouseDown={(e) => e.stopPropagation()}>
{children}
</div>
</div>