mirror of
https://github.com/usememos/memos.git
synced 2024-12-20 09:41:58 +03:00
fix: editor resource list (#445)
This commit is contained in:
parent
79af7e8abf
commit
d1aa6aa7f8
@ -40,8 +40,8 @@ interface State {
|
||||
|
||||
const MemoEditor: React.FC = () => {
|
||||
const { t, i18n } = useTranslation();
|
||||
const user = useAppSelector((state) => state.user.user);
|
||||
const { setting } = useAppSelector((state) => state.user.user as User);
|
||||
const user = useAppSelector((state) => state.user.user as User);
|
||||
const setting = user.setting;
|
||||
const editorState = useAppSelector((state) => state.editor);
|
||||
const tags = useAppSelector((state) => state.memo.tags);
|
||||
const [state, setState] = useState<State>({
|
||||
@ -85,33 +85,29 @@ const MemoEditor: React.FC = () => {
|
||||
}, [editorState.markMemoId]);
|
||||
|
||||
useEffect(() => {
|
||||
if (
|
||||
editorState.editMemoId &&
|
||||
editorState.editMemoId !== UNKNOWN_ID &&
|
||||
editorState.editMemoId !== prevGlobalStateRef.current.editMemoId
|
||||
) {
|
||||
if (editorState.editMemoId) {
|
||||
memoService.getMemoById(editorState.editMemoId ?? UNKNOWN_ID).then((memo) => {
|
||||
if (memo) {
|
||||
setState({
|
||||
...state,
|
||||
resourceList: memo.resourceList,
|
||||
});
|
||||
handleEditorFocus();
|
||||
editorStateService.setMemoVisibility(memo.visibility);
|
||||
editorRef.current?.setContent(memo.content ?? "");
|
||||
editorRef.current?.focus();
|
||||
setState((state) => {
|
||||
return {
|
||||
...state,
|
||||
resourceList: memo.resourceList,
|
||||
};
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
prevGlobalStateRef.current = editorState;
|
||||
if (editorState.editMemoId) {
|
||||
storage.set({
|
||||
editingMemoIdCache: editorState.editMemoId,
|
||||
});
|
||||
} else {
|
||||
storage.remove(["editingMemoIdCache"]);
|
||||
}
|
||||
}, [state, editorState.editMemoId]);
|
||||
|
||||
prevGlobalStateRef.current = editorState;
|
||||
}, [editorState.editMemoId]);
|
||||
|
||||
const handleKeyDown = (event: React.KeyboardEvent) => {
|
||||
if (event.key === "Escape" && state.fullscreen) {
|
||||
@ -241,7 +237,6 @@ const MemoEditor: React.FC = () => {
|
||||
fullscreen: false,
|
||||
resourceList: [],
|
||||
});
|
||||
editorStateService.setMemoVisibility(setting.memoVisibility);
|
||||
setEditorContentCache("");
|
||||
storage.remove(["editingMemoVisibilityCache"]);
|
||||
editorRef.current?.setContent("");
|
||||
@ -338,7 +333,7 @@ const MemoEditor: React.FC = () => {
|
||||
const handleTagSeletorClick = useCallback((event: React.MouseEvent) => {
|
||||
if (tagSeletorRef.current !== event.target && tagSeletorRef.current?.contains(event.target as Node)) {
|
||||
editorRef.current?.insertText(`#${(event.target as HTMLElement).textContent} ` ?? "");
|
||||
editorRef.current?.focus();
|
||||
handleEditorFocus();
|
||||
}
|
||||
}, []);
|
||||
|
||||
|
@ -3,6 +3,7 @@ import { useAppSelector } from "../store";
|
||||
import { locationService, shortcutService } from "../services";
|
||||
import * as utils from "../helpers/utils";
|
||||
import { getTextWithMemoType } from "../helpers/filter";
|
||||
import Icon from "./Icon";
|
||||
import "../less/memo-filter.less";
|
||||
|
||||
const MemoFilter = () => {
|
||||
@ -16,28 +17,28 @@ const MemoFilter = () => {
|
||||
<div className={`filter-query-container ${showFilter ? "" : "!hidden"}`}>
|
||||
<span className="tip-text">{t("common.filter")}:</span>
|
||||
<div
|
||||
className={"filter-item-container " + (shortcut ? "" : "hidden")}
|
||||
className={"filter-item-container " + (shortcut ? "" : "!hidden")}
|
||||
onClick={() => {
|
||||
locationService.setMemoShortcut(undefined);
|
||||
}}
|
||||
>
|
||||
<span className="icon-text">🎯</span> {shortcut?.title}
|
||||
<Icon.Target className="icon-text" /> {shortcut?.title}
|
||||
</div>
|
||||
<div
|
||||
className={"filter-item-container " + (tagQuery ? "" : "hidden")}
|
||||
className={"filter-item-container " + (tagQuery ? "" : "!hidden")}
|
||||
onClick={() => {
|
||||
locationService.setTagQuery(undefined);
|
||||
}}
|
||||
>
|
||||
<span className="icon-text">🏷️</span> {tagQuery}
|
||||
<Icon.Tag className="icon-text" /> {tagQuery}
|
||||
</div>
|
||||
<div
|
||||
className={"filter-item-container " + (memoType ? "" : "hidden")}
|
||||
className={"filter-item-container " + (memoType ? "" : "!hidden")}
|
||||
onClick={() => {
|
||||
locationService.setMemoTypeQuery(undefined);
|
||||
}}
|
||||
>
|
||||
<span className="icon-text">📦</span> {t(getTextWithMemoType(memoType as MemoSpecType))}
|
||||
<Icon.Box className="icon-text" /> {t(getTextWithMemoType(memoType as MemoSpecType))}
|
||||
</div>
|
||||
{duration && duration.from < duration.to ? (
|
||||
<div
|
||||
@ -46,16 +47,16 @@ const MemoFilter = () => {
|
||||
locationService.setFromAndToQuery();
|
||||
}}
|
||||
>
|
||||
<span className="icon-text">🗓️</span> {utils.getDateString(duration.from)} to {utils.getDateString(duration.to)}
|
||||
<Icon.Calendar className="icon-text" /> {utils.getDateString(duration.from)} to {utils.getDateString(duration.to)}
|
||||
</div>
|
||||
) : null}
|
||||
<div
|
||||
className={"filter-item-container " + (textQuery ? "" : "hidden")}
|
||||
className={"filter-item-container " + (textQuery ? "" : "!hidden")}
|
||||
onClick={() => {
|
||||
locationService.setTextQuery("");
|
||||
}}
|
||||
>
|
||||
<span className="icon-text">🔍</span> {textQuery}
|
||||
<Icon.Search className="icon-text" /> {textQuery}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@ -68,8 +68,10 @@ const SystemSection = () => {
|
||||
className="w-full"
|
||||
sx={{
|
||||
fontFamily: "monospace",
|
||||
fontSize: "14px",
|
||||
}}
|
||||
minRows={5}
|
||||
maxRows={10}
|
||||
defaultValue={state.additionalStyle}
|
||||
onChange={(event) => handleAdditionalStyleChanged(event.target.value)}
|
||||
/>
|
||||
|
@ -60,7 +60,7 @@
|
||||
@apply rounded-full;
|
||||
|
||||
> .value-text {
|
||||
@apply text-sm w-full;
|
||||
@apply text-xs w-full;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -9,7 +9,11 @@
|
||||
}
|
||||
|
||||
> .filter-item-container {
|
||||
@apply px-2 mr-2 cursor-pointer bg-gray-200 rounded whitespace-nowrap truncate hover:line-through;
|
||||
@apply flex flex-row justify-start items-center px-2 mr-2 cursor-pointer bg-gray-200 rounded whitespace-nowrap truncate hover:line-through;
|
||||
max-width: 256px;
|
||||
|
||||
> .icon-text {
|
||||
@apply w-4 h-auto mr-1 text-gray-500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -5,7 +5,6 @@
|
||||
|
||||
> .images-wrapper {
|
||||
@apply flex flex-row justify-start items-start mt-2 w-full overflow-x-auto overflow-y-hidden pb-1;
|
||||
.pretty-scroll-bar(0, 2px);
|
||||
|
||||
> .memo-img {
|
||||
@apply mr-2 last:mr-0 w-auto h-auto shrink-0 grow-0 overflow-y-hidden;
|
||||
|
@ -3,7 +3,6 @@ import store from "../store";
|
||||
import { setQuery, setPathname, Query, updateStateWithLocation } from "../store/modules/location";
|
||||
|
||||
const updateLocationUrl = (method: "replace" | "push" = "replace") => {
|
||||
store.dispatch(updateStateWithLocation());
|
||||
const { query, pathname, hash } = store.getState().location;
|
||||
let queryString = stringify(query);
|
||||
if (queryString) {
|
||||
@ -17,6 +16,7 @@ const updateLocationUrl = (method: "replace" | "push" = "replace") => {
|
||||
} else {
|
||||
window.history.pushState(null, "", pathname + hash + queryString);
|
||||
}
|
||||
store.dispatch(updateStateWithLocation());
|
||||
};
|
||||
|
||||
const locationService = {
|
||||
|
Loading…
Reference in New Issue
Block a user