feat: add support for new skin logo in space settings

src/helpers/actions.ts

@@ -2,36 +2,95 @@ import snapshot from '@snapshot-labs/snapshot.js';
 import db from './mysql';
 import { DEFAULT_NETWORK_ID, jsonParse, NETWORK_ID_WHITELIST } from './utils';
 
-export async function addOrUpdateSpace(space: string, settings: any) {
-  if (!settings?.name) return false;
-  if (settings.domain) {
-    settings.domain = settings.domain?.replace(/(^\w+:|^)\/\//, '').replace(/\/$/, '');
+const DEFAULT_SKIN = 'light';
+
+function normalizeSettings(settings: any) {
+  const _settings = snapshot.utils.clone(settings);
+
+  if (_settings.domain) {
+    _settings.domain = _settings.domain?.replace(/(^\w+:|^)\/\//, '').replace(/\/$/, '');
   }
-  if (settings.delegationPortal) {
-    settings.delegationPortal = {
+  if (_settings.delegationPortal) {
+    _settings.delegationPortal = {
       delegationNetwork: '1',
-      ...settings.delegationPortal
+      ..._settings.delegationPortal
     };
   }
 
+  delete _settings.skinParams;
+
+  return _settings;
+}
+
+export async function addOrUpdateSpace(id: string, settings: any) {
+  if (!settings?.name) return false;
+
+  const normalizedSettings = normalizeSettings(settings);
+
   const ts = (Date.now() / 1e3).toFixed();
   const query =
     'INSERT INTO spaces SET ? ON DUPLICATE KEY UPDATE updated = ?, settings = ?, name = ?, hibernated = 0, domain = ?';
 
   await db.queryAsync(query, [
     {
-      id: space,
+      id,
       name: settings.name,
       created: ts,
       updated: ts,
-      settings: JSON.stringify(settings),
+      settings: JSON.stringify(normalizedSettings),
       domain: settings.domain || null
     },
     ts,
-    JSON.stringify(settings),
+    JSON.stringify(normalizedSettings),
     settings.name,
-    settings.domain || null
+    normalizedSettings.domain || null
   ]);
+
+  await addOrUpdateSkin(id, settings.skinParams);
+}
+
+export async function addOrUpdateSkin(id: string, skinParams: Record<string, string>) {
+  if (!skinParams) return false;
+
+  const COLORS = [
+    'bg_color',
+    'link_color',
+    'text_color',
+    'content_color',
+    'border_color',
+    'heading_color',
+    'primary_color',
+    'header_color'
+  ];
+
+  const _params = snapshot.utils.clone(skinParams);
+  COLORS.forEach(color => {
+    if (_params[color]) {
+      _params[color] = _params[color].replace('#', '');
+    }
+  });
+  const existingSkin = (
+    await db.queryAsync('SELECT theme, logo FROM skins WHERE id = ? LIMIT 1', [id])
+  )[0];
+
+  await db.queryAsync(
+    `INSERT INTO skins
+      SET ?
+      ON DUPLICATE KEY UPDATE
+        ${COLORS.map(color => `${color} = ?`).join(',')},
+        theme = ?,
+        logo = ?
+    `,
+    [
+      {
+        id,
+        ..._params
+      },
+      ...COLORS.map(color => _params[color]),
+      _params.theme || existingSkin?.theme || DEFAULT_SKIN,
+      _params.logo || existingSkin?.logo || null
+    ]
+  );
 }
 
 export async function getProposal(space, id) {

test/integration/helpers/actions.test.ts

@@ -1,4 +1,9 @@
-import { addOrUpdateSpace, getSpace, sxSpaceExists } from '../../../src/helpers/actions';
+import {
+  addOrUpdateSkin,
+  addOrUpdateSpace,
+  getSpace,
+  sxSpaceExists
+} from '../../../src/helpers/actions';
 import db, { sequencerDB } from '../../../src/helpers/mysql';
 import { DEFAULT_NETWORK_ID } from '../../../src/helpers/utils';
 import { spacesSqlFixtures } from '../../fixtures/space';
@@ -166,4 +171,92 @@ describe('helpers/actions', () => {
       });
     });
   });
+
+  describe('addOrUpdateSkin', () => {
+    afterAll(async () => {
+      await db.queryAsync('DELETE FROM snapshot_sequencer_test.skins');
+    });
+
+    it('adds a new skin when it does not exist', async () => {
+      const testId = 'test-new-skin-ids';
+      const skinParams = {
+        bg_color: '#000000',
+        link_color: '#ffffff',
+        text_color: '#000000',
+        content_color: '#ffffff',
+        border_color: '#ffffff',
+        heading_color: '#ffffff',
+        primary_color: '#ffffff'
+      };
+      await addOrUpdateSkin(testId, skinParams);
+      const skin = (await db.queryAsync('SELECT * FROM skins WHERE id = ?', [testId]))[0];
+      expect(skin).toEqual({
+        id: testId,
+        bg_color: '000000',
+        link_color: 'ffffff',
+        text_color: '000000',
+        content_color: 'ffffff',
+        border_color: 'ffffff',
+        heading_color: 'ffffff',
+        primary_color: 'ffffff',
+        header_color: null,
+        theme: 'light',
+        logo: null
+      });
+    });
+
+    it('updates an existing skin', async () => {
+      const testId = 'test-update-skin-id';
+      const skinParams = {
+        bg_color: '#FFFF00',
+        link_color: '#FFFFFF'
+      };
+      await db.queryAsync(
+        'INSERT INTO skins (id, bg_color, link_color, text_color, content_color, border_color, heading_color, primary_color, header_color, theme) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)',
+        [
+          testId,
+          '000000',
+          '000000',
+          '000000',
+          '000000',
+          '000000',
+          '000000',
+          '000000',
+          '000000',
+          'light'
+        ]
+      );
+      await addOrUpdateSkin(testId, skinParams);
+      const skin = (await db.queryAsync('SELECT * FROM skins WHERE id = ?', [testId]))[0];
+      expect(skin).toEqual({
+        id: testId,
+        bg_color: 'FFFF00',
+        link_color: 'FFFFFF',
+        text_color: null,
+        content_color: null,
+        border_color: null,
+        heading_color: null,
+        primary_color: null,
+        header_color: null,
+        theme: 'light',
+        logo: null
+      });
+
+      await addOrUpdateSkin(testId, { theme: 'dark' });
+      const skin2 = (await db.queryAsync('SELECT * FROM skins WHERE id = ?', [testId]))[0];
+      expect(skin2).toEqual({
+        id: testId,
+        bg_color: null,
+        link_color: null,
+        text_color: null,
+        content_color: null,
+        border_color: null,
+        heading_color: null,
+        primary_color: null,
+        header_color: null,
+        theme: 'dark',
+        logo: null
+      });
+    });
+  });
 });

test/schema.sql

@@ -204,9 +204,10 @@ CREATE TABLE skins (
   primary_color VARCHAR(6) DEFAULT NULL,
   header_color VARCHAR(6) DEFAULT NULL,
   theme VARCHAR(5) NOT NULL DEFAULT 'light',
+  logo VARCHAR(256) DEFAULT NULL,
   PRIMARY KEY (id)
 );
-  
+
 CREATE TABLE options (
   name VARCHAR(100) NOT NULL,
   value VARCHAR(100) NOT NULL,