joshfarrant/shortcuts-js

Add icon color/glyph parameters

Closed this issue · 5 comments

I'm not familiar with typescript and was hoping to create a PR that allows additional parameters to be passed with the buildShortcut function to allow custom icon color/glyph.

I've tested this with the package when it's been built and it works well.

My idea of the implementation is to pass an object shortcutIcon with color and glyph as keys within the object.

This parameter would be used in buildShortcutTemplate and each value applied as below:

exports.buildShortcutTemplate = (actions = [], shortcutIcon) => ({
    WFWorkflowClientVersion: '724',
    WFWorkflowClientRelease: '2.1',
    WFWorkflowIcon: {
        WFWorkflowIconStartColor: shortcutIcon.color,
        WFWorkflowIconGlyphNumber: shortcutIcon.glyph,
    },

Hey @gcordalis, sounds like a great idea!

My only suggestion would be have an options object, rather than an shortcutIcon object, as in the future we might want to add additional configurable options (import questions, input types, etc).

Maybe then, your example could be as follows:

exports.buildShortcutTemplate = (actions = [], options) => ({
  WFWorkflowClientVersion: '724',
  WFWorkflowClientRelease: '2.1',
  WFWorkflowIcon: {
      WFWorkflowIconStartColor: options.icon.color,
      WFWorkflowIconGlyphNumber: options.icon.glyph,
  },
  // ...
};

The other thing to consider is how the user will actually select their icon/colour. We'll likely need to store the values of the different available colours / glyphs, to make it easy for the user to select.

Maybe we could have something like:

import {
  buildShortcut,
  ICON,
} from '@joshfarrant/shortcuts-js';

buildShortcut([], {
  icon: {
    color: ICON.COLORS.ORANGE,
    glyph: ICON.GLYPHS.ROCKET,
  },
});

Or, we could pull in the icon info from elsewhere:

import {
  buildShortcut,
} from '@joshfarrant/shortcuts-js';

import {
  ICON,
} from '@joshfarrant/shortcuts-js/meta';

buildShortcut([], {
  icon: {
    color: ICON.COLORS.ORANGE,
    glyph: ICON.GLYPHS.ROCKET,
  },
});

The later method gives us more flexibility down the road when it comes to things like WFWorkflowInputContentItemClasses and WFWorkflowTypes (see here).

Input on this would be great, but feel free to crack on with it in the meantime! And if you'd like any help with the TS side of things just let me know 😃.

Options sounds great and definitely adds flexibility down the road.

I’ve got all the colours stored, working on glyphs today (hopefully getting the names and codes isn’t a pain) then I’ll have a crack at the TS side again.

... hopefully getting the names and codes isn’t a pain ...

It shouldn't be if you know where to look.

It shouldn't be if you know where to look.

Fantastic! 🎉

Closing this as the main feature discussed here has been implemented. Further discussion can either be done in its own issue, or in #45 if relevant. 🙂