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

chore: update date time format

Browse Source
This commit is contained in:
johnnyjoy
2025-06-03 21:22:14 +08:00
parent 6d319900d6
commit 94d1e20570
2 changed files with 17 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
web/src/components/DateTimeInput.tsx
View File

@@ -1,34 +1,34 @@
import dayjs from "dayjs";
import { isEqual } from "lodash-es";
import toast from "react-hot-toast";
import { cn } from "@/utils";
const DATE_TIME_FORMAT = "M/D/YYYY, H:mm:ss";
// convert Date to datetime string.
const formatDate = (date: Date | undefined): string => {
return dayjs(date).format("M/D/YYYY, H:mm:ss");
const formatDate = (date: Date): string => {
return dayjs(date).format(DATE_TIME_FORMAT);
};
interface Props {
value: Date | undefined;
originalValue: Date | undefined;
value: Date;
onChange: (date: Date) => void;
}
const DateTimeInput: React.FC<Props> = ({ value, originalValue, onChange }) => {
const DateTimeInput: React.FC<Props> = ({ value, onChange }) => {
return (
<input
type="text"
className={cn(
"px-1 bg-transparent rounded text-xs transition-all",
"border-transparent outline-none focus:border-gray-300 dark:focus:border-zinc-700",
!isEqual(value, originalValue) && "border-gray-300 dark:border-zinc-700",
"border",
)}
defaultValue={formatDate(value)}
onBlur={(e) => {
const inputValue = e.target.value;
if (inputValue) {
const date = new Date(inputValue);
const date = dayjs(inputValue, DATE_TIME_FORMAT, true).toDate();
// Check if the date is valid.
if (!isNaN(date.getTime())) {
onChange(date);
} else {
@@ -37,7 +37,7 @@ const DateTimeInput: React.FC<Props> = ({ value, originalValue, onChange }) => {
}
}
}}
placeholder="M/D/YYYY, H:mm:ss"
placeholder={DATE_TIME_FORMAT}
/>
);
};

14
web/src/components/MemoEditor/index.tsx
View File

@@ -74,8 +74,6 @@ const MemoEditor = observer((props: Props) => {
});
const [createTime, setCreateTime] = useState<Date | undefined>();
const [updateTime, setUpdateTime] = useState<Date | undefined>();
const [originalCreateTime, setOriginalCreateTime] = useState<Date | undefined>();
const [originalUpdateTime, setOriginalUpdateTime] = useState<Date | undefined>();
const [hasContent, setHasContent] = useState<boolean>(false);
const [isVisibilitySelectorOpen, setIsVisibilitySelectorOpen] = useState(false);
const editorRef = useRef<EditorRefActions>(null);
@@ -125,8 +123,6 @@ const MemoEditor = observer((props: Props) => {
handleEditorFocus();
setCreateTime(memo.createTime);
setUpdateTime(memo.updateTime);
setOriginalCreateTime(memo.createTime);
setOriginalUpdateTime(memo.updateTime);
setState((prevState) => ({
...prevState,
memoVisibility: memo.visibility,
@@ -550,14 +546,18 @@ const MemoEditor = observer((props: Props) => {
{memoName && (
<div className="w-full -mt-1 mb-4 text-xs leading-5 px-4 opacity-60 font-mono text-gray-500 dark:text-zinc-500">
<div className="grid grid-cols-[auto_1fr] gap-x-4 gap-y-0.5 items-center">
{!isEqual(createTime, updateTime) && (
{!isEqual(createTime, updateTime) && updateTime && (
<>
<span className="text-left">Updated</span>
<DateTimeInput value={updateTime} originalValue={originalUpdateTime} onChange={setUpdateTime} />
<DateTimeInput value={updateTime} onChange={setUpdateTime} />
</>
)}
{createTime && (
<>
<span className="text-left">Created</span>
<DateTimeInput value={createTime} originalValue={originalCreateTime} onChange={setCreateTime} />
<DateTimeInput value={createTime} onChange={setCreateTime} />
</>
)}
<span className="text-left">ID</span>
<span
className="px-1 border border-transparent cursor-default"