mushy 0.15.3 → 0.19.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4b743e14b0d41b727255550df74d33edc0c5eb33b4426e31d4eea41830aa167e
-  data.tar.gz: 26e61eb0310e6a512deca465c0bb375c94b28ce58a3ee296e677b60a4fea5fc3
+  metadata.gz: d783dd461abacb6686c2e131fc228d2640f1dda9836d1c49c1073f7e37054739
+  data.tar.gz: 950f0fd45cb88001fe62d3f1541374c2df5a1f3ff931b19d3a40f4a6fd187fb3
 SHA512:
-  metadata.gz: 9bcfe3677a5ca79b2e0249e1b03dec50bc2a019a06f8c61dcb0b4d6e76fc7f11f28f86f32c908d666ba163427a020630f43f73d0ad2c429a35a6f66bf047eab9
-  data.tar.gz: 421e40fea84d8ed8e18f0f60584d55b21bb540139c6e9c28cfcf5ce8770a3102e6a92d17efe4b44fae4706bc36b9e2d080b036ba9208162ac5efe60e3c04a657
+  metadata.gz: 15b49ebac4c571ab8f2c34450516f0325b70a3e85e7bd909bdd800c29a74ee7377297fa5128f8d7b5458ec278768e92cafbd8af552321f372d26a9a743d8ebb1
+  data.tar.gz: 8041bbd1b4f89af13edc858be699bc3903e4bea680ac68b0b2f26a744adc0b7230572034ade0367851b7f5201e3c51ca9a48095d7afd9300f5185ce2f2c0bd3f

data/hey.mushy

@@ -0,0 +1,29 @@
+{
+  "fluxs": [
+    {
+      "id": "0294b0c4-296f-44cd-9891-95fe75ebe4d2",
+      "name": "Start it up",
+      "flux": "Cli",
+      "parents": [
+
+      ],
+      "config": {
+        "model": {
+        }
+      }
+    },
+    {
+      "id": "7779dce1-1ce8-4241-8e94-ddcd5cb4f8df",
+      "name": "Output something",
+      "flux": "Stdout",
+      "parents": [
+        "0294b0c4-296f-44cd-9891-95fe75ebe4d2"
+      ],
+      "config": {
+        "message": "Hello.",
+        "model": {
+        }
+      }
+    }
+  ]
+}

data/lib/mushy/builder/api.rb

@@ -31,7 +31,17 @@ module Mushy
       end
 
       def self.start file, event
-        file = "#{file}.mushy" unless file.downcase.end_with?('.mushy')
+        original_file = file
+        file = [file, "#{Dir.home}/.mushy/#{file}"]
+               .map { |x| (x.downcase.end_with?('.mushy') ? x : "#{x}.mushy") }
+               .select { |x| File.exist?(x) }
+               .first
+
+        unless file
+          puts "#{original_file} does not exist."
+          return
+        end
+
         flow = File.open(file).read
         flow = Mushy::Flow.parse flow
 
@@ -77,7 +87,6 @@ module Mushy
       end
 
       def self.get_flow file
-        puts "trying to get: #{file}"
         file = "#{file}.mushy" unless file.downcase.end_with?('.mushy')
         data = JSON.parse File.open(file).read
 
@@ -129,10 +138,13 @@ module Mushy
         {
           fluxs: Mushy::Flux.all.select { |x| x.respond_to? :details }.select { |x| x.details }.map do |flux|
                          details = flux.details
+
+                         details[:documentation] = Documentation.build_from details
+
                          details[:config][:incoming_split] = { type: 'text', shrink: true, description: 'Split an incoming event into multiple events by this key, an each event will be processed independently.', default: '' }
                          details[:config][:outgoing_split] = { type: 'text', shrink: true, description: 'Split an outgoing event into multiple events by this key.', default: '' }
                          details[:config][:merge] = { type: 'text', shrink: true, description: 'A comma-delimited list of fields from the event to carry through. Use * to merge all fields.', default: '' }
-                         details[:config][:group] = { type: 'text', shrink: true, description: 'Group events by a field, which is stored in a key. The format is group_by|group_key.', default: '' }
+                         details[:config][:group] = { type: 'text', shrink: true, description: 'Group events by this key, with the value as the key. If a group key is provided like group_by|group_key, then multiple events with the results under group_key will be returned.', default: '' }
                          details[:config][:limit] = { type: 'integer', shrink: true, description: 'Limit the number of events to this number.', default: '' }
                          details[:config][:join] = { type: 'text', shrink: true, description: 'Join all of the events from this flux into one event, under this name.', default: '' }
                          details[:config][:sort] = { type: 'text', shrink: true, description: 'Sort by this key.', default: '' }

data/lib/mushy/builder/documentation.rb

@@ -0,0 +1,37 @@
+module Mushy
+  module Builder
+    module Documentation
+
+      def self.build_from config
+        basic_usage = "#{config[:description]}"
+        if config[:config]&.any?
+          rows = config[:config]
+                   .map { |x| [x[0], x[1][:description], (x[1][:shrink] ? '(optional) ' : '')] }
+                   .reduce("") { |t, i| "#{t}<tr><td>#{i[0]}</td><td>#{i[2]}#{i[1]}</td></tr>" }
+          basic_usage += '<table class="table is-bordered"><thead><tr><td>Field</td><td>Description</td></tr></thead>' + rows + "</table>"
+        end
+
+        {
+          "Basic Usage" => basic_usage,
+        }.tap do |documentation|
+          if config[:examples]
+            config[:examples].each do |item|
+              documentation[item[0]] = [
+                item[1][:description],
+                code_sample('Input', item[1][:input]),
+                code_sample('Config', item[1][:config]),
+                code_sample('Result', item[1][:result]),
+              ].select { |x| x }.reduce('') { |t, i| t + i }
+            end
+          end
+        end
+      end
+
+      def self.code_sample title, value
+        return nil unless value
+        "<div><b>#{title}</b></div><pre><code>#{JSON.pretty_generate(value)}</code></pre>"
+      end
+
+    end
+  end
+end

data/lib/mushy/builder/index.rb

@@ -52,6 +52,52 @@ module Mushy
                     <button v-on:click.prevent.stop="startNew({ setup: setup, configs: configs })" class="button is-link">Add a New Flux To This Flow</button>
                 </div>
             </div>
+
+            <div v-bind:class="setup.fluxTypeSelect">
+                <div class="modal-background"></div>
+                <div class="modal-card">
+                    <header class="modal-card-head">
+                        <p class="modal-card-title">Flux Types</p>
+                        <button class="delete" aria-label="close" v-on:click.prevent.stop="setup.fluxTypeSelect['is-active'] = false"></button>
+                    </header>
+                    <section class="modal-card-body">
+                        <div class="content">
+                            <div v-for="(fluxGroup) in fluxGroups">
+                            <h2 style="font-style:italic">{{fluxGroup.name}}</h2>
+                            <div v-for="(fluxType, id) in fluxGroup.fluxs">
+                                <div class="level">
+                                  <div class="level-left"><h2>{{fluxType.title || fluxType.name}}</h2></div>
+                                  <div class="level-right">
+                                    <button class="button is-primary level-item" v-on:click.prevent.stop="setup.flux.value = fluxType.name;setup.fluxTypeSelect['is-active'] = false">
+                                      Select
+                                    </button>
+                                    <button class="button level-item" v-on:click.prevent.stop="fluxType.showDetails = true" v-if="fluxType['showDetails'] == false">
+                                      Open
+                                    </button>
+                                    <button class="button level-item" v-on:click.prevent.stop="fluxType.showDetails = false" v-if="fluxType['showDetails']">
+                                      Close
+                                    </button>
+                                  </div>
+                                </div>
+
+                                <div v-if="fluxType['showDetails']">
+                                  <div class="tabs">
+                                    <ul>
+                                        <li v-for="(a, b) in fluxType.documentation"><a v-on:click.prevent.stop="fluxType.detailsTab = b">{{b}}</a></li>
+                                    </ul>
+                                  </div>
+                                  <div v-for="(a, b) in fluxType.documentation" v-if="fluxType['detailsTab'] == b" v-html="a"></div>
+                                </div>
+                            </div>
+                            </div>
+                        </div>
+                    </section>
+                    <footer class="modal-card-foot">
+                        <button class="button is-primary" v-on:click.prevent.stop="setup.fluxTypeSelect['is-active'] = false">Done</button>
+                    </footer>
+                </div>
+            </div>
+
             <div class="column" v-if="setup.showFlux">
                 <div class="columns">
                     <div class="column is-half">
@@ -124,7 +170,7 @@ module Mushy
        },
        text:  {
            props: ['label', 'placeholder', 'disabled', 'readonly', 'value', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><input type="text" :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value);" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="input"></div></div>'
+            template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><input type="text" :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value);" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="input"></div></div>'
        },
        hide:  {
            props: ['label', 'description'],
@@ -132,19 +178,19 @@ module Mushy
        },
        integer:  {
            props: ['label', 'placeholder', 'disabled', 'readonly', 'value', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><input type="text" :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value);" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="input"></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><input type="text" :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value);" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="input"></div></div>'
        },
        email: {
            props: ['label', 'placeholder', 'disabled', 'readonly', 'value', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><input type="email" :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value)" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="input"></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><input type="email" :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value)" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="input"></div></div>'
        },
        textarea: {
            props: ['label', 'placeholder', 'disabled', 'readonly', 'value', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><textarea :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value)" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="textarea"></textarea></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><textarea :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value)" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="textarea"></textarea></div></div>'
        },
        json: {
            props: ['label', 'placeholder', 'disabled', 'readonly', 'value', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><textarea :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value)" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="textarea"></textarea></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <textarea :name="id" v-if="value || !shrink" :placeholder="placeholder" v-bind:value="value" v-on:input="$emit(\\'update:value\\', $event.target.value)" :disabled="disabled == \\'true\\'" :readonly="readonly == \\'true\\'" class="textarea"></textarea></div>'
        },
        jsonview: {
            data: function() {
@@ -159,15 +205,15 @@ module Mushy
        },
        radio: {
            props: ['label', 'value', 'options', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div v-for="option in options"><input type="radio" :name="id" v-bind:value="option" v-if="value || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" :checked="value == option"> <label for="option">{{option}}</label></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div v-for="option in options"><input type="radio" :name="id" v-bind:value="option" v-if="value || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" :checked="value == option"> <label for="option">{{option}}</label></div></div>'
        },
        select: {
            props: ['label', 'value', 'options', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><select :name="id" v-if="value || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" class="select"><option v-for="option in options" v-bind:value="option" :selected="value == option">{{option}}</option></select></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><select :name="id" v-if="value || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" class="select"><option v-for="option in options" v-bind:value="option" :selected="value == option">{{option}}</option></select></div></div>'
        },
        selectrecord: {
            props: ['label', 'value', 'options', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><select :name="id" v-if="value || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" class="select"><option v-for="option in options" v-bind:value="option.id" :selected="value == option.id">{{option.name}}</option></select></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><select :name="id" v-if="value || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" class="select"><option v-for="option in options" v-bind:value="option.id" :selected="value == option.id">{{option.name}}</option></select></div></div>'
        },
        selectmanyrecords: {
            data: function() {
@@ -193,11 +239,11 @@ module Mushy
                };
            },
            props: ['label', 'value', 'options', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a> <span v-for="option in options" v-if="value && value.includes(option.id)">{{option.name}} <a href="#" v-on:click.prevent.stop="remove(option.id, value);$emit(\\'update:value\\', value)">[X]</a> </span> <a href="#" v-on:click.prevent.stop="doit(selectedValue, value);$emit(\\'update:value\\', value)">ADD</a> <div class="control"><select :name="id" v-if="value || !shrink" v-on:input="selectedValue=$event.target.value;" class="select"><option v-for="option in options" v-bind:value="option.id">{{option.name}}</option></select></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <span v-for="option in options" v-if="value && value.includes(option.id)">{{option.name}} <a href="#" v-on:click.prevent.stop="remove(option.id, value);$emit(\\'update:value\\', value)">[X]</a> </span> <div class="control"><select :name="id" v-if="value || !shrink" v-on:input="selectedValue=$event.target.value;" class="select" v-on:change.prevent.stop="doit(selectedValue, value);$emit(\\'update:value\\', value);$event.target.value=\\'\\';"><option v-for="option in options" v-bind:value="option.id">{{option.name}}</option></select></div></div>'
        },
        boolean: {
            props: ['label', 'value', 'options', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a><div class="control"><select :name="id" v-if="(value != undefined && value != null && value != \\'\\') || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" class="select"><option v-for="option in [true, false]" v-bind:value="option" :selected="value == option">{{option}}</option></select></div></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && !value">[^]</a></div></div></div> <div class="control"><select :name="id" v-if="(value != undefined && value != null && value != \\'\\') || !shrink" v-on:input="$emit(\\'update:value\\', $event.target.value)" class="select"><option v-for="option in [true, false]" v-bind:value="option" :selected="value == option">{{option}}</option></select></div></div>'
        },
        table: {
            props: ['value', 'description'],
@@ -219,7 +265,7 @@ module Mushy
                };
            },
            props: ['value', 'editors', 'label', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && value.length == 0">[^]</a><table v-if="value.length > 0 || !shrink" class="table"><tr><th v-for="(d, i) in value[0]">{{' + fancyName('i') + '}}</th></tr><tr v-for="(v, z) in value"><td v-for="(d, i) in v">{{d}}</td><td><a href="#" v-on:click.prevent.stop="removeRecord(v, value, z)">[x]</a></td></tr><tr><td v-for="editor in editors"><mip-thing :data="editor.field" :id="editor.id"></mip-thing></td><td><a href="#" v-on:click.prevent.stop="addRecord(editors, value)">[Add]</a></td></tr></table></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink && value.length == 0">[^]</a></div></div></div> <table v-if="value.length > 0 || !shrink" class="table"><tr><th v-for="(d, i) in value[0]">{{' + fancyName('i') + '}}</th></tr><tr v-for="(v, z) in value"><td v-for="(d, i) in v">{{d}}</td><td><a href="#" v-on:click.prevent.stop="removeRecord(v, value, z)">[x]</a></td></tr><tr><td v-for="editor in editors"><mip-thing :data="editor.field" :id="editor.id"></mip-thing></td><td><a href="#" v-on:click.prevent.stop="addRecord(editors, value)">[Add]</a></td></tr></table></div>'
        },
        keyvalue: {
            data: function() {
@@ -234,7 +280,7 @@ module Mushy
                };
            },
            props: ['value', 'label', 'editors', 'description', 'shrink'],
-           template: '<div><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink">[^]</a><table v-if="JSON.stringify(value) != \\'{}\\' || !shrink" class="table"><tr v-for="(v, k) in value"><td>{{k}}</td><td>{{v}}</td><td><button v-on:click.prevent.stop="removeRecord(value, k)" class="button">Remove {{k}}</button></td></tr><tr><td v-for="editor in editors"><mip-thing :data="editor.field" :id="editor.id"></mip-thing></td><td><button v-on:click.prevent.stop="addRecord(editors, value)" v-show="editors[0].field.value" class="button">{{actionText(editors[0].field.value, value)}} {{editors[0].field.value}}</button></td></tr></table></div>'
+           template: '<div><div class="level"><div class="level-left"><div class="level-item"><mip-label :id="id" :label="label" :description="description" :hide_description="shrink && !value"></mip-label></div><div class="level-item"> <a href="#" v-on:click.prevent.stop="shrink=false" v-show="shrink">[^]</a></div></div></div> <table v-if="JSON.stringify(value) != \\'{}\\' || !shrink" class="table"><tr v-for="(v, k) in value"><td>{{k}}</td><td>{{v}}</td><td><button v-on:click.prevent.stop="removeRecord(value, k)" class="button">Remove {{k}}</button></td></tr><tr><td v-for="editor in editors"><mip-thing :data="editor.field" :id="editor.id"></mip-thing></td><td><button v-on:click.prevent.stop="addRecord(editors, value)" v-show="editors[0].field.value" class="button">{{actionText(editors[0].field.value, value)}} {{editors[0].field.value}}</button></td></tr></table></div>'
        },
        button: {
            data: function() {
@@ -281,7 +327,7 @@ module Mushy
        });
    }
 
-   var thingTemplate = '<div v-bind:class="{ \\\'ml-3\\\': data.foghat==\\\'free\\\', \\\'column\\\': data.foghat!=\\\'free\\\', \\\'is-full\\\': data.foghat!=\\\'half\\\' && data.foghat!=\\\'free\\\', \\\'is-half\\\': data.foghat==\\\'half\\\' }">';
+   var thingTemplate = '<div v-show="data.hide != true" v-bind:class="{ \\\'ml-3\\\': data.foghat==\\\'free\\\', \\\'column\\\': data.foghat!=\\\'free\\\', \\\'is-full\\\': data.foghat!=\\\'half\\\' && data.foghat!=\\\'free\\\', \\\'is-half\\\': data.foghat==\\\'half\\\' }">';
    for (var property in components)
        thingTemplate = thingTemplate + '<mip-' + property + ' v-if="data.type == \\'' + property + '\\'" :id="id" ' + components[property].props.map(function(x){ return ':' + x + '.sync="data.' + x + '"';}).join(' ') + '></mip-' + property + '>'
    thingTemplate = thingTemplate + '</div>';
@@ -292,7 +338,7 @@ module Mushy
                       console: console,
                   }
         },
-        props: ['data', 'value', 'id', 'model', 'foghat'],
+        props: ['data', 'value', 'id', 'model', 'foghat', 'hide'],
         template: thingTemplate
     });
 
@@ -337,12 +383,28 @@ module Mushy
              fluxdata = fluxdata.data;
              flowdata = flowdata.data;
 
+             fluxdata.fluxs.map(function(x) {
+                 x['showDetails'] = false;
+                 x['detailsTab'] = Object.getOwnPropertyNames(x.documentation)[0];
+             } );
+
+             fluxGroups = []
+             fluxdata.fluxs.map(function(x) {
+                 if (x.fluxGroup) {} else { x.fluxGroup = { name: 'Others', position: 999999 } };
+                 rowboat = fluxGroups.filter(function(y) { return y.name == x.fluxGroup.name })[0];
+                 if (rowboat) {} else { fluxGroups.push(x.fluxGroup); x.fluxGroup.fluxs = [] }
+                 rowboat = fluxGroups.filter(function(y) { return y.name == x.fluxGroup.name })[0];
+                 rowboat.fluxs.push(x);
+             } );
+             fluxGroups = fluxGroups.sort(function(x, y) { return (x.position || 1000) - (y.position || 1000); })
+
              var configs = {};
              fluxdata.fluxs.map(function(x){
                  configs[x.name] = x.config;
              });
 
              var options = [''];
+             fluxTypesWithDetails = fluxdata.fluxs;
              fluxTypes = fluxdata.fluxs.map(function(x){ return x.name });
              for(var type in fluxTypes)
                 options.push(fluxTypes[type]);
@@ -391,9 +453,18 @@ module Mushy
                        "modal": true,
                        "is-active": false,
                    },
+                   fluxTypeSelect: {
+                       "modal": true,
+                       "is-active": false,
+                   },
                    id: { type: 'hide', value: '' },
                    name: { type: 'text', value: '' },
-                   flux: { type: 'select', value: fluxdata.fluxs[0].name, options: options},
+                   flux: { type: 'select', value: fluxdata.fluxs[0].name, options: options, hide: true },
+                   open_flux: { type: 'button', name: 'Select a Flux', foghat: 'free', medium: 'hey', color: 'is-primary',
+                                click: function() {
+                                           Vue.set(app.setup.fluxTypeSelect, 'is-active', true);
+                                       }
+                   },
                    parents: { type: 'selectmanyrecords', label: 'Receive Events From', value: '', options: flowdata.fluxs },
              };
 
@@ -507,6 +578,8 @@ module Mushy
                             });
                      },
                      configs: configs,
+                     fluxTypes: fluxTypesWithDetails,
+                     fluxGroups: fluxGroups,
                      setup: setup,
                      flux_name_for: function(ids, fluxes) {
                          var fluxs = fluxes.filter(function(x){ return ids.includes(x.id) });

data/lib/mushy/flux.rb

@@ -119,7 +119,11 @@ module Mushy
     def group_these_results results, event, by
       group_by = by.split('|')[0]
       result_key = by.split('|')[1]
-      results.group_by { |x| x[group_by] }.map { |k, v| SymbolizedHash.new( { result_key => v } ) }
+      grouped_results = results.group_by { |x| x[group_by] }
+
+      return grouped_results unless result_key
+
+      grouped_results.map { |k, v| SymbolizedHash.new( { result_key => v } ) }
     end
 
     def outgoing_split_these_results results, event, by

data/lib/mushy/fluxs/bash.rb

@@ -5,7 +5,9 @@ module Mushy
     def self.details
       {
         name: 'Bash',
+        title: 'Execute a command via bash',
         description: 'Run a bash command.',
+        fluxGroup: { name: 'Execute' },
         config: {
           command: {
                      description: 'The command to run in bash.',
@@ -19,6 +21,28 @@ module Mushy
                        value:       '',
                      },
         },
+        examples: {
+          "Successful Call" => {
+                             description: 'This will run the ls command and return the full bash result.',
+                             input: {
+                                      command: "ls",
+                                    },
+                             result: {
+                                       "text": "bin\nblue_heart.png\nthe_output.txt\n",
+                                       "success": true,
+                                       "exit_code": 0
+                                     }
+                           },
+          "Failed Call" => {
+                             description: 'This is an example of what happens when the command fails.',
+                             input: { command: 'rm file_that_does_not_exist.txt' },
+                             result: {
+                                       "text": "",
+                                       "success": false,
+                                       "exit_code": 256
+                                     }
+                           },
+          }
       }
     end
 

data/lib/mushy/fluxs/browser.rb

@@ -7,6 +7,8 @@ module Mushy
     def self.details
       {
         name: 'Browser',
+        title: 'Use a browser',
+        fluxGroup: { name: 'Web' },
         description: 'Visit a page in a browser.',
         config: {
           url: {
@@ -75,6 +77,124 @@ module Mushy
                                  value:       '',
                                },
         },
+        examples: {
+          "Successful Call" => {
+                                 description: 'This will open https://www.google.com and return the result.',
+                                 config: {
+                                          url: "https://www.google.com",
+                                        },
+                                 result: {
+                                   "url": "https://www.google.com/",
+                                   "status": 200,
+                                   "title": "Google",
+                                   "cookies": [
+                                                {
+                                                  "name": "1P_JAR",
+                                                  "value": "2021-10-06-12",
+                                                  "domain": ".google.com",
+                                                  "path": "/",
+                                                  "expires": 1636117150.583117,
+                                                  "size": 19,
+                                                  "httpOnly": false,
+                                                  "secure": true,
+                                                  "session": false,
+                                                  "sameSite": "None",
+                                                  "priority": "Medium"
+                                                },
+                                              ],
+                                    "headers": {},
+                                    "time": 1.486214604,
+                                    "body": "<html itemscope=\"\" itemtype=\"http://schema.org/WebPage\" lang=\"en\">...</html>"
+                                 }
+                               },
+          "Login To a Site" => {
+                                 description: 'This will open https://www.yoursitepleasethankyou.com, login using javascript, and then return the state of the browser after logging in.',
+                                 input: {
+                                          url: "https://www.yoursitepleasethankyou.com",
+                                          username: "MYUSERNAME",
+                                          password: "MYPASSWORD",
+                                        },
+                                 config: {
+                                          url: "{{url}}",
+                                          timeout: 10,
+                                          execute: "$('#username').val('{{username}}');
+$('#next').click();
+$('#password').val('{{password}}');
+$('#login').click();"
+                                        },
+                                 result: {
+                                           "url": "https://yoursitepleasethankyou/",
+                                           "status": 200,
+                                           "title": "",
+                                           "cookies": [
+                                                        {
+                                                          "name": "session_id",
+                                                          "value": "1jfujsx5xbnuxmsjmgjhzfpi",
+                                                          "domain": ".yoursitepleasethankyou",
+                                                          "path": "/",
+                                                          "expires": -1,
+                                                           "size": 41,
+                                                           "httpOnly": true,
+                                                           "secure": true,
+                                                           "session": true,
+                                                           "sameSite": "Lax",
+                                                           "priority": "Medium"
+                                                        }
+                                                      ],
+                                            "headers": {},
+                                            "time": 4.633920809,
+                                            "body": "<html xmlns=\"http://www.w3.org/1999/xhtml\"><head></head>...</html>"
+                                         }
+                                },
+          "Access a Page After Logging In" => {
+                                 description: 'This will open a page using cookies from the previous request. Note that the cookies came from another browser flux event.',
+                                 input: {
+                                          "url": "https://yoursitepleasethankyou/",
+                                          "cookies": [
+                                                       {
+                                                         "name": "session_id",
+                                                         "value": "1jfujsx5xbnuxmsjmgjhzfpi",
+                                                         "domain": ".yoursitepleasethankyou",
+                                                         "path": "/",
+                                                         "expires": -1,
+                                                          "size": 41,
+                                                          "httpOnly": true,
+                                                          "secure": true,
+                                                          "session": true,
+                                                          "sameSite": "Lax",
+                                                          "priority": "Medium"
+                                                       }
+                                                     ],
+                                        },
+                                 config: {
+                                          url: "https://www.yoursitepleasethankyou.com/myaccount",
+                                          carry_cookies_from: "{{cookies}}"
+                                        },
+                                 result: {
+                                           "url": "https://yoursitepleasethankyou/",
+                                           "status": 200,
+                                           "title": "",
+                                           "cookies": [
+                                                        {
+                                                          "name": "session_id",
+                                                          "value": "1jfujsx5xbnuxmsjmgjhzfpi",
+                                                          "domain": ".yoursitepleasethankyou",
+                                                          "path": "/",
+                                                          "expires": -1,
+                                                           "size": 41,
+                                                           "httpOnly": true,
+                                                           "secure": true,
+                                                           "session": true,
+                                                           "sameSite": "Lax",
+                                                           "priority": "Medium"
+                                                        }
+                                                      ],
+                                            "headers": {},
+                                            "time": 4.633920809,
+                                            "body": "<html><head></head>Your name is John Doe...</html>"
+                                         }
+                                }
+                  }
       }
     end
 

data/lib/mushy/fluxs/build_csv.rb

@@ -7,7 +7,9 @@ module Mushy
     def self.details
       {
         name: 'BuildCsv',
+        title: "Build CSV",
         description: 'Build a CSV.',
+        fluxGroup: { name: 'CSV' },
         config: {
           input_path: {
                         description: 'The path to the set of records to include in the CSV.',
@@ -30,6 +32,27 @@ module Mushy
                         value:       true,
                       },
         },
+        examples: {
+          "Build a Simple CSV" => {
+                                    description: 'Converts a set of records to a CSV.',
+                                    input: {
+                                               things: [
+                                                         { name: "Apple", color:"Red" },
+                                                         { name: "Banana", color: "Yellow" },
+                                                         { name: "Pear", color: "Green" }
+                                                       ]
+                                           },
+                                    config: {
+                                                input_path: "things",
+                                                output_path: "records",
+                                                headers: { name: "Name", color: "Color" },
+                                                header_row: true
+                                            },
+                                    result: {
+                                                records: "Name,Color\nApple,Red\nBanana,Yellow\nPear,Green\n"
+                                            }
+                                  },
+                  }
       }
     end
 

data/lib/mushy/fluxs/cli.rb

@@ -5,9 +5,21 @@ module Mushy
     def self.details
       {
         name: 'Cli',
+        title: 'Start a flow via command line',
+        fluxGroup: { name: 'Starters', position: 0 },
         description: 'Accept CLI arguments from the run command.',
         config: {
         },
+        examples: {
+          "Calling From The Command Line" => {
+                                               description: 'Calling the CLI with command-line arguments.',
+                                               input: "mushy start file first:John last:Doe",
+                                               result: {
+                                                         "first": "John",
+                                                         "last": "Doe"
+                                                       }
+                                             },
+          }
       }
     end
 

data/lib/mushy/fluxs/collection.rb

@@ -5,7 +5,9 @@ module Mushy
     def self.details
       {
         name: 'Collection',
-        description: 'Collects events.',
+        title: 'Collect and retrieve events',
+        description: 'Collect and retrieve events for the flow.',
+        fluxGroup: { name: 'Flows' },
         config: {
           id: {
                 description: 'The path to the unique id in the body of the element.',