openvibers/openvibe.coupons Commits

Coupons: an empty home draws the kit's empty state with one button (#276)

OP OpenVibers committed 3 days ago · 8872c3ff0c · 2 files, +10 −1

With no code listed the home said so in a bare line with an underlined
link. It now uses the shared kit's empty state: an icon, a title, one
sentence and one primary button to submit the first code.
test/home-short.test.js checks the empty state and its button.

Changes

ddiff --git a/server/render/home.js b/server/render/home.js
iindex 71aea5a..b769ddf 100644
---- a/server/render/home.js
++++ b/server/render/home.js
@@@ -10,6 +10,7 @@
   */
  const ssr = require('openvibe-publishing/ssr');
  const showcase = require('openvibe-shared/showcase');
++const kit = require('openvibe-shared/kit');
  const { statusLabel, shopsSection } = require('./pages');
  const { remindLink } = require('./remind');
  // The short home (the owner's rule, 2026-10-30): the three code lists become one pick block, a row of chips picks
@@@ -101,7 +102,7 @@ function homePage(d) {
      ])}</div></section>`;
  
      return h`${hero}
--${s.active === 0 ? h`<p class="empty cp-empty">No codes are listed yet. <a href="/submit">Submit the first one</a>.</p>` : ''}
++${s.active === 0 ? raw(kit.empty({ icon: 'tag', title: 'No codes yet', text: 'No coupon code has been listed yet.', action: { href: '/submit', label: 'Submit the first code', icon: 'plus' } })) : ''}
  ${raw(pickBlock({
      key: 'codes',
      label: 'Codes',
ddiff --git a/test/home-short.test.js b/test/home-short.test.js
iindex ce1cd7a..ac8e4ad 100644
---- a/test/home-short.test.js
++++ b/test/home-short.test.js
@@@ -11,6 +11,14 @@ const { boot, check, done } = require('./helpers/boot');
      const t = await boot();
      const alice = t.network.addUser('alice');
      try {
++        await check('the empty home draws the kit empty state with one button', async () => {
++            const r = await t.get('/');
++            assert.strictEqual(r.status, 200);
++            assert.match(r.text, /class="ovk-empty"/, 'the kit empty state is used, not a bare sentence');
++            assert.match(r.text, /No coupon code has been listed yet/);
++            assert.match(r.text, /class="ovk-btn[^"]*" href="\/submit"/, 'the empty state offers one button forward');
++        });
++
          await check('setup: a shop and a code, so the lists have something to show', async () => {
              const shop = await t.merchant({ name: 'Green Grocer', host: 'greengrocer.co.uk' });
              const r = await t.get('/submit', { as: alice, form: { csrf: t.csrf(alice), merchant: shop.slug, code: 'VEG5', title: 'Five pounds off veg boxes', expires: '', min_spend_amount: '30', min_spend_currency: 'gbp', regions: 'GB' } });