hiccup icon indicating copy to clipboard operation
hiccup copied to clipboard

Ideas of improvement

Open Dr-Shadow opened this issue 1 year ago • 1 comments

First of all, hiccup is a great app that we use daily at our company.

I was using a modified version of hiccup and I had to import my modifications onto the latest release to make it work.

I'm now getting a full automatic sync of the config when I refresh the page which is awesome (previously the users had to manually sync the config which was not something easy to do for them).

For now, I'm just submitting ideas which have to be split onto different pull requests and i don't have any good idea on how to implement them since the base code changed a lot since then.

I'm initially requesting if the idea would be accepted or not. Then I would make a pull request if allowed.

  • Allow the edition/sync buttons/links to be disabled (Enabling the edition/sync buttons/links could be made through magic combination hotkey or IP whitelist or detected HOST header)

  • Allow the height of the feature cards to be personalized through config (We are not using images which fit in 300px but in 220px) I don't really see which others design aspects of the page would need to be personalized through config but there could be some.

  • Make a templated links section : -> Make a list of templated links -> Through a react-select component, select a machine associated to a user (firstname / lastname) or an environment name -> If a machine is selected, add links at the same line according to the list of templated links -> For example :

 "templatedLinks": {
   "listLinks": [
     {
       "name": "Application 1",
       "link": "https://app1.${VALUE}rootdomain.org"
     },
     {
       "name": "Application 2",
       "link": "https://app2.${VALUE}rootdomain.org"
     },
     {
       "name": "Application 3",
       "link": "https://app3.${VALUE}rootdomain.org"
     },
     {
       "name": "Application 4",
       "link": "https://app4.${VALUE}rootdomain.org"
     }
   ],
   "listValues": [
     {
       "firstname": "User1",
       "lastname": "Name1",
       "hostname": "machine1"
     },
     {
       "firstname": "User2",
       "lastname": "Name2",
       "hostname": "machine2"
     },
     {
       "firstname": "User3",
       "lastname": "Name3",
       "hostname": "machine3"
     },
   ]
 }

Would mean that if we select user2, we would be offered a list of links like this :

[ react-select component ] [ App1 : https://app1.machine2.rootdomain.org ] [ App2 : https://app2.machine2.rootdomain.org ] [ App3 : https://app3.machine2.rootdomain.org ]

This is interesting in a small company where we need to access live applications of different developers or environments through a "magic" reverse proxy. I'm using this schema in my private repository :

export const CONFIG_ENTITY_SCHEMA: JSONSchemaType<ConfigEntity> = {
  type: 'object',
  properties: {
   ......
    templatedLinks: {
      type: 'object',
      properties: {
        listLinks: {
          type: 'array',
          items: {
            type: 'object',
            properties: {
              name: { type: 'string' },
              link: { type: 'string' },
            },
            required: ['link', 'name'],
          },
        },
        listValues: {
          type: 'array',
          items: {
            type: 'object',
            properties: {
              firstname: { type: 'string', nullable: true },
              lastname: { type: 'string', nullable: true },
              hostname: { type: 'string' },
              altname: { type: 'string', nullable: true },
            },
            required: ['hostname'],
            oneOf: [
              {
                required: ['firstname', 'lastname'],
              },
              {
                required: ['altname'],
              },
            ],
          },
        },
      },
      required: ['listLinks', 'listValues'],
    },
  .......

Dr-Shadow avatar Jul 29 '24 15:07 Dr-Shadow

@Dr-Shadow sorry i got to your comment this late. I like all your ideas. If you want to raise PR's or outline how you want to implement this, i'm down to help get these features out.

Make a templated links section

This is the one im most curious about. Ideally i want to also have a way in the UI for a user to be able to create these as well. Did youhave any ideas onhow we can create these in the UI easily?

Also take a look at v0.5.0. Its redesigned the config management to make a lot more sense. This is in preparation of adding support for more remote storages. Dont know when i will get the time to complete it, but that should make managing these configs a lot easier

ashwin-pc avatar Sep 14 '24 12:09 ashwin-pc