← back to AbramsOS

views/claims.ejs

96 lines

<%- include('partials/header', { title: 'Claims' }) %>

<section class="page-head">
  <h1>Claims</h1>
  <p class="subtle" style="margin:0;color:var(--text-dim);font-size:13px">Drafts only. Nothing leaves AbramsOS without your explicit approval per action.</p>
</section>

<%
  var household = (typeof household !== 'undefined' && household) ? household : [];
  var claimitUrl = 'https://claimit.ca.gov/app/claim-search';
%>
<section class="glass" style="padding:16px 18px;margin-bottom:20px;display:flex;flex-direction:column;gap:12px">
  <header style="display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap">
    <span class="name" style="display:flex;align-items:center;gap:10px">
      <span class="icon">🐻</span>
      <strong>California Unclaimed Property</strong>
    </span>
    <a class="button" href="<%= claimitUrl %>" target="_blank" rel="noopener noreferrer">Search claimit.ca.gov ↗</a>
  </header>
  <p class="desc" style="margin:0;color:var(--text-dim);font-size:13px">
    Free official search from the California State Controller for money owed to you —
    forgotten bank accounts, refunds, uncashed checks, insurance, deposits. Search each
    household name (and prior addresses / maiden names). Filing a claim is always free.
  </p>
  <% if (household.length) { %>
    <div style="display:flex;flex-direction:column;gap:6px">
      <span class="subtle" style="font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em">Names to search</span>
      <div style="display:flex;flex-wrap:wrap;gap:8px">
        <% household.forEach(function (name) { %>
          <button type="button" class="chip" data-copy="<%= name %>"
            style="cursor:pointer;border:1px solid var(--border,#3a3a3a);background:transparent;color:inherit;border-radius:999px;padding:5px 12px;font-size:12px"
            title="Copy name, then paste into claimit.ca.gov">
            <%= name %>
          </button>
        <% }); %>
      </div>
      <span class="subtle" style="font-size:11px;color:var(--text-dim)">Tap a name to copy it, then paste into the search on claimit.ca.gov (it opens in a new tab).</span>
    </div>
  <% } else { %>
    <span class="subtle" style="font-size:12px;color:var(--text-dim)">Tip: add people in <a href="/household">Household</a> and their names will appear here as one-tap searches.</span>
  <% } %>
</section>

<% if (!claims.length) { %>
  <section class="empty glass">
    <p>No claims yet. Claims are created automatically when a reminder fires (returns window closing, warranty expiry, recall match).</p>
    <a class="button" href="/import">Go to Import</a>
  </section>
<% } else { %>
  <section class="connector-grid">
    <% claims.forEach(c => { %>
      <a class="connector-card glass" href="/claims/<%= c.id %>" style="text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:10px">
        <header>
          <span class="name">
            <span class="icon"><%= c.routing[0].toUpperCase() %></span>
            <%= c.draft_subject || (c.claim_type + ' — ' + c.routing) %>
          </span>
          <span class="status <%= c.state === 'sent' ? 'connected' : c.state === 'draft' ? 'syncing' : 'not_connected' %>">
            <%= c.state %>
          </span>
        </header>
        <p class="desc">
          <strong><%= c.claim_type %></strong> →
          <%= c.routing %>
          <% if (c.due_at) { %> · due <%= new Date(c.due_at).toLocaleDateString() %><% } %>
        </p>
        <p class="subtle" style="font-size:11px;color:var(--text-dim)">created <%= new Date(c.created_at).toLocaleString() %></p>
      </a>
    <% }) %>
  </section>
<% } %>

<script>
  // Copy a household name to the clipboard so it can be pasted into claimit.ca.gov.
  document.querySelectorAll('.chip[data-copy]').forEach(function (btn) {
    btn.addEventListener('click', function () {
      var name = btn.getAttribute('data-copy') || '';
      var done = function () {
        var prev = btn.textContent;
        btn.textContent = 'Copied ✓';
        setTimeout(function () { btn.textContent = prev; }, 1200);
      };
      if (navigator.clipboard && navigator.clipboard.writeText) {
        navigator.clipboard.writeText(name).then(done).catch(done);
      } else {
        var ta = document.createElement('textarea');
        ta.value = name; document.body.appendChild(ta); ta.select();
        try { document.execCommand('copy'); } catch (e) {}
        document.body.removeChild(ta); done();
      }
    });
  });
</script>

<%- include('partials/footer') %>