@raketa-cloud/admin 0.0.64 → 0.0.65

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@raketa-cloud/admin",
3
- "version": "0.0.64",
3
+ "version": "0.0.65",
4
4
  "main": "src/index.js",
5
5
  "scripts": {
6
6
  "dev": "npx tailwindcss -i ./src/styles/application.css -o ../../apps/admin/static/application.css --watch",
@@ -20,6 +20,8 @@
20
20
  <tr>
21
21
  <th><%- sort_button("Title", "title", _context) %></th>
22
22
  <th>Visibility</th>
23
+ <th><%- sort_button("Publish at", "publish_at", _context) %></th>
24
+ <th><%- sort_button("Last change", "updated_at", _context) %></th>
23
25
  <th>Translations</th>
24
26
  </tr>
25
27
  </thead>
@@ -75,6 +77,30 @@
75
77
  </div>
76
78
  </td>
77
79
 
80
+ <td>
81
+ <time data-pretty-datetime datetime="<%= item.publishAt %>"><%= item.publishAt %></time>
82
+ </td>
83
+
84
+ <td>
85
+ <div class="body-3 text-raketa-foreground/50">
86
+ <div class="flex items-center gap-1 mb-0.5">
87
+ <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4 text-raketa-foreground">
88
+ <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
89
+ </svg>
90
+ <time data-pretty-datetime datetime="<%= item.updatedAt %>"><%= item.updatedAt %></time>
91
+ </div>
92
+
93
+ <div class="flex items-center gap-1" title="<%= item.changes[0]?.operatorMeta?.name %>">
94
+ <% if (item.changes[0]?.operatorMeta?.avatar) { %>
95
+ <img src="<%= item.changes[0]?.operatorMeta?.avatar %>" class="size-4 rounded-full" alt="<%= item.changes[0]?.operatorMeta?.name %>">
96
+ <% } else { %>
97
+ <div class="size-4 rounded-full"></div>
98
+ <% } %>
99
+ <%= item.changes[0]?.operatorMeta?.name %>
100
+ </div>
101
+ </div>
102
+ </td>
103
+
78
104
  <td>
79
105
  <div class="flex flex-wrap items-center gap-1">
80
106
  <% Object.keys(_context.locales).forEach(key => { %>
@@ -142,4 +168,4 @@
142
168
  searchToggle.addEventListener('click', () => {
143
169
  sidebar.classList.toggle('hidden');
144
170
  });
145
- </script>
171
+ </script>
@@ -77,7 +77,7 @@
77
77
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
78
78
  </svg>
79
79
 
80
- <%= (new Date(revision.insertedAt)).toLocaleString() %>
80
+ <time data-pretty-datetime datetime="<%= revision.insertedAt %>"><%= revision.insertedAt %></time>
81
81
  </div>
82
82
  </div>
83
83
  </td>
@@ -133,7 +133,7 @@
133
133
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
134
134
  </svg>
135
135
 
136
- <%= (new Date(change.insertedAt)).toLocaleString() %>
136
+ <time data-pretty-datetime datetime="<%= change.insertedAt %>"><%= change.insertedAt %></time>
137
137
  </div>
138
138
  </div>
139
139
  </td>
@@ -20,6 +20,8 @@
20
20
  <tr>
21
21
  <th><%- sort_button("Title", "title", _context) %></th>
22
22
  <th>Visibility</th>
23
+ <th><%- sort_button("Publish at", "publish_at", _context) %></th>
24
+ <th><%- sort_button("Last change", "updated_at", _context) %></th>
23
25
  <th>Translations</th>
24
26
  </tr>
25
27
  </thead>
@@ -75,6 +77,30 @@
75
77
  </div>
76
78
  </td>
77
79
 
80
+ <td>
81
+ <time data-pretty-datetime datetime="<%= item.publishAt %>"><%= item.publishAt %></time>
82
+ </td>
83
+
84
+ <td>
85
+ <div class="body-3 text-raketa-foreground/50">
86
+ <div class="flex items-center gap-1 mb-0.5">
87
+ <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4 text-raketa-foreground">
88
+ <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
89
+ </svg>
90
+ <time data-pretty-datetime datetime="<%= item.updatedAt %>"><%= item.updatedAt %></time>
91
+ </div>
92
+
93
+ <div class="flex items-center gap-1" title="<%= item.changes[0]?.operatorMeta?.name %>">
94
+ <% if (item.changes[0]?.operatorMeta?.avatar) { %>
95
+ <img src="<%= item.changes[0]?.operatorMeta?.avatar %>" class="size-4 rounded-full" alt="<%= item.changes[0]?.operatorMeta?.name %>">
96
+ <% } else { %>
97
+ <div class="size-4 rounded-full"></div>
98
+ <% } %>
99
+ <%= item.changes[0]?.operatorMeta?.name %>
100
+ </div>
101
+ </div>
102
+ </td>
103
+
78
104
  <td>
79
105
  <div class="flex flex-wrap items-center gap-1">
80
106
  <% Object.keys(_context.locales).forEach(key => { %>
@@ -142,4 +168,4 @@
142
168
  searchToggle.addEventListener('click', () => {
143
169
  sidebar.classList.toggle('hidden');
144
170
  });
145
- </script>
171
+ </script>
@@ -77,7 +77,7 @@
77
77
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
78
78
  </svg>
79
79
 
80
- <%= (new Date(revision.insertedAt)).toLocaleString() %>
80
+ <time data-pretty-datetime datetime="<%= revision.insertedAt %>"><%= revision.insertedAt %></time>
81
81
  </div>
82
82
  </div>
83
83
  </td>
@@ -133,7 +133,7 @@
133
133
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
134
134
  </svg>
135
135
 
136
- <%= (new Date(change.insertedAt)).toLocaleString() %>
136
+ <time data-pretty-datetime datetime="<%= change.insertedAt %>"><%= change.insertedAt %></time>
137
137
  </div>
138
138
  </div>
139
139
  </td>
@@ -143,10 +143,22 @@
143
143
 
144
144
  parent.querySelectorAll('[data-auto="1"]').forEach(node => node.remove())
145
145
 
146
+ // Add user's localtime
147
+ const strTime = fakeUTCDate.toLocaleString("en-GB", {});
148
+
149
+ const hint = document.createElement("div");
150
+
151
+ hint.classList.add('hint')
152
+ hint.innerText = `In your local time: ${strTime}`;
153
+ hint.dataset.auto = "1";
154
+
155
+ parent.appendChild(hint)
156
+
146
157
  TIMEZONES.forEach(timeZone => {
147
- const strTime = fakeUTCDate.toLocaleString("en-EU", {
158
+ const strTime = fakeUTCDate.toLocaleString("en-GB", {
148
159
  timeZone: `${timeZone.value}`
149
160
  });
161
+
150
162
  const hint = document.createElement("div");
151
163
 
152
164
  hint.classList.add('hint')
@@ -156,12 +168,6 @@
156
168
  parent.appendChild(hint)
157
169
  })
158
170
  }
159
-
160
- document.querySelectorAll('input[type="datetime-local"]').forEach(input => {
161
- enhanceDateTimeInputs(input);
162
-
163
- input.addEventListener("change", (event) => enhanceDateTimeInputs(event.target))
164
- })
165
171
  </script>
166
172
 
167
173
  <script>
@@ -183,6 +189,29 @@
183
189
  })
184
190
  })
185
191
  </script>
192
+
193
+ <script>
194
+ window.addEventListener("load", (_event) => {
195
+
196
+ // Setup datetime inputs
197
+ document.querySelectorAll('input[type="datetime-local"]').forEach(input => {
198
+ enhanceDateTimeInputs(input);
199
+
200
+ input.addEventListener("change", (event) => enhanceDateTimeInputs(event.target))
201
+ })
202
+
203
+
204
+ // Setup time presentation
205
+ document.querySelectorAll('time[data-pretty-datetime]').forEach(item => {
206
+ const dateStr = item.getAttribute("datetime");
207
+
208
+ item.innerText = new Date(dateStr).toLocaleString('en-GB', {
209
+ dateStyle: "short",
210
+ timeStyle: "short"
211
+ })
212
+ })
213
+ })
214
+ </script>
186
215
  </body>
187
216
 
188
217
  </html>
@@ -20,6 +20,7 @@
20
20
  <tr>
21
21
  <th><%- sort_button("Title", "title", _context) %></th>
22
22
  <th>Visibility</th>
23
+ <th><%- sort_button("Last change", "updated_at", _context) %></th>
23
24
  <th>Translations</th>
24
25
  </tr>
25
26
  </thead>
@@ -75,6 +76,26 @@
75
76
  </div>
76
77
  </td>
77
78
 
79
+ <td>
80
+ <div class="body-3 text-raketa-foreground/50">
81
+ <div class="flex items-center gap-1 mb-0.5">
82
+ <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4 text-raketa-foreground">
83
+ <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
84
+ </svg>
85
+ <time data-pretty-datetime datetime="<%= item.updatedAt %>"><%= item.updatedAt %></time>
86
+ </div>
87
+
88
+ <div class="flex items-center gap-1" title="<%= item.changes[0]?.operatorMeta?.name %>">
89
+ <% if (item.changes[0]?.operatorMeta?.avatar) { %>
90
+ <img src="<%= item.changes[0]?.operatorMeta?.avatar %>" class="size-4 rounded-full" alt="<%= item.changes[0]?.operatorMeta?.name %>">
91
+ <% } else { %>
92
+ <div class="size-4 rounded-full"></div>
93
+ <% } %>
94
+ <%= item.changes[0]?.operatorMeta?.name %>
95
+ </div>
96
+ </div>
97
+ </td>
98
+
78
99
  <td>
79
100
  <div class="flex flex-wrap items-center gap-1">
80
101
  <% Object.keys(_context.locales).forEach(key => { %>
@@ -142,4 +163,4 @@
142
163
  searchToggle.addEventListener('click', () => {
143
164
  sidebar.classList.toggle('hidden');
144
165
  });
145
- </script>
166
+ </script>
@@ -91,7 +91,7 @@
91
91
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
92
92
  </svg>
93
93
 
94
- <%= (new Date(revision.insertedAt)).toLocaleString() %>
94
+ <time data-pretty-datetime datetime="<%= revision.insertedAt %>"><%= revision.insertedAt %></time>
95
95
  </div>
96
96
  </div>
97
97
  </td>
@@ -147,7 +147,7 @@
147
147
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
148
148
  </svg>
149
149
 
150
- <%= (new Date(change.insertedAt)).toLocaleString() %>
150
+ <time data-pretty-datetime datetime="<%= change.insertedAt %>"><%= change.insertedAt %></time>
151
151
  </div>
152
152
  </div>
153
153
  </td>
@@ -54,7 +54,7 @@
54
54
  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
55
55
  </svg>
56
56
 
57
- <%= new Date(item.updatedAt).toLocaleString('en-GB', { dateStyle: "short", timeStyle: "short" }) %>
57
+ <time data-pretty-datetime datetime="<%= item.updatedAt %>"><%= item.updatedAt %></time>
58
58
  </div>
59
59
  </td>
60
60
  <td class="actions">
@@ -72,4 +72,4 @@
72
72
  </table>
73
73
 
74
74
  <%- pagination(items.pagination, _context) %>
75
- </div>
75
+ </div>
@@ -29,7 +29,7 @@
29
29
  </tr>
30
30
  <tr>
31
31
  <th class="w-1 whitespace-nowrap">Updated at</th>
32
- <td><%= new Date(item.updatedAt).toLocaleString('en-GB', { dateStyle: "short", timeStyle: "short" }) %></td>
32
+ <time data-pretty-datetime datetime="<%= item.updatedAt %>"><%= item.updatedAt %></time>
33
33
  </tr>
34
34
  </tbody>
35
35
  </table>
@@ -52,9 +52,9 @@
52
52
  <td><%= item.version %></td>
53
53
  <td><%= item.title %></td>
54
54
  <td><%= item.operatorMeta.name %></td>
55
- <td><%= new Date(item.insertedAt).toLocaleString('en-GB', { dateStyle: "short", timeStyle: "short" }) %></td>
55
+ <td><time data-pretty-datetime datetime="<%= item.insertedAt %>"><%= item.insertedAt %></time></td>
56
56
  </tr>
57
57
  <% }) %>
58
58
  </tbody>
59
59
  </table>
60
- </div>
60
+ </div>