mirror of
https://github.com/usememos/memos.git
synced 2025-06-05 22:09:59 +02:00
feat: customize memo list sorting rules (#312)
* chore: update .gitignore * feat: 添加Memo列表按更新时间排序 * fix go-static-checks * update * update * update Memo.tsx/MemoList.tsx * handle conflict Co-authored-by: boojack <stevenlgtm@gmail.com>
This commit is contained in:
@ -7,6 +7,7 @@ import { useNavigate } from "react-router-dom";
|
||||
import "dayjs/locale/zh";
|
||||
import { UNKNOWN_ID } from "../helpers/consts";
|
||||
import { editorStateService, locationService, memoService, userService } from "../services";
|
||||
import { useAppSelector } from "../store";
|
||||
import Icon from "./Icon";
|
||||
import toastHelper from "./Toast";
|
||||
import MemoContent from "./MemoContent";
|
||||
@ -22,19 +23,21 @@ interface Props {
|
||||
memo: Memo;
|
||||
}
|
||||
|
||||
export const getFormatedMemoCreatedAtStr = (createdTs: number, locale = "en"): string => {
|
||||
if (Date.now() - createdTs < 1000 * 60 * 60 * 24) {
|
||||
return dayjs(createdTs).locale(locale).fromNow();
|
||||
export const getFormatedMemoTimeStr = (time: number, locale = "en"): string => {
|
||||
if (Date.now() - time < 1000 * 60 * 60 * 24) {
|
||||
return dayjs(time).locale(locale).fromNow();
|
||||
} else {
|
||||
return dayjs(createdTs).locale(locale).format("YYYY/MM/DD HH:mm:ss");
|
||||
return dayjs(time).locale(locale).format("YYYY/MM/DD HH:mm:ss");
|
||||
}
|
||||
};
|
||||
|
||||
const Memo: React.FC<Props> = (props: Props) => {
|
||||
const memo = props.memo;
|
||||
const user = useAppSelector((state) => state.user.user);
|
||||
const { t, i18n } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const [createdAtStr, setCreatedAtStr] = useState<string>(getFormatedMemoCreatedAtStr(memo.createdTs, i18n.language));
|
||||
const [createdAtStr, setCreatedAtStr] = useState<string>(getFormatedMemoTimeStr(memo.createdTs, i18n.language));
|
||||
const [updatedAtStr, setUpdatedAtStr] = useState<string>(getFormatedMemoTimeStr(memo.updatedTs, i18n.language));
|
||||
const memoContainerRef = useRef<HTMLDivElement>(null);
|
||||
const isVisitorMode = userService.isVisitorMode();
|
||||
|
||||
@ -42,7 +45,8 @@ const Memo: React.FC<Props> = (props: Props) => {
|
||||
let intervalFlag: any = -1;
|
||||
if (Date.now() - memo.createdTs < 1000 * 60 * 60 * 24) {
|
||||
intervalFlag = setInterval(() => {
|
||||
setCreatedAtStr(getFormatedMemoCreatedAtStr(memo.createdTs, i18n.language));
|
||||
setCreatedAtStr(getFormatedMemoTimeStr(memo.createdTs, i18n.language));
|
||||
setUpdatedAtStr(getFormatedMemoTimeStr(memo.updatedTs, i18n.language));
|
||||
}, 1000 * 1);
|
||||
}
|
||||
|
||||
@ -182,12 +186,13 @@ const Memo: React.FC<Props> = (props: Props) => {
|
||||
editorStateService.setEditMemoWithId(memo.id);
|
||||
};
|
||||
|
||||
const timeStr = user?.setting.memoSortOption === "created_ts" ? createdAtStr : `${t("common.update-on")} ${updatedAtStr}`;
|
||||
return (
|
||||
<div className={`memo-wrapper ${"memos-" + memo.id} ${memo.pinned ? "pinned" : ""}`} ref={memoContainerRef}>
|
||||
<div className="memo-top-wrapper">
|
||||
<div className="status-text-container">
|
||||
<span className="time-text" onClick={handleShowMemoStoryDialog}>
|
||||
{createdAtStr}
|
||||
{timeStr}
|
||||
</span>
|
||||
{memo.visibility !== "PRIVATE" && !isVisitorMode && (
|
||||
<span className={`status-text ${memo.visibility.toLocaleLowerCase()}`}>{memo.visibility}</span>
|
||||
|
Reference in New Issue
Block a user