aboutsummaryrefslogtreecommitdiff
path: root/src/ToDo-UI
diff options
context:
space:
mode:
authorAdrián Oliva <adrian.oliva@cimat.mx>2023-05-28 14:02:01 -0600
committerAdrián Oliva <adrian.oliva@cimat.mx>2023-05-28 14:02:01 -0600
commit117b8c82ef02b95d289cd1ad22f226828918a18b (patch)
tree5a8cdec24b2db8b6ed18d3663c9ff05da201644d /src/ToDo-UI
parentc1f97240230ada378d77eeb8db726e0d936169c8 (diff)
downloadToDo-App-FE-117b8c82ef02b95d289cd1ad22f226828918a18b.tar.gz
ToDo-App-FE-117b8c82ef02b95d289cd1ad22f226828918a18b.zip
Changed date format.
On the user end it displays in a human readable way. On the database it is saved in ISO format. A lot of changes had to be made to control it.
Diffstat (limited to 'src/ToDo-UI')
-rw-r--r--src/ToDo-UI/ListToDo.jsx39
-rw-r--r--src/ToDo-UI/NewToDo.jsx12
2 files changed, 44 insertions, 7 deletions
diff --git a/src/ToDo-UI/ListToDo.jsx b/src/ToDo-UI/ListToDo.jsx
index c777f8f..781f4cd 100644
--- a/src/ToDo-UI/ListToDo.jsx
+++ b/src/ToDo-UI/ListToDo.jsx
@@ -64,6 +64,14 @@ function list_of_todos(edit_button, delete_button) {
const set_done_api = set_done_function();
const set_undone_api = set_undone_function();
+ const date_options = {
+ year: "numeric",
+ month: "short",
+ day: "numeric",
+ hour: "2-digit",
+ minute: "2-digit",
+ };
+
// Table contents
var table_head = (
<thead>
@@ -114,7 +122,14 @@ function list_of_todos(edit_button, delete_button) {
</th>
<td>{item.text}</td>
<td>{item.priority}</td>
- <td>{item.due_date}</td>
+ <td>
+ {item.due_date.length == 0
+ ? ""
+ : new Date(item.due_date).toLocaleString(
+ undefined, // <- Select locale of computer.
+ date_options
+ )}
+ </td>
<td>
<div className="btn-group btn-group-sm" role="group">
{edit_button(item)}
@@ -164,7 +179,17 @@ export function ListToDos() {
function handle_open_modal(id, text, due_date, done, priority) {
set_edit_id(id);
set_edit_text(text);
- set_edit_due_date(due_date);
+ if (due_date.length == 0) {
+ set_edit_due_date("");
+ } else {
+ due_date = new Date(due_date);
+ const offset = due_date.getTimezoneOffset();
+ set_edit_due_date(
+ new Date(due_date - offset * 60 * 1000) // Ignore the timezone offset.
+ .toISOString() // Convert to ISO format (YYYY-MM-DDTHH:mm:ss.sssZ)
+ .slice(0, -1) // Get rid of the Z at the end.
+ );
+ }
set_edit_priority(priority);
}
function handle_exit_modal() {
@@ -179,14 +204,20 @@ export function ListToDos() {
edit_todo_api({
id: edit_id,
text: edit_text,
- due_date: edit_due_date,
+ due_date:
+ edit_due_date.length == 0
+ ? new Date(0)
+ : new Date(edit_due_date).toISOString(),
priority: edit_priority,
});
dispatch(
edit_todo({
id: edit_id,
text: edit_text,
- due_date: edit_due_date,
+ due_date:
+ edit_due_date.length == 0
+ ? ""
+ : new Date(edit_due_date).toISOString(),
priority: edit_priority,
})
);
diff --git a/src/ToDo-UI/NewToDo.jsx b/src/ToDo-UI/NewToDo.jsx
index 8c926b2..dc062db 100644
--- a/src/ToDo-UI/NewToDo.jsx
+++ b/src/ToDo-UI/NewToDo.jsx
@@ -59,15 +59,21 @@ export function NewToDo() {
function handle_add_todo() {
new_todo_api({
text: new_text,
- due_date: new_due_date,
+ due_date:
+ new_due_date.length == 0
+ ? ""
+ : new Date(new_due_date).toISOString(),
priority: new_priority,
});
dispatch(
add_todo({
text: new_text,
- due_date: new_due_date,
+ due_date:
+ new_due_date.length == 0
+ ? ""
+ : new Date(new_due_date).toISOString(),
priority: new_priority,
- creation_date: new Date().toString(),
+ creation_date: new Date().toISOString(),
})
);
dispatch(sort_todo());