vue_delayed_job_dashboard 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: a703d267c0397ca9874e4b226e57492f78922c02
+  data.tar.gz: f9ab6da27b371a49c7a8798697f270064aaf41f6
+SHA512:
+  metadata.gz: afef016a91be0eb1d1330186c5dd7688541b81d7b27f647ffaf15073d7034f63505d6862433c52eb8de6d18a9668ef3f48b0083e6bab268c84ac554141c096ab
+  data.tar.gz: c0cb4c1807165ee46c1003b979416efbe2d58d695e1e458c466378933ce8e3bfb579151805953599390431e17854f24ef5008411a1fe0a034a86223e1ed41df6

data/.babelrc

@@ -0,0 +1,5 @@
+{
+  "presets": [
+    "es2015"
+  ]
+}

data/.gitignore

@@ -0,0 +1,10 @@
+/.bundle/
+/.yardoc
+/Gemfile.lock
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/
+/node_modules

data/.rspec

@@ -0,0 +1,2 @@
+--format documentation
+--color

data/.travis.yml

@@ -0,0 +1,5 @@
+sudo: false
+language: ruby
+rvm:
+  - 2.3.0
+before_install: gem install bundler -v 1.12.5

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,49 @@
+# Contributor Code of Conduct
+
+As contributors and maintainers of this project, and in the interest of
+fostering an open and welcoming community, we pledge to respect all people who
+contribute through reporting issues, posting feature requests, updating
+documentation, submitting pull requests or patches, and other activities.
+
+We are committed to making participation in this project a harassment-free
+experience for everyone, regardless of level of experience, gender, gender
+identity and expression, sexual orientation, disability, personal appearance,
+body size, race, ethnicity, age, religion, or nationality.
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery
+* Personal attacks
+* Trolling or insulting/derogatory comments
+* Public or private harassment
+* Publishing other's private information, such as physical or electronic
+  addresses, without explicit permission
+* Other unethical or unprofessional conduct
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+By adopting this Code of Conduct, project maintainers commit themselves to
+fairly and consistently applying these principles to every aspect of managing
+this project. Project maintainers who do not follow or enforce the Code of
+Conduct may be permanently removed from the project team.
+
+This code of conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community.
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting a project maintainer at long.polyglot@gmail.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. Maintainers are
+obligated to maintain confidentiality with regard to the reporter of an
+incident.
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 1.3.0, available at
+[http://contributor-covenant.org/version/1/3/0/][version]
+
+[homepage]: http://contributor-covenant.org
+[version]: http://contributor-covenant.org/version/1/3/0/

data/Gemfile

@@ -0,0 +1,8 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in delayed_job_dashboard.gemspec
+gemspec
+
+gem 'sinatra'
+gem 'haml'
+gem 'json'

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2017 Long Nguyen
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,40 @@
+# DelayedJobDashboard (Under development)
+
+![screenshot1](https://cloud.githubusercontent.com/assets/2282642/24837740/2de53704-1d65-11e7-89dc-8d8fe85e093f.png)
+
+![screenshot2](https://cloud.githubusercontent.com/assets/2282642/24837741/309915e2-1d65-11e7-92fa-239a729709f7.png)
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'vue_delayed_job_dashboard'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install vue_delayed_job_dashboard
+
+## Usage
+
+TODO: Write usage instructions here
+
+## Development
+
+After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
+
+To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/delayed_job_dashboard. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
+
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,6 @@
+require "bundler/gem_tasks"
+require "rspec/core/rake_task"
+
+RSpec::Core::RakeTask.new(:spec)
+
+task :default => :spec

data/bin/console

@@ -0,0 +1,14 @@
+#!/usr/bin/env ruby
+
+require "bundler/setup"
+require "delayed_job_dashboard"
+
+# You can add fixtures and/or initialization code here to make experimenting
+# with your gem easier. You can also use a different console, if you like.
+
+# (If you use this, don't forget to add pry to your Gemfile!)
+# require "pry"
+# Pry.start
+
+require "irb"
+IRB.start

data/bin/setup

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+set -euo pipefail
+IFS=$'\n\t'
+set -vx
+
+bundle install
+
+# Do any other automated setup that you need to do here

data/delayed_job_dashboard.gemspec

@@ -0,0 +1,25 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'delayed_job_dashboard/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "vue_delayed_job_dashboard"
+  spec.version       = DelayedJobDashboard::VERSION
+  spec.authors       = ["Long Nguyen"]
+  spec.email         = ["long.polyglot@gmail.com"]
+
+  spec.summary       = %q{Modern DelayedJob Dashboard}
+  spec.description   = %q{Modern DelayedJob Dashboard built with VueJS and Sinatra.}
+  spec.homepage      = "https://github.com/kimquy/delayed_job_dashboard"
+  spec.license       = "MIT"
+
+  spec.files         = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
+  spec.bindir        = "exe"
+  spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
+  spec.require_paths = ["lib"]
+
+  spec.add_development_dependency "bundler", "~> 1.12"
+  spec.add_development_dependency "rake", "~> 10.0"
+  spec.add_development_dependency "rspec", "~> 3.0"
+end

data/lib/delayed_job_dashboard/version.rb

@@ -0,0 +1,3 @@
+module DelayedJobDashboard
+  VERSION = "0.1.0"
+end

data/lib/delayed_job_dashboard/web/app.rb

@@ -0,0 +1,62 @@
+require 'sinatra/base'
+
+module DelayedJobDashboard
+  class WebApplication < Sinatra::Base
+    set :root, File.dirname(__FILE__)
+    set :static, true
+    set :public_folder, File.expand_path('../public', __FILE__)
+    set :views, File.expand_path('../views', __FILE__)
+
+    get "/" do
+      redirect "/delayed_job/overview"
+    end
+
+    get '/overview' do
+      if defined?(Delayed::Job)
+        haml :overview, escape_html: false
+      else
+        @message = "Delayed::Job is not available"
+        haml :error
+      end
+    end
+
+    get '/enqueued' do
+      haml :enqueued, escape_html: false
+    end
+
+    get '/pending' do
+      haml :pending, escape_html: false
+    end
+
+    get '/failed' do
+      haml :failed, escape_html: false
+    end
+
+    get '/working' do
+      haml :working, escape_html: false
+    end
+
+    get '/jobs.json' do
+      content_type :json
+
+      case params["filter"]
+      when "pending"
+        @jobs = Delayed::Job.where(locked_at: nil, attempts: 0).order(created_at: :desc)
+      when "failed"
+        @jobs = Delayed::Job.where.not(failed_at: nil).order(created_at: :desc)
+      when "working"
+        @jobs = Delayed::Job.where.not(locked_at: nil).order(created_at: :desc)
+      when "enqueued"
+        @jobs = Delayed::Job.order(created_at: :desc)
+      end
+
+      @jobs = Delayed::Job.order(created_at: :desc) if @jobs.nil?
+
+      @jobs_json = @jobs.as_json
+      @jobs_json.each_with_index do |job, index|
+        job["payload_object"] = @jobs[index].payload_object
+      end
+      @jobs_json.to_json
+    end
+  end
+end

data/lib/delayed_job_dashboard/web/priv/App.vue

@@ -0,0 +1,52 @@
+<template>
+  <el-row>
+    <el-menu theme="dark" :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
+      <el-menu-item index="1"><a href="/delayed_job/overview">DELAYED JOB DASHBOARD</a></el-menu-item>
+      <el-menu-item index="2"><a href="/delayed_job/enqueued">Enqueued</a></el-menu-item>
+      <el-menu-item index="3"><a href="/delayed_job/working">Working</a></el-menu-item>
+      <el-menu-item index="4"><a href="/delayed_job/pending">Pending</a></el-menu-item>
+      <el-menu-item index="5"><a href="/delayed_job/failed">Failed</a></el-menu-item>
+    </el-menu>
+
+    <el-col :span="24">
+      <jobs-list></jobs-list>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+import JobsList from './JobsList.vue'
+
+export default {
+  data () {
+    return {
+      activeIndex: '1'
+    }
+  },
+
+  created () {
+    let path = window.location.pathname;
+    if (path.includes("overview")) {
+      this.activeIndex = '1'
+    } else if (path.includes("enqueued")) {
+      this.activeIndex = '2'
+    } else if (path.includes("working")) {
+      this.activeIndex = '3'
+    } else if (path.includes("pending")) {
+      this.activeIndex = '4'
+    } else if (path.includes("failed")) {
+      this.activeIndex = '5'
+    }
+  },
+
+  components: {
+    jobsList: JobsList
+  }
+}
+</script>
+
+<style scoped>
+a {
+  text-decoration: none;
+}
+</style>

data/lib/delayed_job_dashboard/web/priv/JobsList.vue

@@ -0,0 +1,144 @@
+<template>
+  <div>
+    <el-table
+      :data="jobs"
+      v-loading.body="loading"
+      style="width: 100%">
+      <el-table-column
+        prop="id"
+        label="Job ID">
+      </el-table-column>
+      <el-table-column
+        label="Status">
+        <template scope="scope">
+          <el-tag
+            :type="filterTag(scope.row)">{{filterTagName(scope.row)}}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="payload_object"
+        label="Handler"
+        :formatter="formatter"
+        width="400">
+      </el-table-column>
+      <el-table-column
+        prop="priority"
+        label="Priority">
+      </el-table-column>
+      <el-table-column
+        prop="attempts"
+        label="Attempts">
+      </el-table-column>
+      <el-table-column
+        prop="run_at"
+        label="Run At"
+        width="180"
+        :formatter="runAtFormatter">
+      </el-table-column>
+      <el-table-column
+        prop="created_at"
+        label="Created At"
+        :formatter="createdAtFormatter">
+      </el-table-column>
+
+      <el-table-column
+        label="Actions"
+        width="120">
+        <template scope="scope">
+          <el-button type="info" size="mini" @click.native.prevent="handleClickDialog(scope.$index, jobs)">
+            Show
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <el-dialog title="Object Payload" v-model="dialogVisible" size="small">
+      <pre>{{jobDetailHandler}}</pre>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="dialogVisible = false">Ok!</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  const moment = require('moment');
+
+  export default {
+    props: ["mydata"],
+    data () {
+      return {
+        jobs: [],
+        dialogVisible: false,
+        jobDetailHandler: "",
+        jobDetailId: "",
+        loading: true
+
+      }
+    },
+    created () {
+      let path = window.location.pathname;
+      if (path.includes("pending")) {
+        this.loadJobs({ params: { filter: "pending" } });
+      } else if (path.includes("failed")) {
+        this.loadJobs({ params: { filter: "failed" } });
+      } else if (path.includes("working")) {
+        this.loadJobs({ params: { filter: "working" } });
+      } else if (path.includes("enqueued")) {
+        this.loadJobs({ params: { filter: "enqueued" } });
+      }
+      else {
+        this.loadJobs({ params: {} });
+      }
+    },
+
+    methods: {
+      handleClickDialog(index, jobs){
+        this.jobDetailHandler = jobs[index].payload_object;
+        this.jobDetailId = jobs[index].id;
+        this.dialogVisible = true;
+      },
+
+      formatter(row, column){
+        return row.handler.substring(0,300)
+      },
+
+      filterTag(row){
+        if (row.failed_at !== null) {
+          return "danger"
+        } else if (row.locked_at !== null) {
+          return "warning"
+        } else {
+          return "gray"
+        }
+      },
+
+      filterTagName(row) {
+        if (row.failed_at !== null) {
+          return "Failed"
+        } else if (row.locked_at !== null) {
+          return "Running"
+        } else {
+          return "Queued"
+        }
+      },
+
+      runAtFormatter(row, column){
+        return moment(row.run_at).format('MMMM Do YYYY, h:mm:ss a');
+      },
+
+      createdAtFormatter(row, column){
+        return moment(row.created_at).format('MMMM Do YYYY, h:mm:ss a');
+      },
+
+      loadJobs(queries) {
+        this.$http.get("/delayed_job/jobs.json", queries).then(response => {
+          this.jobs = response.body;
+          this.loading = false;
+        }, response => {
+          this.loading = false;
+        });
+      }
+    }
+  }
+</script>

data/lib/delayed_job_dashboard/web/priv/app.js

@@ -0,0 +1,14 @@
+import Vue from 'vue'
+import VueResource from 'vue-resource'
+import ElementUI from 'element-ui'
+import App from './App.vue'
+import 'element-ui/lib/theme-default/index.css'
+import locale from 'element-ui/lib/locale/lang/en'
+
+Vue.use(ElementUI, { locale })
+Vue.use(VueResource)
+
+new Vue({
+  el: '#main',
+  render: h => h(App)
+})