github.com/iqoqo/nomad@v0.11.3-0.20200911112621-d7021c74d101/ui/stories/components/diff-viewer.stories.js (about)

     1  import hbs from 'htmlbars-inline-precompile';
     2  
     3  export default {
     4    title: 'Components|Diff Viewer',
     5  };
     6  
     7  export let DiffViewerWithInsertions = () => {
     8    return {
     9      template: hbs`
    10        <h5 class="title is-5">Diff Viewer with insertions</h5>
    11        <div class="boxed-section">
    12          <div class="boxed-section-body is-dark">
    13            {{job-diff diff=insertionsOnly}}
    14          </div>
    15        </div>
    16        `,
    17      context: {
    18        insertionsOnly: generateDiff([
    19          { Annotations: null, Name: 'Attempts', New: '15', Old: '15', Type: 'None' },
    20          { Annotations: null, Name: 'Delay', New: '25000000000', Old: '', Type: 'Added' },
    21          { Annotations: null, Name: 'Interval', New: '900000000000', Old: '', Type: 'Added' },
    22          { Annotations: null, Name: 'Mode', New: 'delay', Old: 'delay', Type: 'None' },
    23        ]),
    24      },
    25    };
    26  };
    27  
    28  export let DiffViewerWithDeletions = () => {
    29    return {
    30      template: hbs`
    31        <h5 class="title is-5">Diff Viewer with deletions</h5>
    32        <div class="boxed-section">
    33          <div class="boxed-section-body is-dark">
    34            {{job-diff diff=deletionsOnly}}
    35          </div>
    36        </div>
    37        `,
    38      context: {
    39        deletionsOnly: generateDiff([
    40          { Annotations: null, Name: 'Attempts', New: '15', Old: '15', Type: 'None' },
    41          {
    42            Annotations: null,
    43            Name: 'Delay',
    44            New: '25000000000',
    45            Old: '25000000000',
    46            Type: 'None',
    47          },
    48          {
    49            Annotations: null,
    50            Name: 'Interval',
    51            New: '900000000000',
    52            Old: '900000000000',
    53            Type: 'None',
    54          },
    55          { Annotations: null, Name: 'Mode', New: '', Old: 'delay', Type: 'Deleted' },
    56        ]),
    57      },
    58    };
    59  };
    60  
    61  export let DiffViewerWithEdits = () => {
    62    return {
    63      template: hbs`
    64        <h5 class="title is-5">Diff Viewer with edits</h5>
    65        <div class="boxed-section">
    66          <div class="boxed-section-body is-dark">
    67            {{job-diff diff=editsOnly}}
    68          </div>
    69          <p class="annotation">Often times a diff will only have a couple lines. Minor tweaks to a job spec result in small diffs.</p>
    70        </div>
    71        `,
    72      context: {
    73        editsOnly: generateDiff([
    74          { Annotations: null, Name: 'Attempts', New: '15', Old: '15', Type: 'None' },
    75          {
    76            Annotations: null,
    77            Name: 'Delay',
    78            New: '25000000000',
    79            Old: '25000000000',
    80            Type: 'None',
    81          },
    82          {
    83            Annotations: null,
    84            Name: 'Interval',
    85            New: '900000000000',
    86            Old: '250000000000',
    87            Type: 'Edited',
    88          },
    89          { Annotations: null, Name: 'Mode', New: 'delay', Old: 'delay', Type: 'None' },
    90        ]),
    91      },
    92    };
    93  };
    94  
    95  export let DiffViewerWithManyChanges = () => {
    96    return {
    97      template: hbs`
    98        <h5 class="title is-5">Diff Viewer with many changes</h5>
    99        <div class="boxed-section">
   100          <div class="boxed-section-body is-dark">
   101            {{job-diff diff=largeDiff}}
   102          </div>
   103        </div>
   104        `,
   105      context: {
   106        largeDiff: {
   107          Fields: null,
   108          ID: 'example',
   109          Objects: null,
   110          TaskGroups: [
   111            {
   112              Fields: null,
   113              Name: 'cache',
   114              Objects: null,
   115              Tasks: [
   116                {
   117                  Annotations: null,
   118                  Fields: [
   119                    {
   120                      Annotations: null,
   121                      Name: 'Meta[one]',
   122                      New: "flew over the cuckoo's nest",
   123                      Old: '',
   124                      Type: 'Added',
   125                    },
   126                    {
   127                      Annotations: null,
   128                      Name: 'Meta[two]',
   129                      New: 'birds on a wire',
   130                      Old: '',
   131                      Type: 'Added',
   132                    },
   133                  ],
   134                  Name: 'redis',
   135                  Objects: [
   136                    {
   137                      Fields: [
   138                        {
   139                          Annotations: null,
   140                          Name: 'image',
   141                          New: 'redis:3.4',
   142                          Old: 'redis:3.2',
   143                          Type: 'Edited',
   144                        },
   145                        {
   146                          Annotations: null,
   147                          Name: 'port_map[0][db]',
   148                          New: '6380',
   149                          Old: '6379',
   150                          Type: 'Edited',
   151                        },
   152                      ],
   153                      Name: 'Config',
   154                      Objects: null,
   155                      Type: 'Edited',
   156                    },
   157                    {
   158                      Fields: [
   159                        { Annotations: null, Name: 'CPU', New: '1000', Old: '500', Type: 'Edited' },
   160                        { Annotations: null, Name: 'DiskMB', New: '0', Old: '0', Type: 'None' },
   161                        { Annotations: null, Name: 'IOPS', New: '0', Old: '0', Type: 'None' },
   162                        {
   163                          Annotations: null,
   164                          Name: 'MemoryMB',
   165                          New: '512',
   166                          Old: '256',
   167                          Type: 'Edited',
   168                        },
   169                      ],
   170                      Name: 'Resources',
   171                      Objects: [
   172                        {
   173                          Fields: [
   174                            { Annotations: null, Name: 'MBits', New: '100', Old: '', Type: 'Added' },
   175                          ],
   176                          Name: 'Network',
   177                          Objects: [
   178                            {
   179                              Fields: [
   180                                {
   181                                  Annotations: null,
   182                                  Name: 'Label',
   183                                  New: 'db',
   184                                  Old: '',
   185                                  Type: 'Added',
   186                                },
   187                              ],
   188                              Name: 'Dynamic Port',
   189                              Objects: null,
   190                              Type: 'Added',
   191                            },
   192                          ],
   193                          Type: 'Added',
   194                        },
   195                        {
   196                          Fields: [
   197                            { Annotations: null, Name: 'MBits', New: '', Old: '10', Type: 'Deleted' },
   198                          ],
   199                          Name: 'Network',
   200                          Objects: [
   201                            {
   202                              Fields: [
   203                                {
   204                                  Annotations: null,
   205                                  Name: 'Label',
   206                                  New: '',
   207                                  Old: 'db',
   208                                  Type: 'Deleted',
   209                                },
   210                              ],
   211                              Name: 'Dynamic Port',
   212                              Objects: null,
   213                              Type: 'Deleted',
   214                            },
   215                          ],
   216                          Type: 'Deleted',
   217                        },
   218                      ],
   219                      Type: 'Edited',
   220                    },
   221                    {
   222                      Fields: [
   223                        {
   224                          Annotations: null,
   225                          Name: 'AddressMode',
   226                          New: 'auto',
   227                          Old: 'auto',
   228                          Type: 'None',
   229                        },
   230                        {
   231                          Annotations: null,
   232                          Name: 'Name',
   233                          New: 'redis-cache',
   234                          Old: 'redis-cache',
   235                          Type: 'None',
   236                        },
   237                        { Annotations: null, Name: 'PortLabel', New: 'db', Old: 'db', Type: 'None' },
   238                      ],
   239                      Name: 'Service',
   240                      Objects: [
   241                        {
   242                          Fields: [
   243                            { Annotations: null, Name: 'Tags', New: 'redis', Old: '', Type: 'Added' },
   244                            {
   245                              Annotations: null,
   246                              Name: 'Tags',
   247                              New: 'cache',
   248                              Old: 'cache',
   249                              Type: 'None',
   250                            },
   251                            {
   252                              Annotations: null,
   253                              Name: 'Tags',
   254                              New: 'global',
   255                              Old: 'global',
   256                              Type: 'None',
   257                            },
   258                          ],
   259                          Name: 'Tags',
   260                          Objects: null,
   261                          Type: 'Added',
   262                        },
   263                        {
   264                          Fields: [
   265                            {
   266                              Annotations: null,
   267                              Name: 'AddressMode',
   268                              New: '',
   269                              Old: '',
   270                              Type: 'None',
   271                            },
   272                            { Annotations: null, Name: 'Command', New: '', Old: '', Type: 'None' },
   273                            {
   274                              Annotations: null,
   275                              Name: 'GRPCService',
   276                              New: '',
   277                              Old: '',
   278                              Type: 'None',
   279                            },
   280                            {
   281                              Annotations: null,
   282                              Name: 'GRPCUseTLS',
   283                              New: 'false',
   284                              Old: 'false',
   285                              Type: 'None',
   286                            },
   287                            {
   288                              Annotations: null,
   289                              Name: 'InitialStatus',
   290                              New: '',
   291                              Old: '',
   292                              Type: 'None',
   293                            },
   294                            {
   295                              Annotations: null,
   296                              Name: 'Interval',
   297                              New: '15000000000',
   298                              Old: '10000000000',
   299                              Type: 'Edited',
   300                            },
   301                            { Annotations: null, Name: 'Method', New: '', Old: '', Type: 'None' },
   302                            {
   303                              Annotations: null,
   304                              Name: 'Name',
   305                              New: 'alive',
   306                              Old: 'alive',
   307                              Type: 'None',
   308                            },
   309                            { Annotations: null, Name: 'Path', New: '', Old: '', Type: 'None' },
   310                            { Annotations: null, Name: 'PortLabel', New: '', Old: '', Type: 'None' },
   311                            { Annotations: null, Name: 'Protocol', New: '', Old: '', Type: 'None' },
   312                            {
   313                              Annotations: null,
   314                              Name: 'TLSSkipVerify',
   315                              New: 'false',
   316                              Old: 'false',
   317                              Type: 'None',
   318                            },
   319                            {
   320                              Annotations: null,
   321                              Name: 'Timeout',
   322                              New: '7000000000',
   323                              Old: '2000000000',
   324                              Type: 'Edited',
   325                            },
   326                            { Annotations: null, Name: 'Type', New: 'tcp', Old: 'tcp', Type: 'None' },
   327                          ],
   328                          Name: 'Check',
   329                          Objects: null,
   330                          Type: 'Edited',
   331                        },
   332                      ],
   333                      Type: 'Edited',
   334                    },
   335                  ],
   336                  Type: 'Edited',
   337                },
   338              ],
   339              Type: 'Edited',
   340              Updates: null,
   341            },
   342            {
   343              Fields: [
   344                { Annotations: null, Name: 'Count', New: '1', Old: '', Type: 'Added' },
   345                { Annotations: null, Name: 'Meta[key]', New: 'value', Old: '', Type: 'Added' },
   346                { Annotations: null, Name: 'Meta[red]', New: 'fish', Old: '', Type: 'Added' },
   347              ],
   348              Name: 'cache2',
   349              Objects: [
   350                {
   351                  Fields: [
   352                    { Annotations: null, Name: 'Attempts', New: '2', Old: '', Type: 'Added' },
   353                    { Annotations: null, Name: 'Delay', New: '15000000000', Old: '', Type: 'Added' },
   354                    {
   355                      Annotations: null,
   356                      Name: 'Interval',
   357                      New: '1800000000000',
   358                      Old: '',
   359                      Type: 'Added',
   360                    },
   361                    { Annotations: null, Name: 'Mode', New: 'fail', Old: '', Type: 'Added' },
   362                  ],
   363                  Name: 'RestartPolicy',
   364                  Objects: null,
   365                  Type: 'Added',
   366                },
   367                {
   368                  Fields: [
   369                    { Annotations: null, Name: 'Migrate', New: 'false', Old: '', Type: 'Added' },
   370                    { Annotations: null, Name: 'SizeMB', New: '300', Old: '', Type: 'Added' },
   371                    { Annotations: null, Name: 'Sticky', New: 'false', Old: '', Type: 'Added' },
   372                  ],
   373                  Name: 'EphemeralDisk',
   374                  Objects: null,
   375                  Type: 'Added',
   376                },
   377              ],
   378              Tasks: [
   379                {
   380                  Annotations: null,
   381                  Fields: [
   382                    { Annotations: null, Name: 'Driver', New: 'docker', Old: '', Type: 'Added' },
   383                    {
   384                      Annotations: null,
   385                      Name: 'KillTimeout',
   386                      New: '5000000000',
   387                      Old: '',
   388                      Type: 'Added',
   389                    },
   390                    { Annotations: null, Name: 'Leader', New: 'false', Old: '', Type: 'Added' },
   391                    { Annotations: null, Name: 'ShutdownDelay', New: '0', Old: '', Type: 'Added' },
   392                  ],
   393                  Name: 'redis',
   394                  Objects: [
   395                    {
   396                      Fields: [
   397                        {
   398                          Annotations: null,
   399                          Name: 'image',
   400                          New: 'redis:3.2',
   401                          Old: '',
   402                          Type: 'Added',
   403                        },
   404                        {
   405                          Annotations: null,
   406                          Name: 'port_map[0][db]',
   407                          New: '6379',
   408                          Old: '',
   409                          Type: 'Added',
   410                        },
   411                      ],
   412                      Name: 'Config',
   413                      Objects: null,
   414                      Type: 'Added',
   415                    },
   416                    {
   417                      Fields: [
   418                        { Annotations: null, Name: 'CPU', New: '500', Old: '', Type: 'Added' },
   419                        { Annotations: null, Name: 'DiskMB', New: '0', Old: '', Type: 'Added' },
   420                        { Annotations: null, Name: 'IOPS', New: '0', Old: '', Type: 'Added' },
   421                        { Annotations: null, Name: 'MemoryMB', New: '256', Old: '', Type: 'Added' },
   422                      ],
   423                      Name: 'Resources',
   424                      Objects: [
   425                        {
   426                          Fields: [
   427                            { Annotations: null, Name: 'MBits', New: '10', Old: '', Type: 'Added' },
   428                          ],
   429                          Name: 'Network',
   430                          Objects: [
   431                            {
   432                              Fields: [
   433                                {
   434                                  Annotations: null,
   435                                  Name: 'Label',
   436                                  New: 'db',
   437                                  Old: '',
   438                                  Type: 'Added',
   439                                },
   440                              ],
   441                              Name: 'Dynamic Port',
   442                              Objects: null,
   443                              Type: 'Added',
   444                            },
   445                          ],
   446                          Type: 'Added',
   447                        },
   448                      ],
   449                      Type: 'Added',
   450                    },
   451                  ],
   452                  Type: 'Added',
   453                },
   454              ],
   455              Type: 'Added',
   456              Updates: null,
   457            },
   458          ],
   459          Type: 'Edited',
   460        },
   461      },
   462    };
   463  };
   464  
   465  function generateDiff(changeset) {
   466    return {
   467      Fields: null,
   468      ID: 'insertions-only',
   469      Objects: null,
   470      TaskGroups: [
   471        {
   472          Fields: [{ Annotations: null, Name: 'Count', New: '2', Old: '2', Type: 'None' }],
   473          Name: 'cache',
   474          Objects: [
   475            {
   476              Fields: changeset,
   477              Name: 'RestartPolicy',
   478              Objects: null,
   479              Type: 'Edited',
   480            },
   481          ],
   482          Type: 'Edited',
   483          Updates: null,
   484        },
   485      ],
   486      Type: 'Edited',
   487    };
   488  }