Добавлен вывод даты и времени комментариев в окне с подробностями о задаче

frontend/package-lock.json

@@ -16,6 +16,7 @@
         "@types/react": "^18.0.28",
         "@types/react-dom": "^18.0.11",
         "axios": "^1.4.0",
+        "luxon": "^3.3.0",
         "mobx": "^6.9.0",
         "mobx-react-lite": "^3.4.3",
         "mobx-state-tree": "^5.1.8",
@@ -25,6 +26,9 @@
         "react-scripts": "5.0.1",
         "typescript": "^4.9.5",
         "web-vitals": "^2.1.4"
+      },
+      "devDependencies": {
+        "@types/luxon": "^3.3.0"
       }
     },
     "node_modules/@adobe/css-tools": {
@@ -3890,6 +3894,12 @@
       "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
       "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ=="
     },
+    "node_modules/@types/luxon": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/@types/luxon/-/luxon-3.3.0.tgz",
+      "integrity": "sha512-uKRI5QORDnrGFYgcdAVnHvEIvEZ8noTpP/Bg+HeUzZghwinDlIS87DEenV5r1YoOF9G4x600YsUXLWZ19rmTmg==",
+      "dev": true
+    },
     "node_modules/@types/mime": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.1.tgz",
@@ -11629,6 +11639,14 @@
         "yallist": "^3.0.2"
       }
     },
+    "node_modules/luxon": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.3.0.tgz",
+      "integrity": "sha512-An0UCfG/rSiqtAIiBPO0Y9/zAnHUZxAMiCpTd5h2smgsj7GGmcenvrvww2cqNA8/4A5ZrD1gJpHN2mIHZQF+Mg==",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/lz-string": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
@@ -19713,6 +19731,12 @@
       "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
       "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ=="
     },
+    "@types/luxon": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/@types/luxon/-/luxon-3.3.0.tgz",
+      "integrity": "sha512-uKRI5QORDnrGFYgcdAVnHvEIvEZ8noTpP/Bg+HeUzZghwinDlIS87DEenV5r1YoOF9G4x600YsUXLWZ19rmTmg==",
+      "dev": true
+    },
     "@types/mime": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.1.tgz",
@@ -25368,6 +25392,11 @@
         "yallist": "^3.0.2"
       }
     },
+    "luxon": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.3.0.tgz",
+      "integrity": "sha512-An0UCfG/rSiqtAIiBPO0Y9/zAnHUZxAMiCpTd5h2smgsj7GGmcenvrvww2cqNA8/4A5ZrD1gJpHN2mIHZQF+Mg=="
+    },
     "lz-string": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",

frontend/package.json

@@ -11,6 +11,7 @@
     "@types/react": "^18.0.28",
     "@types/react-dom": "^18.0.11",
     "axios": "^1.4.0",
+    "luxon": "^3.3.0",
     "mobx": "^6.9.0",
     "mobx-react-lite": "^3.4.3",
     "mobx-state-tree": "^5.1.8",
@@ -44,5 +45,8 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "@types/luxon": "^3.3.0"
   }
 }

frontend/src/misc-components/issue-details-dialog.module.css

@@ -36,3 +36,8 @@
 	word-wrap: break-word;
 	/* Internet Explorer 5.5+ */
 }
+
+.dateField {
+	font-size: 7pt;
+	font-weight: normal;
+}

frontend/src/misc-components/issue-details-dialog.tsx

@@ -7,6 +7,7 @@ import Css from './issue-details-dialog.module.css';
 import * as UnreadedFlagNs from '../misc-components/unreaded-flag';
 import { SetIssueReadingTimestamp } from '../utils/unreaded-provider';
 import axios from 'axios';
+import * as Luxon from 'luxon';
 
 export const Store = types.model({
 	visible: types.boolean,
@@ -87,7 +88,6 @@ export const Comments = (props: {details?: RedmineTypes.Journal[], issue: Redmin
 	if (!comments) {
 		return <>No comments</>
 	}
-	console.debug(`Comments: details=${JSON.stringify(props.details)}`); // DEBUG
 	const list = comments.map((detail) => {
 		const key = `issueid_${props.issue.id}_commentid_${detail.id}`;
 		return <Comment data={detail} key={key}/>
@@ -98,10 +98,10 @@ export const Comments = (props: {details?: RedmineTypes.Journal[], issue: Redmin
 }
 
 export const Comment = (props: {data: RedmineTypes.Journal}): JSX.Element => {
-	console.debug(`Comment: data=${JSON.stringify(props.data)}`); // DEBUG
+	const date = Luxon.DateTime.fromISO(props.data.created_on).toFormat("dd.MM.yyyy HH:mm");
 	return (
 		<>
-			<h3>{props.data.user.name}:</h3>
+			<h3><span className={Css.dateField}>{date}</span> {props.data.user.name}:</h3>
 			<div>
 				<pre>
 					{props.data.notes || '-'}