src/render/mail.ts

   1 import { DateTime } from "luxon";
   2 import { MessageWithNames } from "../repository/mail";
   3 import { topbar } from "./topbar";
   4
   5 export function renderMailroom(mail: MessageWithNames[]): string {
   6     return `
   7     <div hx-trigger="every 600s" hx-get="/poll/mailroom">
   8     <h2 data-augmented-ui="tl-clip bl-clip none">Mail</h2>
   9     <table>
  10     <tr>
  11         <th>From</th>
  12         <th>Subject</th>
  13         <th>Sent At</th>
  14     </tr>
  15     ${mail.map(msg => {
  16         return `
  17         <tr class="${msg.read_at === 0 ? 'unread': 'read'}" >
  18             <td>${msg.username}</td>
  19             <td>
  20             <a href="#" hx-trigger="click" hx-get="/messages/${msg.id}" hx-target="#individual-message">
  21                 ${msg.subject}
  22             </a>
  23             </td>
  24             <td>${DateTime.fromMillis(msg.sent_at)}</td>
  25         </tr>
  26         `;
  27     }).join("\n")}
  28     </table>
  29     <div id="individual-message"></div>
  30     </div>
  31     `;
  32 }
  33
  34 export function renderMessage(msg: MessageWithNames): string {
  35     return `
  36     <table>
  37     <tr>
  38         <th>From</th>
  39         <td>${msg.username}</td>
  40     </tr>
  41     <tr>
  42         <th>Sent</th>
  43         <td>${DateTime.fromMillis(msg.sent_at)}</td>
  44     </tr>
  45     <tr>
  46         <th>Subject</th>
  47         <td>${msg.subject}</td>
  48     </tr>
  49     <tr>
  50         <th valign="top">Message</th>
  51         <td>${msg.message}</td>
  52     </tr>
  53     </table>
  54     `;
  55 }