Release 1.22.8

Bumps [lint-staged](https://github.com/okonet/lint-staged) from 10.2.0 to 10.2.1.
- [Release notes](https://github.com/okonet/lint-staged/releases)
- [Commits](https://github.com/okonet/lint-staged/compare/v10.2.0...v10.2.1)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

.dockerignore

@@ -0,0 +1,8 @@
+node_modules
+.cache
+.idea
+dist
+.git
+static
+integration
+demo.gif

.github/golang/Dockerfile

@@ -1,6 +0,0 @@
-FROM golang:1.13
-
-COPY entrypoint.sh /entrypoint.sh
-
-ENTRYPOINT ["/entrypoint.sh"]
-CMD [""]

.github/golang/entrypoint.sh

@@ -1,4 +0,0 @@
-#!/bin/sh
-set -e
-
-go test -cover ./...

.github/goreleaser/Dockerfile

@@ -1,13 +0,0 @@
-FROM golang:1.13-alpine
-
-RUN apk --no-cache add git nodejs-current nodejs-npm make g++ bash bzr curl docker rpm && \
-  npm i -g npm && \
-  wget https://github.com/goreleaser/goreleaser/releases/latest/download/goreleaser_Linux_x86_64.tar.gz && \
-  tar -xvzf *.tar.gz -C /usr/local/bin && \
-  rm *.gz && \
-  go get -u github.com/gobuffalo/packr/packr
-
-COPY entrypoint.sh /entrypoint.sh
-
-ENTRYPOINT ["/entrypoint.sh"]
-CMD [""]

.github/goreleaser/entrypoint.sh

@@ -1,18 +0,0 @@
-#!/usr/bin/env bash
-
-if [ -n "$DOCKER_USERNAME" ] && [ -n "$DOCKER_PASSWORD" ]; then
-    echo "Login to the docker..."
-    docker login -u $DOCKER_USERNAME -p $DOCKER_PASSWORD $DOCKER_REGISTRY
-fi
-
-# Workaround for github actions when access to different repositories is needed.
-# Github actions provides a GITHUB_TOKEN secret that can only access the current
-# repository and you cannot configure it's value.
-# Access to different repositories is needed by brew for example.
-
-if [ -n "$GORELEASER_GITHUB_TOKEN" ] ; then
-  export GITHUB_TOKEN=$GORELEASER_GITHUB_TOKEN
-fi
-
-npm ci
-goreleaser $@

.github/workflows/deploy.yml

@@ -0,0 +1,59 @@
+on:
+  push:
+    tags:
+      - "v*"
+name: Test and Release
+jobs:
+  npm-test:
+    name: JavaScript Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Install Node
+        uses: actions/setup-node@v1
+      - name: Install depdencies
+        run: yarn
+      - name: Run Tests
+        run: yarn test
+  go-test:
+    name: Go Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Install Go
+        uses: actions/setup-go@v1
+        with:
+          go-version: 1.14.x
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Run Go Tests with Coverage
+        run: go test -cover ./...
+  int-test:
+    needs: [go-test, npm-test]
+    name: Integration Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Build images
+        run: docker-compose -f integration/docker-compose.test.yml build  
+      - name: Run tests
+        run: docker-compose -f integration/docker-compose.test.yml run integration
+  buildx:
+    needs: [int-test]
+    name: Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: crazy-max/ghaction-docker-buildx@v1
+        with:
+          version: latest
+      - name: Available platforms
+        run: echo ${{ steps.buildx.outputs.platforms }}
+      - name: Docker Login
+        run: docker login -u ${{ secrets.DOCKER_USERNAME }} -p ${{ secrets.DOCKER_PASSWORD }}
+      - name: Run Buildx
+        run: make publish

.github/workflows/push.yml

@@ -1,23 +0,0 @@
-on: push
-name: Build, Test and Release
-jobs:
-  build:
-    name: npm test
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@master
-      - name: npm test
-        uses: actions/setup-node@v1
-      - run: npm it
-      - name: go test
-        uses: ./.github/golang/
-      - name: Release
-        uses: ./.github/goreleaser/
-        env:
-          DOCKER_PASSWORD: ${{ secrets.DOCKER_PASSWORD }}
-          DOCKER_USERNAME: ${{ secrets.DOCKER_USERNAME }}
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          REF: ${{ github. ref }}
-        with:
-          args: release
-        if: contains(github.ref, 'tags')

.github/workflows/test.yml

@@ -0,0 +1,37 @@
+on: push
+name: Test
+jobs:
+  npm-test:
+    name: JavaScript Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Install Node
+        uses: actions/setup-node@v1
+      - name: Install depdencies
+        run: yarn
+      - name: Run Tests
+        run: yarn test
+  go-test:
+    name: Go Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Install Go
+        uses: actions/setup-go@v1
+        with:
+          go-version: 1.14.x
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Run Go Tests with Coverage
+        run: go test -cover ./...
+  int-test:
+    name: Integration Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Build images
+        run: docker-compose -f integration/docker-compose.test.yml build  
+      - name: Run tests
+        run: docker-compose -f integration/docker-compose.test.yml run integration

.goreleaser.yml

@@ -1,47 +0,0 @@
-before:
-  hooks:
-    - npm run clean
-    - npm run build
-    - packr -z
-builds:
-  - env:
-      - CGO_ENABLED=0
-    goos:
-      - linux
-      - darwin
-    goarch:
-      - amd64
-      - arm
-      - arm64
-archives:
-  - replacements:
-      amd64: 64-bit
-      386: 32-bit
-      arm64: ARM_64-bit
-      arm: ARM_32-bit
-      linux: Linux
-      darwin: Darwin
-checksum:
-  name_template: "checksums.txt"
-snapshot:
-  name_template: "{{ .Tag }}-next"
-changelog:
-  sort: asc
-  filters:
-    exclude:
-      - "^docs:"
-      - "^test:"
-dockers:
-  - image_templates:
-      - "amir20/dozzle:{{ .Tag }}"
-      - "amir20/dozzle:v{{ .Major }}.{{ .Minor }}"
-      - amir20/dozzle:latest
-    build_flag_templates:
-      - "--label=org.label-schema.schema-version=1.0"
-      - "--label=org.label-schema.build-date={{.Date}}"
-      - "--label=org.label-schema.vcs-ref={{.ShortCommit}}"
-      - "--label=org.label-schema.version={{.Version}}"
-      - "--label=org.label-schema.name=Dozzle"
-      - "--label=org.label-schema.url=https://dozzle.dev/"
-      - "--label=org.label-schema.vcs-url=https://github.com/amir20/dozzle"
-      - "--label=org.label-schema.description=Dozzle is a real-time log viewer for docker containers."

.htmlnanorc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  minifySvg: false,
+};

.prettierrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  printWidth: 120,
+};

.prettierrc.json

@@ -1,3 +0,0 @@
-{
-  "printWidth": 120
-}

.reflex

@@ -1 +1 @@
--r '\.go$' -R '^node_modules/' -R '^static/' -R '^.cache/' -G '*_test.go' -s -- go run main.go --level debug
+-r '\.go$' -R '^node_modules/' -R '^static/' -R '^.cache/' -G '*_test.go' -s -- go run main.go routes.go --level debug

Dockerfile

@@ -1,9 +1,59 @@
-FROM alpine:latest as certs
-RUN apk --update add ca-certificates
+# Build assets
+FROM node:13-alpine as node
+
+RUN apk add --no-cache git openssh python make g++ util-linux
+
+WORKDIR /build
+
+# Install dependencies
+COPY package*.json yarn.lock ./
+RUN yarn install --network-timeout 1000000
+
+# Copy config files
+COPY .* ./
+
+# Copy assets to build
+COPY assets ./assets
+
+
+# Do the build
+RUN yarn build
+
+
+FROM golang:1.14-alpine AS builder
+
+RUN apk add --no-cache git ca-certificates
+RUN mkdir /dozzle
+
+WORKDIR /dozzle
+
+# Needed for assets
+RUN go get -u github.com/gobuffalo/packr/packr
+
+# Copy go mod files
+COPY go.* ./
+RUN go mod download
+
+# Copy assets built with node
+COPY --from=node /build/static ./static
+
+# Copy all other files
+COPY . .
+
+# Compile static files
+RUN packr -z
+
+# Args
+ARG TAG=dev
+
+# Build binary
+RUN CGO_ENABLED=0 go build -ldflags "-s -w -X main.version=$TAG"  -o dozzle
 
 FROM scratch
+
 ENV PATH=/bin
-ENV DOCKER_API_VERSION 1.38
-COPY --from=certs /etc/ssl/certs/ca-certificates.crt /etc/ssl/certs/ca-certificates.crt
-COPY dozzle /
+
+COPY --from=builder /etc/ssl/certs/ca-certificates.crt /etc/ssl/certs/ca-certificates.crt
+COPY --from=builder /dozzle/dozzle /dozzle
+
 ENTRYPOINT ["/dozzle"]

Makefile

@@ -0,0 +1,6 @@
+TAG := $(shell git describe --tags)
+PLATFROMS := linux/amd64,linux/arm64,linux/arm/v7
+
+.PHONY: publish
+publish:
+	docker buildx build --build-arg TAG=$(TAG) --platform $(PLATFROMS) -t amir20/dozzle:latest -t amir20/dozzle:$(TAG) --push .

README.md

@@ -2,16 +2,17 @@
 [![Docker Pulls](https://img.shields.io/docker/pulls/amir20/dozzle.svg)](https://hub.docker.com/r/amir20/dozzle/)
 [![Docker Size](https://images.microbadger.com/badges/image/amir20/dozzle.svg)](https://hub.docker.com/r/amir20/dozzle/)
 [![Docker Version](https://images.microbadger.com/badges/version/amir20/dozzle.svg)](https://hub.docker.com/r/amir20/dozzle/)
+![Test](https://github.com/amir20/dozzle/workflows/Test/badge.svg)
 
 # Dozzle - [dozzle.dev](https://dozzle.dev/)
 
-Dozzle is a real-time log viewer for Docker. It's free. It's small. And it's right in your browser.
+Dozzle is a real-time log viewer for Docker. It's free. It's small. And it's in your browser.
 
 While dozzle should work for most, it is not meant to be a full logging solution. For enterprise use, I recommend you look at [Loggly](https://www.loggly.com), [Papertrail](https://papertrailapp.com) or [Kibana](https://www.elastic.co/products/kibana).
 
-But if you don't want to pay for those services, then you are in luck! Dozzle will be able to capture all logs from your containers and send them in real-time to your browser. Installation is also very easy. Dozzle is not a database. It does not store or save any logs. You can only see live logs while using Dozzle.
+But if you don't want to pay for these services, then Dozzle can help! Dozzle will be able to capture all logs from your containers and send them in real-time to your browser. Installation is also very easy. Dozzle is not a database. It does not store or save any logs. You can only see live logs while using Dozzle.
 
-![Image](demo.gif)
+![Image](https://github.com/amir20/dozzle/blob/master/.github/demo.gif?raw=true)
 
 ## Getting dozzle
 
@@ -43,9 +44,6 @@ dozzle will be available at [http://localhost:8888/](http://localhost:8888/). Yo
       dozzle:
         container_name: dozzle
         image: amir20/dozzle:latest
-        environment:
-          - DOZZLE_TAILSIZE=100
-          - DOZZLE_FILTER='status:running'
         volumes:
           - /var/run/docker.sock:/var/run/docker.sock
         ports:
@@ -84,10 +82,50 @@ Dozzle follows the [12-factor](https://12factor.net/) model. Configurations can
 | `--base`     | `DOZZLE_BASE`        | `/`     |
 | `--level`    | `DOZZLE_LEVEL`       | `info`  |
 | `--showAll`  | `DOZZLE_SHOWALL`     | `false` |
-| n/a          | `DOCKER_API_VERSION` | `1.38`  |
+| n/a          | `DOCKER_API_VERSION` | not set |
 | `--tailSize` | `DOZZLE_TAILSIZE`    | `300`   |
 | `--filter`   | `DOZZLE_FILTER`      | `""`    |
 
+## Troubleshooting
+
+### Nginx Config
+
+If you are using nginx as a reverse proxy, then you need to configure `/api` to enable server-sent events. 
+
+Below is an example configuration using SSL and `proxy_pass` with correct settings. 
+
+```
+    server {
+        listen                          80;
+        server_name                     <example.com>;
+        return                          301 https://<example.com>$request_uri;
+    }
+
+    server {
+        listen                          443 ssl http2;
+        server_name                     <example.com>;
+
+        ssl_certificate                 </path/to/your/certificate>;
+        ssl_certificate_key             </path/to/your/key>;
+
+        location / {
+            proxy_pass                  http://<dozzle.container.ip.address>:8080;
+        }
+
+        location /api {
+            proxy_pass                  http://<dozzle.container.ip.address>:8080;
+
+            proxy_http_version          1.1;
+            proxy_set_header            Connection "";
+            proxy_buffering             off;
+            proxy_cache                 off;
+
+            chunked_transfer_encoding   off;
+        }
+    }
+
+```
+
 ## License
 
 [MIT](LICENSE)

__snapshots__/dozzle.snapshot

@@ -26,8 +26,6 @@ Connection: close
 Content-Type: text/plain; charset=utf-8
 
 dev
-none
-unknown
 
 /* snapshot: Test_handler_listContainers_happy */
 HTTP/1.1 200 OK

assets/App.spec.js

@@ -8,7 +8,7 @@ const localVue = createLocalVue();
 localVue.use(Vuex);
 
 describe("<App />", () => {
-  const stubs = { RouterLink: RouterLinkStub, "router-view": true };
+  const stubs = { RouterLink: RouterLinkStub, "router-view": true, icon: true };
   let store;
 
   beforeEach(() => {
@@ -17,18 +17,18 @@ describe("<App />", () => {
     const state = {
       containers: [
         { id: "abc", name: "Test 1" },
-        { id: "xyz", name: "Test 2" }
+        { id: "xyz", name: "Test 2" },
       ],
-      settings: { menuWidth: 15 }
+      settings: { menuWidth: 15 },
     };
 
     const actions = {
-      FETCH_CONTAINERS: () => Promise.resolve()
+      FETCH_CONTAINERS: () => Promise.resolve(),
     };
 
     store = new Vuex.Store({
       state,
-      actions
+      actions,
     });
   });
 

assets/App.vue

@@ -1,8 +1,9 @@
 <template lang="html">
   <main>
     <mobile-menu v-if="isMobile"></mobile-menu>
-    <splitpanes @resized="onResize($event)">
-      <pane min-size="10" :size="settings.menuWidth" v-if="!isMobile">
+
+    <splitpanes @resized="onResized($event)">
+      <pane min-size="10" :size="settings.menuWidth" v-if="!isMobile && !collapseNav">
         <side-menu></side-menu>
       </pane>
       <pane min-size="10">
@@ -22,6 +23,17 @@
         </splitpanes>
       </pane>
     </splitpanes>
+    <button
+      @click="collapseNav = !collapseNav"
+      class="button is-small is-rounded is-settings-control"
+      :class="{ collapsed: collapseNav }"
+      id="hide-nav"
+      v-if="!isMobile"
+    >
+      <span class="icon">
+        <icon :name="collapseNav ? 'chevron-right' : 'chevron-left'"></icon>
+      </span>
+    </button>
   </main>
 </template>
 
@@ -35,10 +47,12 @@ import SideMenu from "./components/SideMenu";
 import MobileMenu from "./components/MobileMenu";
 import Search from "./components/Search";
 import ContainerTitle from "./components/ContainerTitle";
+import Icon from "./components/Icon";
 
 export default {
   name: "App",
   components: {
+    Icon,
     LogViewerWithSource,
     SideMenu,
     MobileMenu,
@@ -46,39 +60,58 @@ export default {
     Splitpanes,
     Pane,
     Search,
-    ContainerTitle
+    ContainerTitle,
   },
   data() {
     return {
       title: "",
-      showNav: false
+      collapseNav: false,
     };
   },
   metaInfo() {
     return {
       title: this.title,
-      titleTemplate: "%s - Dozzle"
+      titleTemplate: "%s - Dozzle",
     };
   },
   async created() {
     await this.fetchContainerList();
     this.title = `${this.containers.length} containers`;
   },
+  mounted() {
+    if (this.hasSmallerScrollbars) {
+      document.documentElement.classList.add("has-custom-scrollbars");
+    }
+    this.menuWidth = this.settings.menuWidth;
+  },
+  watch: {
+    hasSmallerScrollbars(newValue, oldValue) {
+      if (newValue) {
+        document.documentElement.classList.add("has-custom-scrollbars");
+      } else {
+        document.documentElement.classList.remove("has-custom-scrollbars");
+      }
+    },
+  },
   computed: {
-    ...mapState(["containers", "activeContainers", "isMobile", "settings"])
+    ...mapState(["containers", "activeContainers", "isMobile", "settings"]),
+    hasSmallerScrollbars() {
+      return this.settings.smallerScrollbars;
+    },
   },
   methods: {
     ...mapActions({
       fetchContainerList: "FETCH_CONTAINERS",
       removeActiveContainer: "REMOVE_ACTIVE_CONTAINER",
-      updateSetting: "UPDATE_SETTING"
+      updateSetting: "UPDATE_SETTING",
     }),
-    onResize(e) {
+    onResized(e) {
       if (e.length == 2) {
-        this.updateSetting({ menuWidth: Math.min(90, e[0].size) });
+        const menuWidth = e[0].size;
+        this.updateSetting({ menuWidth });
       }
-    }
-  }
+    },
+  },
 };
 </script>
 
@@ -98,4 +131,20 @@ export default {
 .has-min-height {
   min-height: 100vh;
 }
+
+#hide-nav {
+  position: fixed;
+  left: 10px;
+  bottom: 10px;
+  &.collapsed {
+    left: -40px;
+    width: 60px;
+    padding-left: 40px;
+    background: rgba(0, 0, 0, 0.95);
+
+    &:hover {
+      left: -25px;
+    }
+  }
+}
 </style>

assets/__snapshots__/App.spec.js.snap

@@ -37,5 +37,18 @@ exports[`<App /> renders correctly 1`] = `
       </splitpanes-stub>
     </pane-stub>
   </splitpanes-stub>
+   
+  <button
+    class="button is-small is-rounded is-settings-control"
+    id="hide-nav"
+  >
+    <span
+      class="icon"
+    >
+      <icon-stub
+        name="chevron-left"
+      />
+    </span>
+  </button>
 </main>
 `;

assets/components/ContainerTitle.vue

@@ -13,10 +13,10 @@ export default {
     value: String,
     closable: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
-  name: "ContainerTitle"
+  name: "ContainerTitle",
 };
 </script>
 

assets/components/Icon.vue

@@ -0,0 +1,33 @@
+<template>
+  <svg class="icomoon" :class="['icon-' + name]">
+    <use :href="'#icon-' + name"></use>
+  </svg>
+</template>
+
+<script>
+export default {
+  functional: true,
+  props: {
+    name: {
+      required: true,
+      type: String,
+    },
+  },
+  name: "Icon",
+};
+</script>
+<style lang="scss" scoped>
+.icomoon {
+  display: inline-block;
+  width: 1em;
+  height: 1em;
+  stroke-width: 0;
+  stroke: currentColor;
+  fill: currentColor;
+
+  .icon:not(.keep-size) & {
+    width: 100%;
+    height: 100%;
+  }
+}
+</style>

assets/components/InfiniteLoader.vue

@@ -7,16 +7,16 @@ export default {
   name: "InfiniteLoader",
   data() {
     return {
-      isLoading: false
+      isLoading: false,
     };
   },
   props: {
     onLoadMore: Function,
-    enabled: Boolean
+    enabled: Boolean,
   },
   mounted() {
     const intersectionObserver = new IntersectionObserver(
-      async entries => {
+      async (entries) => {
         if (entries[0].intersectionRatio <= 0) return;
         if (this.onLoadMore && this.enabled) {
           const scrollingParent = this.$el.closest("[data-scrolling]") || document.documentElement;
@@ -31,7 +31,7 @@ export default {
     );
 
     intersectionObserver.observe(this.$refs.observer);
-  }
+  },
 };
 </script>
 <style scoped lang="scss"></style>

assets/components/LogEventSource.spec.js

@@ -1,13 +1,17 @@
+import debounce from "lodash.debounce";
 import EventSource from "eventsourcemock";
 import { sources } from "eventsourcemock";
 import { shallowMount, mount, createLocalVue } from "@vue/test-utils";
 import Vuex from "vuex";
 import MockDate from "mockdate";
-import debounce from "lodash.debounce";
 import LogEventSource from "./LogEventSource.vue";
 import LogViewer from "./LogViewer.vue";
 
-jest.mock("lodash.debounce", () => jest.fn(fn => fn));
+jest.mock("lodash.debounce", () =>
+  jest.fn((fn) => {
+    return fn;
+  })
+);
 
 describe("<LogEventSource />", () => {
   beforeEach(() => {
@@ -20,7 +24,7 @@ describe("<LogEventSource />", () => {
     const unobserve = jest.fn();
     global.IntersectionObserver = jest.fn(() => ({
       observe,
-      unobserve
+      unobserve,
     }));
     debounce.mockClear();
   });
@@ -31,13 +35,12 @@ describe("<LogEventSource />", () => {
     const localVue = createLocalVue();
     localVue.use(Vuex);
 
-    localVue.component("log-event-source", LogEventSource);
     localVue.component("log-viewer", LogViewer);
 
-    const state = { searchFilter, settings: { size: "medium" } };
+    const state = { searchFilter, settings: { size: "medium", showTimestamp: true } };
 
     const store = new Vuex.Store({
-      state
+      state,
     });
 
     return mount(LogEventSource, {
@@ -46,9 +49,9 @@ describe("<LogEventSource />", () => {
       scopedSlots: {
         default: `
         <log-viewer :messages="props.messages"></log-viewer>
-        `
+        `,
       },
-      propsData: { id: "abc" }
+      propsData: { id: "abc" },
     });
   }
 
@@ -102,6 +105,23 @@ describe("<LogEventSource />", () => {
     `);
   });
 
+  test("should parse messages with loki's timestamp format", async () => {
+    const wrapper = createLogEventSource();
+    sources["/api/logs/stream?id=abc"].emitOpen();
+    sources["/api/logs/stream?id=abc"].emitMessage({ data: `2020-04-27T12:35:43.272974324+02:00 xxxxx` });
+
+    const [message, _] = wrapper.vm.messages;
+    const { key, ...messageWithoutKey } = message;
+
+    expect(key).toBe("2020-04-27T12:35:43.272974324+02:00");
+    expect(messageWithoutKey).toMatchInlineSnapshot(`
+      Object {
+        "date": 2020-04-27T10:35:43.272Z,
+        "message": "xxxxx",
+      }
+    `);
+  });
+
   test("should pass messages to slot", async () => {
     const wrapper = createLogEventSource();
     sources["/api/logs/stream?id=abc"].emitOpen();
@@ -125,6 +145,7 @@ describe("<LogEventSource />", () => {
     sources["/api/logs/stream?id=abc"].emitOpen();
     sources["/api/logs/stream?id=abc"].emitMessage({ data: `2019-06-12T10:55:42.459034602Z "This is a message."` });
 
+    await wrapper.vm.$nextTick();
     expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
       <ul class="events medium">
         <li><span class="date">today at 10:55 AM</span> <span class="text">"This is a message."</span></li>
@@ -136,9 +157,10 @@ describe("<LogEventSource />", () => {
     const wrapper = createLogEventSource();
     sources["/api/logs/stream?id=abc"].emitOpen();
     sources["/api/logs/stream?id=abc"].emitMessage({
-      data: `2019-06-12T10:55:42.459034602Z \x1b[30mblack\x1b[37mwhite`
+      data: `2019-06-12T10:55:42.459034602Z \x1b[30mblack\x1b[37mwhite`,
     });
 
+    await wrapper.vm.$nextTick();
     expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
       <ul class="events medium">
         <li><span class="date">today at 10:55 AM</span> <span class="text"><span style="color:#000">black<span style="color:#AAA">white</span></span></span></li>
@@ -150,9 +172,10 @@ describe("<LogEventSource />", () => {
     const wrapper = createLogEventSource();
     sources["/api/logs/stream?id=abc"].emitOpen();
     sources["/api/logs/stream?id=abc"].emitMessage({
-      data: `2019-06-12T10:55:42.459034602Z <test>foo bar</test>`
+      data: `2019-06-12T10:55:42.459034602Z <test>foo bar</test>`,
     });
 
+    await wrapper.vm.$nextTick();
     expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
       <ul class="events medium">
         <li><span class="date">today at 10:55 AM</span> <span class="text">&lt;test&gt;foo bar&lt;/test&gt;</span></li>
@@ -164,12 +187,13 @@ describe("<LogEventSource />", () => {
     const wrapper = createLogEventSource("test");
     sources["/api/logs/stream?id=abc"].emitOpen();
     sources["/api/logs/stream?id=abc"].emitMessage({
-      data: `2019-06-11T10:55:42.459034602Z Foo bar`
+      data: `2019-06-11T10:55:42.459034602Z Foo bar`,
     });
     sources["/api/logs/stream?id=abc"].emitMessage({
-      data: `2019-06-12T10:55:42.459034602Z This is a test <hi></hi>`
+      data: `2019-06-12T10:55:42.459034602Z This is a test <hi></hi>`,
     });
 
+    await wrapper.vm.$nextTick();
     expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
       <ul class="events medium">
         <li><span class="date">today at 10:55 AM</span> <span class="text">This is a <mark>test</mark> &lt;hi&gt;&lt;/hi&gt;</span></li>

assets/components/LogEventSource.vue

@@ -9,27 +9,16 @@
 import debounce from "lodash.debounce";
 import InfiniteLoader from "./InfiniteLoader";
 
-function parseMessage(data) {
-  const date = new Date(data.substring(0, 30));
-  const key = data.substring(0, 30);
-  const message = data.substring(30).trim();
-  return {
-    key,
-    date,
-    message
-  };
-}
-
 export default {
   props: ["id"],
   name: "LogEventSource",
   components: {
-    InfiniteLoader
+    InfiniteLoader,
   },
   data() {
     return {
       messages: [],
-      buffer: []
+      buffer: [],
     };
   },
   created() {
@@ -52,11 +41,11 @@ export default {
         250,
         { maxWait: 1000 }
       );
-      this.es.onmessage = e => {
-        this.buffer.push(parseMessage(e.data));
+      this.es.onmessage = (e) => {
+        this.buffer.push(this.parseMessage(e.data));
         flushBuffer();
       };
-      this.es.onerror = e => console.log("EventSource failed." + e);
+      this.es.onerror = (e) => console.log("EventSource failed." + e);
       this.$once("hook:beforeDestroy", () => this.es.close());
     },
     async loadOlderLogs() {
@@ -73,17 +62,27 @@ export default {
         const newMessages = logs
           .trim()
           .split("\n")
-          .map(line => parseMessage(line));
+          .map((line) => this.parseMessage(line));
         this.messages.unshift(...newMessages);
       }
-    }
+    },
+    parseMessage(data) {
+      let i = data.indexOf(" ");
+      if (i == -1) {
+        i = data.length;
+      }
+      const key = data.substring(0, i);
+      const date = new Date(key);
+      const message = data.substring(i).trim();
+      return { key, date, message };
+    },
   },
   watch: {
     id(newValue, oldValue) {
       if (oldValue !== newValue) {
         this.loadLogs(newValue);
       }
-    }
-  }
+    },
+  },
 };
 </script>

assets/components/LogViewer.vue

@@ -1,7 +1,7 @@
 <template lang="html">
   <ul class="events" :class="settings.size">
     <li v-for="item in filtered" :key="item.key">
-      <span class="date">{{ item.date | relativeTime }}</span>
+      <span class="date" v-if="settings.showTimestamp">{{ item.date | relativeTime }}</span>
       <span class="text" v-html="colorize(item.message)"></span>
     </li>
   </ul>
@@ -20,16 +20,13 @@ export default {
   components: {},
   data() {
     return {
-      showSearch: false
+      showSearch: false,
     };
   },
   methods: {
-    colorize: function(value) {
-      return ansiConvertor
-        .toHtml(value)
-        .replace("&lt;mark&gt;", "<mark>")
-        .replace("&lt;/mark&gt;", "</mark>");
-    }
+    colorize: function (value) {
+      return ansiConvertor.toHtml(value).replace("&lt;mark&gt;", "<mark>").replace("&lt;/mark&gt;", "</mark>");
+    },
   },
   computed: {
     ...mapState(["searchFilter", "settings"]),
@@ -40,10 +37,10 @@ export default {
         try {
           const regex = isSmartCase ? new RegExp(searchFilter, "i") : new RegExp(searchFilter);
           return messages
-            .filter(d => d.message.match(regex))
-            .map(d => ({
+            .filter((d) => d.message.match(regex))
+            .map((d) => ({
               ...d,
-              message: d.message.replace(regex, "<mark>$&</mark>")
+              message: d.message.replace(regex, "<mark>$&</mark>"),
             }));
         } catch (e) {
           if (e instanceof SyntaxError) {
@@ -54,13 +51,13 @@ export default {
         }
       }
       return messages;
-    }
+    },
   },
   filters: {
     relativeTime(date) {
       return formatRelative(date, new Date());
-    }
-  }
+    },
+  },
 };
 </script>
 <style scoped lang="scss">
@@ -71,6 +68,10 @@ export default {
   & > li {
     word-wrap: break-word;
     line-height: 130%;
+    &:last-child {
+      scroll-snap-align: end;
+      scroll-margin-block-end: 5rem;
+    }
   }
 
   &.small {

assets/components/LogViewerWithSource.vue

@@ -13,7 +13,7 @@ export default {
   name: "LogViewerWithSource",
   components: {
     LogEventSource,
-    LogViewer
-  }
+    LogViewer,
+  },
 };
 </script>

assets/components/MobileMenu.vue

@@ -34,22 +34,22 @@ export default {
   name: "MobileMenu",
   data() {
     return {
-      showNav: false
+      showNav: false,
     };
   },
 
   computed: {
     ...mapState(["containers"]),
-    ...mapGetters(["activeContainersById"])
+    ...mapGetters(["activeContainersById"]),
   },
   methods: {
-    ...mapActions({})
+    ...mapActions({}),
   },
   watch: {
     $route(to, from) {
       this.showNav = false;
-    }
-  }
+    },
+  },
 };
 </script>
 <style scoped lang="scss">

assets/components/ScrollableView.vue

@@ -15,7 +15,7 @@
           @click="scrollToBottom('instant')"
           v-show="paused"
         >
-          <ion-icon name="download"></ion-icon>
+          <icon name="download"></icon>
         </button>
       </transition>
     </div>
@@ -23,23 +23,28 @@
 </template>
 
 <script>
+import Icon from "./Icon";
+
 export default {
   props: {
     scrollable: {
       type: Boolean,
-      default: true
-    }
+      default: true,
+    },
+  },
+  components: {
+    Icon,
   },
   name: "ScrollableView",
   data() {
     return {
       paused: false,
-      hasMore: false
+      hasMore: false,
     };
   },
   mounted() {
     const { content } = this.$refs;
-    new MutationObserver(e => {
+    new MutationObserver((e) => {
       if (!this.paused) {
         this.scrollToBottom("instant");
       } else {
@@ -48,8 +53,8 @@ export default {
     }).observe(content, { childList: true, subtree: true });
 
     const intersectionObserver = new IntersectionObserver(
-      entries => (this.paused = entries[0].intersectionRatio == 0),
-      { threshholds: [0, 1] }
+      (entries) => (this.paused = entries[0].intersectionRatio == 0),
+      { threshholds: [0, 1], rootMargin: "80px 0px" }
     );
 
     intersectionObserver.observe(this.$refs.scrollObserver);
@@ -59,8 +64,8 @@ export default {
     scrollToBottom(behavior = "instant") {
       this.$refs.scrollObserver.scrollIntoView({ behavior });
       this.hasMore = false;
-    }
-  }
+    },
+  },
 };
 </script>
 <style scoped lang="scss">
@@ -75,6 +80,7 @@ section {
   main {
     flex: 1;
     overflow: auto;
+    scroll-snap-type: y proximity;
   }
 
   .scroll-bar-notification {

assets/components/Search.vue

@@ -10,8 +10,8 @@
           v-model="filter"
           @keyup.esc="resetSearch()"
         />
-        <span class="icon is-small is-left">
-          <ion-icon name="search"></ion-icon>
+        <span class="icon is-left">
+          <icon name="search"></icon>
         </span>
       </p>
     </div>
@@ -24,13 +24,17 @@
 <script>
 import { mapActions, mapState } from "vuex";
 import hotkeys from "hotkeys-js";
+import Icon from "./Icon";
 
 export default {
   props: [],
   name: "Search",
+  components: {
+    Icon,
+  },
   data() {
     return {
-      showSearch: false
+      showSearch: false,
     };
   },
   mounted() {
@@ -45,12 +49,12 @@ export default {
   },
   methods: {
     ...mapActions({
-      updateSearchFilter: "SET_SEARCH"
+      updateSearchFilter: "SET_SEARCH",
     }),
     resetSearch() {
       this.showSearch = false;
       this.filter = "";
-    }
+    },
   },
   computed: {
     ...mapState(["searchFilter", "settings"]),
@@ -60,9 +64,9 @@ export default {
       },
       set(value) {
         this.updateSearchFilter(value);
-      }
-    }
-  }
+      },
+    },
+  },
 };
 </script>
 
@@ -80,4 +84,8 @@ export default {
 .delete {
   margin-left: 1em;
 }
+
+.icon {
+  padding: 10px 3px;
+}
 </style>

assets/components/SideMenu.vue

@@ -8,9 +8,11 @@
         <router-link
           :to="{ name: 'settings' }"
           active-class="is-active"
-          class="button is-small is-primary is-rounded is-inverted is-outlined "
+          class="button is-small is-rounded is-settings-control"
         >
-          <span class="icon"><ion-icon name="settings" size="large"></ion-icon></span>
+          <span class="icon">
+            <icon name="cog"></icon>
+          </span>
         </router-link>
       </div>
     </div>
@@ -28,7 +30,7 @@
               class="icon is-small will-append-container"
               :class="{ 'is-active': activeContainersById[item.id] }"
             >
-              <ion-icon name="ios-add-circle"></ion-icon>
+              <icon name="pin"></icon>
             </span>
             {{ item.name }}
           </div>
@@ -41,21 +43,26 @@
 <script>
 import { mapActions, mapGetters, mapState } from "vuex";
 
+import Icon from "./Icon";
+
 export default {
   props: [],
   name: "SideMenu",
+  components: {
+    Icon,
+  },
   data() {
     return {};
   },
   computed: {
     ...mapState(["containers", "activeContainers"]),
-    ...mapGetters(["activeContainersById"])
+    ...mapGetters(["activeContainersById"]),
   },
   methods: {
     ...mapActions({
-      appendActiveContainer: "APPEND_ACTIVE_CONTAINER"
-    })
-  }
+      appendActiveContainer: "APPEND_ACTIVE_CONTAINER",
+    }),
+  },
 };
 </script>
 <style scoped lang="scss">

assets/index.html

@@ -12,11 +12,62 @@
       window["BASE_PATH"] = "{{ .Base }}";
       window["VERSION"] = "{{ .Version }}";
     </script>
-    <script type="module" src="https://unpkg.com/ionicons@4.5.10-0/dist/ionicons/ionicons.esm.js"></script>
-    <script nomodule="" src="https://unpkg.com/ionicons@4.5.10-0/dist/ionicons/ionicons.js"></script>
   </head>
 
-  <body class="is-dark">
+  <body>
+    <svg
+      aria-hidden="true"
+      style="position: absolute; width: 0; height: 0; overflow: hidden;"
+      version="1.1"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlns:xlink="http://www.w3.org/1999/xlink"
+    >
+      <defs>
+        <symbol id="icon-check" viewBox="0 0 24 24">
+          <path
+            d="M19.293 5.293l-10.293 10.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414l5 5c0.391 0.391 1.024 0.391 1.414 0l11-11c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0z"
+          ></path>
+        </symbol>
+        <symbol id="icon-chevron-down" viewBox="0 0 24 24">
+          <path
+            d="M5.293 9.707l6 6c0.391 0.391 1.024 0.391 1.414 0l6-6c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"
+          ></path>
+        </symbol>
+        <symbol id="icon-chevron-left" viewBox="0 0 24 24">
+          <path
+            d="M15.707 17.293l-5.293-5.293 5.293-5.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-6 6c-0.391 0.391-0.391 1.024 0 1.414l6 6c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414z"
+          ></path>
+        </symbol>
+        <symbol id="icon-chevron-right" viewBox="0 0 24 24">
+          <path
+            d="M9.707 18.707l6-6c0.391-0.391 0.391-1.024 0-1.414l-6-6c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414l5.293 5.293-5.293 5.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"
+          ></path>
+        </symbol>
+        <symbol id="icon-chevrons-down" viewBox="0 0 24 24">
+          <path
+            d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"
+          ></path>
+        </symbol>
+        <symbol id="icon-download" viewBox="0 0 24 24">
+          <path d="M15.6 9.6v-7.2h-7.2v7.2h-6l9.6 9.6 9.6-9.6h-6zM0 21.6h24v2.4h-24v-2.4z"></path>
+        </symbol>
+        <symbol id="icon-pin" viewBox="0 0 24 24">
+          <path
+            d="M13.2 14.4h7.2v-1.2l-3.6-1.2v-9.6l3.6-1.2v-1.2h-16.8v1.2l3.6 1.2v9.6l-3.6 1.2v1.2h7.2v8.4l1.2 1.2 1.2-1.2v-8.4z"
+          ></path>
+        </symbol>
+        <symbol id="icon-search" viewBox="0 0 24 24">
+          <path
+            d="M15.48 17.184c-1.608 1.259-3.66 2.019-5.889 2.019-5.302 0-9.6-4.298-9.6-9.6s4.298-9.6 9.6-9.6c5.302 0 9.6 4.298 9.6 9.6 0 2.229-0.76 4.281-2.035 5.91l0.016-0.021 6.42 6.396-1.704 1.704-6.396-6.408zM9.6 16.8c3.976 0 7.2-3.224 7.2-7.2s-3.224-7.2-7.2-7.2v0c-3.976 0-7.2 3.224-7.2 7.2s3.224 7.2 7.2 7.2v0z"
+          ></path>
+        </symbol>
+        <symbol id="icon-cog" viewBox="0 0 24 24">
+          <path
+            d="M21.886 14.303c-1.259-2.181-0.502-4.976 1.691-6.246l-2.358-4.085c-0.674 0.395-1.457 0.622-2.293 0.622-2.52 0-4.563-2.057-4.563-4.594h-4.717c0.006 0.783-0.189 1.577-0.608 2.303-1.259 2.181-4.058 2.923-6.255 1.658l-2.358 4.085c0.679 0.386 1.267 0.951 1.685 1.675 1.257 2.178 0.504 4.967-1.681 6.24l2.358 4.085c0.671-0.391 1.451-0.615 2.283-0.615 2.512 0 4.55 2.044 4.563 4.569h4.717c-0.002-0.775 0.194-1.56 0.609-2.279 1.257-2.177 4.049-2.92 6.244-1.664l2.358-4.085c-0.675-0.386-1.258-0.949-1.674-1.669zM12 16.859c-2.684 0-4.859-2.176-4.859-4.859s2.176-4.859 4.859-4.859c2.684 0 4.859 2.176 4.859 4.859s-2.176 4.859-4.859 4.859z"
+          ></path>
+        </symbol>
+      </defs>
+    </svg>
     <div id="app"></div>
     <script src="main.js"></script>
   </body>

assets/main.js

@@ -1,7 +1,8 @@
 import Vue from "vue";
 import VueRouter from "vue-router";
 import Meta from "vue-meta";
-import { Dropdown, Switch } from "buefy";
+import Dropdown from "buefy/dist/esm/dropdown";
+import Switch from "buefy/dist/esm/switch";
 import store from "./store";
 import App from "./App.vue";
 import Container from "./pages/Container.vue";
@@ -13,35 +14,33 @@ Vue.use(Meta);
 Vue.use(Dropdown);
 Vue.use(Switch);
 
-Vue.config.ignoredElements = [/^ion-/];
-
 const routes = [
   {
     path: "/",
     component: Index,
-    name: "default"
+    name: "default",
   },
   {
     path: "/container/:id",
     component: Container,
     name: "container",
-    props: true
+    props: true,
   },
   {
     path: "/settings",
     component: Settings,
-    name: "settings"
-  }
+    name: "settings",
+  },
 ];
 
 const router = new VueRouter({
   mode: "history",
   base: BASE_PATH + "/",
-  routes
+  routes,
 });
 
 new Vue({
   router,
   store,
-  render: h => h(App)
+  render: (h) => h(App),
 }).$mount("#app");

assets/pages/Container.vue

@@ -20,16 +20,16 @@ export default {
   components: {
     LogViewerWithSource,
     ScrollableView,
-    ContainerTitle
+    ContainerTitle,
   },
   data() {
     return {
-      title: "loading"
+      title: "loading",
     };
   },
   metaInfo() {
     return {
-      title: this.title
+      title: this.title,
     };
   },
   mounted() {
@@ -39,7 +39,7 @@ export default {
   },
   computed: {
     ...mapState(["activeContainers"]),
-    ...mapGetters(["allContainersById"])
+    ...mapGetters(["allContainersById"]),
   },
   watch: {
     id() {
@@ -47,7 +47,7 @@ export default {
     },
     allContainersById() {
       this.title = this.allContainersById[this.id].name;
-    }
-  }
+    },
+  },
 };
 </script>

assets/pages/Index.vue

@@ -11,7 +11,7 @@
 <script>
 export default {
   props: [],
-  name: "Default"
+  name: "Default",
 };
 </script>
 <style scoped>

assets/pages/Settings.vue

@@ -26,19 +26,30 @@
       </div>
 
       <div class="item">
-        <h2 class="title is-6 is-marginless">Font size</h2>
+        <b-switch v-model="smallerScrollbars">
+          Use smaller scrollbars
+        </b-switch>
+      </div>
 
+      <div class="item">
+        <b-switch v-model="showTimestamp">
+          Show timestamps
+        </b-switch>
+      </div>
+
+      <div class="item">
+        <h2 class="title is-6 is-marginless">Font size</h2>
         Modify the font size when viewing logs.
-        <br /><br />
-        <b-dropdown v-model="size" aria-role="list">
+
+        <b-dropdown v-model="size" aria-role="list" style="margin: -8px 10px 0;">
           <button class="button is-primary" type="button" slot="trigger">
             <span class="is-capitalized">{{ size }}</span>
-            <span class="icon"><ion-icon name="ios-arrow-down"></ion-icon></span>
+            <span class="icon"><icon name="chevron-down"></icon></span>
           </button>
           <b-dropdown-item :value="value" aria-role="listitem" v-for="value in ['small', 'medium', 'large']">
             <div class="media">
-              <span class="icon">
-                <ion-icon name="checkmark" v-if="value == size"></ion-icon>
+              <span class="icon keep-size">
+                <icon name="check" v-if="value == size"></icon>
               </span>
               <div class="media-content">
                 <h3 class="is-capitalized">{{ value }}</h3>
@@ -55,16 +66,19 @@
 import gt from "semver/functions/gt";
 import valid from "semver/functions/valid";
 import { mapActions, mapState } from "vuex";
+import Icon from "../components/Icon";
 
 export default {
   props: [],
   name: "Settings",
-  components: {},
+  components: {
+    Icon,
+  },
   data() {
     return {
       currentVersion: VERSION,
       nextRelease: null,
-      hasUpdate: false
+      hasUpdate: false,
     };
   },
   async created() {
@@ -74,28 +88,28 @@ export default {
   },
   metaInfo() {
     return {
-      title: "Settings"
+      title: "Settings",
     };
   },
   methods: {
     ...mapActions({
-      updateSetting: "UPDATE_SETTING"
-    })
+      updateSetting: "UPDATE_SETTING",
+    }),
   },
   computed: {
     ...mapState(["settings"]),
-    ...["search", "size"].reduce((map, name) => {
+    ...["search", "size", "smallerScrollbars", "showTimestamp"].reduce((map, name) => {
       map[name] = {
         get() {
           return this.settings[name];
         },
         set(value) {
           this.updateSetting({ [name]: value });
-        }
+        },
       };
       return map;
-    }, {})
-  }
+    }, {}),
+  },
 };
 </script>
 <style lang="scss">

assets/store/index.js

@@ -14,7 +14,7 @@ const state = {
   activeContainers: [],
   searchFilter: null,
   isMobile: mql.matches,
-  settings: storage.get(DOZZLE_SETTINGS_KEY)
+  settings: storage.get(DOZZLE_SETTINGS_KEY),
 };
 
 const mutations = {
@@ -36,7 +36,7 @@ const mutations = {
   UPDATE_SETTINGS(state, newValues) {
     state.settings = { ...state.settings, ...newValues };
     storage.set(DOZZLE_SETTINGS_KEY, state.settings);
-  }
+  },
 };
 
 const actions = {
@@ -55,7 +55,7 @@ const actions = {
   },
   UPDATE_SETTING({ commit }, setting) {
     commit("UPDATE_SETTINGS", setting);
-  }
+  },
 };
 const getters = {
   activeContainersById(state) {
@@ -69,18 +69,18 @@ const getters = {
       map[obj.id] = obj;
       return map;
     }, {});
-  }
+  },
 };
 
 const es = new EventSource(`${BASE_PATH}/api/events/stream`);
-es.addEventListener("containers-changed", e => setTimeout(() => store.dispatch("FETCH_CONTAINERS"), 1000), false);
-mql.addListener(e => store.commit("SET_MOBILE_WIDTH", e.matches));
+es.addEventListener("containers-changed", (e) => setTimeout(() => store.dispatch("FETCH_CONTAINERS"), 1000), false);
+mql.addListener((e) => store.commit("SET_MOBILE_WIDTH", e.matches));
 
 const store = new Vuex.Store({
   state,
   getters,
   actions,
-  mutations
+  mutations,
 });
 
 export default store;

assets/store/settings.js

@@ -2,5 +2,7 @@ export const DOZZLE_SETTINGS_KEY = "DOZZLE_SETTINGS";
 export const DEFAULT_SETTINGS = {
   search: true,
   size: "medium",
-  menuWidth: 15
+  menuWidth: 15,
+  smallerScrollbars: false,
+  showTimestamp: true,
 };

assets/styles.scss

@@ -9,15 +9,68 @@ $menu-item-color: hsl(0, 6%, 87%);
 @import "~buefy/src/scss/components/_dropdown";
 @import "~buefy/src/scss/components/_switch";
 
-.is-dark {
-  color: #ddd;
-  background-color: #111;
-}
-
 body {
   font-family: "Roboto", sans-serif;
+  color: #ddd;
+  background-color: #111;
 }
 
 h1.title {
   font-family: "Gafata", sans-serif;
 }
+
+html {
+  overflow-x: unset;
+  overflow-y: unset;
+  scroll-snap-type: y proximity;
+}
+
+html.has-custom-scrollbars {
+  ::-webkit-scrollbar {
+    width: 8px;
+    display: content;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background-color: rgba(128, 128, 128, 0.33);
+    outline: 1px solid slategrey;
+    border-radius: 4px;
+  }
+
+  ::-webkit-scrollbar-thumb:active {
+    background-color: #777;
+  }
+
+  ::-webkit-scrollbar-track {
+    background-color: transparent;
+  }
+
+  ::-webkit-scrollbar-track:hover {
+    background-color: rgba(64, 64, 64, 0.33);
+  }
+
+  section main {
+    scrollbar-color: #353535 transparent;
+    scrollbar-width: thin;
+  }
+}
+
+.is-settings-control {
+
+  background: rgba(0, 0, 0, 0.4);
+  color: #fff;
+  border-color: transparent;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  &:hover {
+    border-color: rgb(255, 221, 87) !important;
+    background: rgba(0, 0, 0, 0.8) !important;
+    color: #fff !important;
+  }
+
+  &:focus {
+    box-shadow: none !important;
+    color: unset;
+    border-color: transparent;
+  }
+}
+

docker/client.go

@@ -54,7 +54,7 @@ func NewClientWithFilters(f map[string]string) Client {
 
 	log.Debugf("filterArgs = %v", filterArgs)
 
-	cli, err := client.NewClientWithOpts(client.FromEnv)
+	cli, err := client.NewClientWithOpts(client.FromEnv, client.WithAPIVersionNegotiation())
 
 	if err != nil {
 		log.Fatal(err)

go.mod

@@ -14,38 +14,42 @@ require (
 	github.com/Azure/go-ansiterm v0.0.0-20170929234023-d6e3b3328b78 // indirect
 	github.com/Microsoft/go-winio v0.4.14 // indirect
 	github.com/beme/abide v0.0.0-20190723115211-635a09831760
-	github.com/containerd/containerd v1.3.2 // indirect
+	github.com/containerd/containerd v1.3.3 // indirect
 	github.com/docker/distribution v2.7.1+incompatible // indirect
 	github.com/docker/docker v0.0.0-20190827232753-32688a47f341
 	github.com/docker/go-connections v0.4.0 // indirect
 	github.com/docker/go-units v0.4.0 // indirect
-	github.com/gobuffalo/envy v1.8.1 // indirect
+	github.com/gobuffalo/envy v1.9.0 // indirect
+	github.com/gobuffalo/packd v1.0.0 // indirect
 	github.com/gobuffalo/packr v1.30.1
 	github.com/gogo/protobuf v1.3.1 // indirect
+	github.com/golang/protobuf v1.3.4 // indirect
 	github.com/google/go-cmp v0.3.1 // indirect
-	github.com/gorilla/mux v1.7.3
+	github.com/gorilla/mux v1.7.4
 	github.com/magiconair/properties v1.8.1
 	github.com/morikuni/aec v0.0.0-20170113033406-39771216ff4c // indirect
 	github.com/opencontainers/go-digest v1.0.0-rc1 // indirect
 	github.com/opencontainers/image-spec v1.0.1 // indirect
 	github.com/pelletier/go-toml v1.6.0 // indirect
-	github.com/rogpeppe/go-internal v1.5.1 // indirect
+	github.com/pkg/errors v0.9.1 // indirect
+	github.com/rogpeppe/go-internal v1.5.2 // indirect
 	github.com/sergi/go-diff v1.0.0 // indirect
-	github.com/sirupsen/logrus v1.4.2
+	github.com/sirupsen/logrus v1.5.0
 	github.com/spf13/afero v1.2.2 // indirect
 	github.com/spf13/cast v1.3.1 // indirect
 	github.com/spf13/jwalterweatherman v1.1.0 // indirect
 	github.com/spf13/pflag v1.0.5
-	github.com/spf13/viper v1.6.1
+	github.com/spf13/viper v1.6.3
 	github.com/stretchr/objx v0.2.0 // indirect
-	github.com/stretchr/testify v1.4.0
-	golang.org/x/net v0.0.0-20191209160850-c0dbc17a3553 // indirect
-	golang.org/x/sys v0.0.0-20191218084908-4a24b4065292 // indirect
+	github.com/stretchr/testify v1.5.1
+	golang.org/x/net v0.0.0-20200226121028-0de0cce0169b // indirect
+	golang.org/x/sys v0.0.0-20200223170610-d5e6a3e2c0ae // indirect
 	golang.org/x/text v0.3.2 // indirect
-	google.golang.org/genproto v0.0.0-20191216205247-b31c10ee225f // indirect
-	google.golang.org/grpc v1.26.0 // indirect
-	gopkg.in/yaml.v2 v2.2.7 // indirect
+	google.golang.org/genproto v0.0.0-20200226201735-46b91f19d98c // indirect
+	google.golang.org/grpc v1.27.1 // indirect
+	gopkg.in/ini.v1 v1.52.0 // indirect
+	gopkg.in/yaml.v2 v2.2.8 // indirect
 	gotest.tools v2.2.0+incompatible // indirect
 )
 
-go 1.13
+go 1.14

go.sum

@@ -28,12 +28,11 @@ github.com/bugsnag/panicwrap v0.0.0-20151223152923-e2c28503fcd0/go.mod h1:D/8v3k
 github.com/census-instrumentation/opencensus-proto v0.2.1/go.mod h1:f6KPmirojxKA12rnyqOA5BBL4O983OfeGPqjHWSTneU=
 github.com/cespare/xxhash v1.1.0/go.mod h1:XrSqR1VqqWfGrhpAt58auRo0WTKS1nRRg3ghfAqPWnc=
 github.com/client9/misspell v0.3.4/go.mod h1:qj6jICC3Q7zFZvVWo7KLAzC3yx5G7kyvSDkc90ppPyw=
-github.com/containerd/containerd v1.2.9 h1:6tyNjBmAMG47QuFPIT9LgiiexoVxC6qpTGR+eD0R0Z8=
-github.com/containerd/containerd v1.2.9/go.mod h1:bC6axHOhabU15QhwfG7w5PipXdVtMXFTttgp+kVtyUA=
-github.com/containerd/containerd v1.3.2 h1:ForxmXkA6tPIvffbrDAcPUIB32QgXkt2XFj+F0UxetA=
-github.com/containerd/containerd v1.3.2/go.mod h1:bC6axHOhabU15QhwfG7w5PipXdVtMXFTttgp+kVtyUA=
+github.com/containerd/containerd v1.3.3 h1:LoIzb5y9x5l8VKAlyrbusNPXqBY0+kviRloxFUMFwKc=
+github.com/containerd/containerd v1.3.3/go.mod h1:bC6axHOhabU15QhwfG7w5PipXdVtMXFTttgp+kVtyUA=
 github.com/coreos/bbolt v1.3.2/go.mod h1:iRUV2dpdMOn7Bo10OQBFzIJO9kkE559Wcmn+qkEiiKk=
 github.com/coreos/etcd v3.3.10+incompatible/go.mod h1:uF7uidLiAD3TWHmW31ZFd/JWoc32PjwdhPthX9715RE=
+github.com/coreos/etcd v3.3.13+incompatible/go.mod h1:uF7uidLiAD3TWHmW31ZFd/JWoc32PjwdhPthX9715RE=
 github.com/coreos/go-etcd v2.0.0+incompatible/go.mod h1:Jez6KQU2B/sWsbdaef3ED8NzMklzPG4d5KIOhIy30Tk=
 github.com/coreos/go-semver v0.2.0/go.mod h1:nnelYz7RCh+5ahJtPPxZlU+153eP4D4r3EedlOD2RNk=
 github.com/coreos/go-systemd v0.0.0-20190321100706-95778dfbb74e/go.mod h1:F5haX7vjVVG0kc13fIWeqUViNPyEJxv/OmvnBo0Yme4=
@@ -70,21 +69,19 @@ github.com/go-logfmt/logfmt v0.4.0/go.mod h1:3RMwSq7FuexP4Kalkev3ejPJsZTpXXBr9+V
 github.com/go-stack/stack v1.8.0/go.mod h1:v0f6uXyyMGvRgIKkXu+yp6POWl0qKG85gN/melR3HDY=
 github.com/gobuffalo/envy v1.7.0 h1:GlXgaiBkmrYMHco6t4j7SacKO4XUjvh5pwXh0f4uxXU=
 github.com/gobuffalo/envy v1.7.0/go.mod h1:n7DRkBerg/aorDM8kbduw5dN3oXGswK5liaSCx4T5NI=
-github.com/gobuffalo/envy v1.7.1 h1:OQl5ys5MBea7OGCdvPbBJWRgnhC/fGona6QKfvFeau8=
-github.com/gobuffalo/envy v1.7.1/go.mod h1:FurDp9+EDPE4aIUS3ZLyD+7/9fpx7YRt/ukY6jIHf0w=
-github.com/gobuffalo/envy v1.8.1 h1:RUr68liRvs0TS1D5qdW3mQv2SjAsu1QWMCx1tG4kDjs=
-github.com/gobuffalo/envy v1.8.1/go.mod h1:FurDp9+EDPE4aIUS3ZLyD+7/9fpx7YRt/ukY6jIHf0w=
+github.com/gobuffalo/envy v1.9.0 h1:eZR0DuEgVLfeIb1zIKt3bT4YovIMf9O9LXQeCZLXpqE=
+github.com/gobuffalo/envy v1.9.0/go.mod h1:FurDp9+EDPE4aIUS3ZLyD+7/9fpx7YRt/ukY6jIHf0w=
 github.com/gobuffalo/logger v1.0.0/go.mod h1:2zbswyIUa45I+c+FLXuWl9zSWEiVuthsk8ze5s8JvPs=
 github.com/gobuffalo/packd v0.3.0 h1:eMwymTkA1uXsqxS0Tpoop3Lc0u3kTfiMBE6nKtQU4g4=
 github.com/gobuffalo/packd v0.3.0/go.mod h1:zC7QkmNkYVGKPw4tHpBQ+ml7W/3tIebgeo1b36chA3Q=
+github.com/gobuffalo/packd v1.0.0 h1:6ERZvJHfe24rfFmA9OaoKBdC7+c9sydrytMg8SdFGBM=
+github.com/gobuffalo/packd v1.0.0/go.mod h1:6VTc4htmJRFB7u1m/4LeMTWjFoYrUiBkU9Fdec9hrhI=
 github.com/gobuffalo/packr v1.30.1 h1:hu1fuVR3fXEZR7rXNW3h8rqSML8EVAf6KNm0NKO/wKg=
 github.com/gobuffalo/packr v1.30.1/go.mod h1:ljMyFO2EcrnzsHsN99cvbq055Y9OhRrIaviy289eRuk=
 github.com/gobuffalo/packr/v2 v2.5.1/go.mod h1:8f9c96ITobJlPzI44jj+4tHnEKNt0xXWSVlXRN9X1Iw=
 github.com/gogo/protobuf v1.1.1/go.mod h1:r8qH/GZQm5c6nD/R0oafs1akxWv10x8SbQlK7atdtwQ=
 github.com/gogo/protobuf v1.2.1 h1:/s5zKNz0uPFCZ5hddgPdo2TK2TVrUNMn0OOX8/aZMTE=
 github.com/gogo/protobuf v1.2.1/go.mod h1:hp+jE20tsWTFYpLwKvXlhS1hjn+gTNwPg2I6zVXpSg4=
-github.com/gogo/protobuf v1.3.0 h1:G8O7TerXerS4F6sx9OV7/nRfJdnXgHZu/S/7F2SN+UE=
-github.com/gogo/protobuf v1.3.0/go.mod h1:SlYgWuQ5SjCEi6WLHjHCa1yvBfUnHcTbrrZtXPKa29o=
 github.com/gogo/protobuf v1.3.1 h1:DqDEcV5aeaTmdFBePNpYsp3FlcVH/2ISVVM9Qf8PSls=
 github.com/gogo/protobuf v1.3.1/go.mod h1:SlYgWuQ5SjCEi6WLHjHCa1yvBfUnHcTbrrZtXPKa29o=
 github.com/golang/glog v0.0.0-20160126235308-23def4e6c14b h1:VKtxabqXZkF25pY9ekfRL6a582T4P37/31XEstQ5p58=
@@ -97,15 +94,20 @@ github.com/golang/protobuf v1.3.1 h1:YF8+flBXS5eO826T4nzqPrxfhQThhXl0YzfuUPu4SBg
 github.com/golang/protobuf v1.3.1/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
 github.com/golang/protobuf v1.3.2 h1:6nsPYzhq5kReh6QImI3k5qWzO4PEbvbIW2cwSfR/6xs=
 github.com/golang/protobuf v1.3.2/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
+github.com/golang/protobuf v1.3.3/go.mod h1:vzj43D7+SQXF/4pzW/hwtAqwc6iTitCiVSaWz5lYuqw=
+github.com/golang/protobuf v1.3.4 h1:87PNWwrRvUSnqS4dlcBU/ftvOIBep4sYuBLlh6rX2wk=
+github.com/golang/protobuf v1.3.4/go.mod h1:vzj43D7+SQXF/4pzW/hwtAqwc6iTitCiVSaWz5lYuqw=
 github.com/google/btree v1.0.0/go.mod h1:lNA+9X1NB3Zf8V7Ke586lFgjr2dZNuvo3lPJSGZ5JPQ=
 github.com/google/go-cmp v0.2.0/go.mod h1:oXzfMopK8JAjlY9xF4vHSVASa0yLyX7SntLO5aqRK0M=
 github.com/google/go-cmp v0.3.1 h1:Xye71clBPdm5HgqGwUkwhbynsUJZhDbS20FvLhQ2izg=
 github.com/google/go-cmp v0.3.1/go.mod h1:8QqcDgzrUqlUb/G2PQTWiueGozuR1884gddMywk6iLU=
+github.com/google/gofuzz v1.0.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/M65Eg=
+github.com/gopherjs/gopherjs v0.0.0-20181017120253-0766667cb4d1 h1:EGx4pi6eqNxGaHF6qqu48+N2wcFQ5qg5FXgOdqsJ5d8=
 github.com/gopherjs/gopherjs v0.0.0-20181017120253-0766667cb4d1/go.mod h1:wJfORRmW1u3UXTncJ5qlYoELFm8eSnnEO6hX4iZ3EWY=
 github.com/gorilla/handlers v0.0.0-20150720190736-60c7bfde3e33/go.mod h1:Qkdc/uu4tH4g6mTK6auzZ766c4CA0Ng8+o/OAirnOIQ=
 github.com/gorilla/mux v1.7.2/go.mod h1:1lud6UwP+6orDFRuTfBEV8e9/aOM/c4fVVCaMa2zaAs=
-github.com/gorilla/mux v1.7.3 h1:gnP5JzjVOuiZD07fKKToCAOjS0yOpj/qPETTXCCS6hw=
-github.com/gorilla/mux v1.7.3/go.mod h1:1lud6UwP+6orDFRuTfBEV8e9/aOM/c4fVVCaMa2zaAs=
+github.com/gorilla/mux v1.7.4 h1:VuZ8uybHlWmqV03+zRzdwKL4tUnIp1MAQtp1mIFE1bc=
+github.com/gorilla/mux v1.7.4/go.mod h1:DVbg23sWSpFRCP0SfiEN6jmj59UnW/n46BH5rLB71So=
 github.com/gorilla/websocket v1.4.0/go.mod h1:E7qHFY5m1UJ88s3WnNqhKjPHQ0heANvMoAMk2YaljkQ=
 github.com/grpc-ecosystem/go-grpc-middleware v1.0.0/go.mod h1:FiyG127CGDf3tlThmgyCl78X/SZQqEOJBCDaAfeWzPs=
 github.com/grpc-ecosystem/go-grpc-prometheus v1.2.0/go.mod h1:8NvIoxWQoOIhqOTXgfV/d3M/q6VIi02HzZEHgUlZvzk=
@@ -118,6 +120,8 @@ github.com/jmespath/go-jmespath v0.0.0-20160803190731-bd40a432e4c7/go.mod h1:Nht
 github.com/joho/godotenv v1.3.0 h1:Zjp+RcGpHhGlrMbJzXTrZZPrWj+1vfm90La1wgB6Bhc=
 github.com/joho/godotenv v1.3.0/go.mod h1:7hK45KPybAkOC6peb+G5yklZfMxEjkZhHbwpqxOKXbg=
 github.com/jonboulle/clockwork v0.1.0/go.mod h1:Ii8DK3G1RaLaWxj9trq07+26W01tbo22gdxWY5EU2bo=
+github.com/json-iterator/go v1.1.9/go.mod h1:KdQUCv79m/52Kvf8AW2vK1V8akMuk1QjK/uOdHXbAo4=
+github.com/jtolds/gls v4.20.0+incompatible h1:xdiiI2gbIgH/gLH7ADydsJ1uDOEzR8yvV7C0MuV77Wo=
 github.com/jtolds/gls v4.20.0+incompatible/go.mod h1:QJZ7F/aHp+rZTRtaJ1ow/lLfFfVYBRgL+9YlvaHOwJU=
 github.com/julienschmidt/httprouter v1.2.0/go.mod h1:SYymIcj16QtmaHHD7aYtjjsJG7VTCxuUUipMqKk8s4w=
 github.com/karrick/godirwalk v1.10.12/go.mod h1:RoGL9dQei4vP9ilrpETWE8CLOZ1kiN0LhBygSwrAsHA=
@@ -142,6 +146,9 @@ github.com/mitchellh/go-homedir v1.1.0/go.mod h1:SfyaCUpYCn1Vlf4IUYiD9fPX4A5wJrk
 github.com/mitchellh/mapstructure v1.1.2 h1:fmNYVwqnSfB9mZU6OS2O6GsXM+wcskZDuKQzvN1EDeE=
 github.com/mitchellh/mapstructure v1.1.2/go.mod h1:FVVH3fgwuzCH5S8UJGiWEs2h04kUh9fWfEaFds41c1Y=
 github.com/mitchellh/osext v0.0.0-20151018003038-5e2d6d41470f/go.mod h1:OkQIRizQZAeMln+1tSwduZz7+Af5oFlKirV/MSYes2A=
+github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
+github.com/modern-go/reflect2 v0.0.0-20180701023420-4b7aa43c6742/go.mod h1:bx2lNnkwVCuqBIxFjflWJWanXIb3RllmbCylyMrvgv0=
+github.com/modern-go/reflect2 v1.0.1/go.mod h1:bx2lNnkwVCuqBIxFjflWJWanXIb3RllmbCylyMrvgv0=
 github.com/morikuni/aec v0.0.0-20170113033406-39771216ff4c h1:nXxl5PrvVm2L/wCy8dQu6DMTwH4oIuGN8GJDAlqDdVE=
 github.com/morikuni/aec v0.0.0-20170113033406-39771216ff4c/go.mod h1:BbKIizmSmc5MMPqRYbxO4ZU0S0+P200+tUnFx7PXmsc=
 github.com/mwitkow/go-conntrack v0.0.0-20161129095857-cc309e4a2223/go.mod h1:qRWi+5nqEBWmkhHvq77mSJWrCKwh8bxhgT7d/eI7P4U=
@@ -155,14 +162,14 @@ github.com/opencontainers/image-spec v1.0.1 h1:JMemWkRwHx4Zj+fVxWoMCFm/8sYGGrUVo
 github.com/opencontainers/image-spec v1.0.1/go.mod h1:BtxoFyWECRxE4U/7sNtV5W15zMzWCbyJoFRP3s7yZA0=
 github.com/pelletier/go-toml v1.2.0 h1:T5zMGML61Wp+FlcbWjRDT7yAxhJNAiPPLOFECq181zc=
 github.com/pelletier/go-toml v1.2.0/go.mod h1:5z9KED0ma1S8pY6P1sdut58dfprrGBbd/94hg7ilaic=
-github.com/pelletier/go-toml v1.4.0 h1:u3Z1r+oOXJIkxqw34zVhyPgjBsm6X2wn21NWs/HfSeg=
-github.com/pelletier/go-toml v1.4.0/go.mod h1:PN7xzY2wHTK0K9p34ErDQMlFxa51Fk0OUruD3k1mMwo=
 github.com/pelletier/go-toml v1.6.0 h1:aetoXYr0Tv7xRU/V4B4IZJ2QcbtMUFoNb3ORp7TzIK4=
 github.com/pelletier/go-toml v1.6.0/go.mod h1:5N711Q9dKgbdkxHL+MEfF31hpT7l0S0s/t2kKREewys=
 github.com/pkg/errors v0.8.0 h1:WdK/asTD0HN+q6hsWO3/vpuAkAr+tw6aNJNDFFf0+qw=
 github.com/pkg/errors v0.8.0/go.mod h1:bwawxfHBFNV+L2hUp1rHADufV3IMtnDRdf1r5NINEl0=
 github.com/pkg/errors v0.8.1 h1:iURUrRGxPUNPdy5/HRSm+Yj6okJ6UtLINN0Q9M4+h3I=
 github.com/pkg/errors v0.8.1/go.mod h1:bwawxfHBFNV+L2hUp1rHADufV3IMtnDRdf1r5NINEl0=
+github.com/pkg/errors v0.9.1 h1:FEBLx1zS214owpjy7qsBeixbURkuhQAwrK5UwLGTwt4=
+github.com/pkg/errors v0.9.1/go.mod h1:bwawxfHBFNV+L2hUp1rHADufV3IMtnDRdf1r5NINEl0=
 github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
 github.com/prometheus/client_golang v0.0.0-20180209125602-c332b6f63c06/go.mod h1:7SWBe2y4D6OKWSNQJUaRYU/AaXPKyh/dDVn+NZz0KFw=
@@ -185,8 +192,8 @@ github.com/rogpeppe/go-internal v1.3.0 h1:RR9dF3JtopPvtkroDZuVD7qquD0bnHlKSqaQhg
 github.com/rogpeppe/go-internal v1.3.0/go.mod h1:M8bDsm7K2OlrFYOpmOWEs/qY81heoFRclV5y23lUDJ4=
 github.com/rogpeppe/go-internal v1.3.2 h1:XU784Pr0wdahMY2bYcyK6N1KuaRAdLtqD4qd8D18Bfs=
 github.com/rogpeppe/go-internal v1.3.2/go.mod h1:xXDCJY+GAPziupqXw64V24skbSoqbTEfhy4qGm1nDQc=
-github.com/rogpeppe/go-internal v1.5.1 h1:asQ0uD7BN9RU5Im41SEEZTwCi/zAXdMOLS3npYaos2g=
-github.com/rogpeppe/go-internal v1.5.1/go.mod h1:xXDCJY+GAPziupqXw64V24skbSoqbTEfhy4qGm1nDQc=
+github.com/rogpeppe/go-internal v1.5.2 h1:qLvObTrvO/XRCqmkKxUlOBc48bI3efyDuAZe25QiF0w=
+github.com/rogpeppe/go-internal v1.5.2/go.mod h1:xXDCJY+GAPziupqXw64V24skbSoqbTEfhy4qGm1nDQc=
 github.com/russross/blackfriday v1.5.2/go.mod h1:JO/DiYxRf+HjHt06OyowR9PTA263kcR/rfWxYHBV53g=
 github.com/satori/go.uuid v1.2.0/go.mod h1:dA0hQrYB0VpLJoorglMZABFdXlWrHn1NEOzdhQKdks0=
 github.com/sergi/go-diff v1.0.0 h1:Kpca3qRNrduNnOQeazBd0ysaKrUJiIuISHxogkT9RPQ=
@@ -195,8 +202,12 @@ github.com/sirupsen/logrus v1.2.0/go.mod h1:LxeOpSwHxABJmUn/MG1IvRgCAasNZTLOkJPx
 github.com/sirupsen/logrus v1.4.1/go.mod h1:ni0Sbl8bgC9z8RoU9G6nDWqqs/fq4eDPysMBDgk/93Q=
 github.com/sirupsen/logrus v1.4.2 h1:SPIRibHv4MatM3XXNO2BJeFLZwZ2LvZgfQ5+UNI2im4=
 github.com/sirupsen/logrus v1.4.2/go.mod h1:tLMulIdttU9McNUspp0xgXVQah82FyeX6MwdIuYE2rE=
+github.com/sirupsen/logrus v1.5.0 h1:1N5EYkVAPEywqZRJd7cwnRtCb6xJx7NH3T3WUTF980Q=
+github.com/sirupsen/logrus v1.5.0/go.mod h1:+F7Ogzej0PZc/94MaYx/nvG9jOFMD2osvC3s+Squfpo=
+github.com/smartystreets/assertions v0.0.0-20180927180507-b2de0cb4f26d h1:zE9ykElWQ6/NYmHa3jpm/yHnI4xSofP+UP6SpjHcSeM=
 github.com/smartystreets/assertions v0.0.0-20180927180507-b2de0cb4f26d/go.mod h1:OnSkiWE9lh6wB0YB77sQom3nweQdgAjqCqsofrRNTgc=
 github.com/smartystreets/goconvey v0.0.0-20190330032615-68dc04aab96a/go.mod h1:syvi0/a8iFYH4r/RixwvyeAJjdLS9QV7WQ/tjFTllLA=
+github.com/smartystreets/goconvey v1.6.4 h1:fv0U8FUIMPNf1L9lnHLvLhgicrIVChEkdzIKYqbNC9s=
 github.com/smartystreets/goconvey v1.6.4/go.mod h1:syvi0/a8iFYH4r/RixwvyeAJjdLS9QV7WQ/tjFTllLA=
 github.com/soheilhy/cmux v0.1.4/go.mod h1:IM3LyeVVIOuxMH7sFAkER9+bJ4dT7Ms6E4xg4kGIyLM=
 github.com/spaolacci/murmur3 v0.0.0-20180118202830-f09979ecbc72/go.mod h1:JwIasOWyU6f++ZhiEuf87xNszmSA2myDM2Kzu9HwQUA=
@@ -220,12 +231,8 @@ github.com/spf13/pflag v1.0.5 h1:iy+VFUOCP1a+8yFto/drg2CJ5u0yRoB7fZw3DKv/JXA=
 github.com/spf13/pflag v1.0.5/go.mod h1:McXfInJRrz4CZXVZOBLb0bTZqETkiAhM9Iw0y3An2Bg=
 github.com/spf13/viper v1.3.2 h1:VUFqw5KcqRf7i70GOzW7N+Q7+gxVBkSSqiXB12+JQ4M=
 github.com/spf13/viper v1.3.2/go.mod h1:ZiWeW+zYFKm7srdB9IoDzzZXaJaI5eL9QjNiN/DMA2s=
-github.com/spf13/viper v1.4.0 h1:yXHLWeravcrgGyFSyCgdYpXQ9dR9c/WED3pg1RhxqEU=
-github.com/spf13/viper v1.4.0/go.mod h1:PTJ7Z/lr49W6bUbkmS1V3by4uWynFiR9p7+dSq/yZzE=
-github.com/spf13/viper v1.5.0 h1:GpsTwfsQ27oS/Aha/6d1oD7tpKIqWnOA6tgOX9HHkt4=
-github.com/spf13/viper v1.5.0/go.mod h1:AkYRkVJF8TkSG/xet6PzXX+l39KhhXa2pdqVSxnTcn4=
-github.com/spf13/viper v1.6.1 h1:VPZzIkznI1YhVMRi6vNFLHSwhnhReBfgTxIPccpfdZk=
-github.com/spf13/viper v1.6.1/go.mod h1:t3iDnF5Jlj76alVNuyFBk5oUMCvsrkbvZK0WQdfDi5k=
+github.com/spf13/viper v1.6.3 h1:pDDu1OyEDTKzpJwdq4TiuLyMsUgRa/BT5cn5O62NoHs=
+github.com/spf13/viper v1.6.3/go.mod h1:jUMtyi0/lB5yZH/FjyGAoH7IMNrIhlBf6pXZmbMDvzw=
 github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
 github.com/stretchr/objx v0.1.1/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
 github.com/stretchr/objx v0.2.0 h1:Hbg2NidpLE8veEBkEZTL3CvlkUIVzuU9jDplZO54c48=
@@ -235,10 +242,11 @@ github.com/stretchr/testify v1.3.0 h1:TivCn/peBQ7UY8ooIcPgZFpTNSz0Q2U6UrFlUfqbe0
 github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
 github.com/stretchr/testify v1.4.0 h1:2E4SXV/wtOkTonXsotYi4li6zVWxYlZuYNCXe9XRJyk=
 github.com/stretchr/testify v1.4.0/go.mod h1:j7eGeouHqKxXV5pUuKE4zz7dFj8WfuZ+81PSLYec5m4=
+github.com/stretchr/testify v1.5.1 h1:nOGnQDM7FYENwehXlg/kFVnos3rEvtKTjRvOWSzb6H4=
+github.com/stretchr/testify v1.5.1/go.mod h1:5W2xD1RspED5o8YsWQXVCued0rvSQ+mT+I5cxcmMvtA=
 github.com/subosito/gotenv v1.2.0 h1:Slr1R9HxAlEKefgq5jn9U+DnETlIUa6HfgEzj0g5d7s=
 github.com/subosito/gotenv v1.2.0/go.mod h1:N0PQaV/YGNqwC0u51sEeR/aUtSLEXKX9iv69rRypqCw=
 github.com/tmc/grpc-websocket-proxy v0.0.0-20190109142713-0ad062ec5ee5/go.mod h1:ncp9v5uamzpCO7NfCPTXjqaC+bZgJeR0sMTm6dMHP7U=
-github.com/ugorji/go v1.1.4/go.mod h1:uQMGLiO92mf5W77hV/PUCpI3pbzQx3CRekS0kk+RGrc=
 github.com/ugorji/go/codec v0.0.0-20181204163529-d75b2dcb6bc8/go.mod h1:VFNgLljTbGfSG7qAOspJ7OScBnGdDN/yBr0sguwnwf0=
 github.com/xiang90/probing v0.0.0-20190116061207-43a291ad63a2/go.mod h1:UETIi67q53MR2AWcXfiuqkDkRtnGDLqkBTpCHuJHxtU=
 github.com/xordataexchange/crypt v0.0.3-0.20170626215501-b2862e3d0a77/go.mod h1:aYKd//L2LvnjZzWKhF00oedf4jCCReLcmhLdhm1A27Q=
@@ -269,10 +277,8 @@ golang.org/x/net v0.0.0-20190404232315-eb5bcb51f2a3/go.mod h1:t9HGtf8HONx5eT2rtn
 golang.org/x/net v0.0.0-20190522155817-f3200d17e092 h1:4QSRKanuywn15aTZvI/mIDEgPQpswuFndXpOj3rKEco=
 golang.org/x/net v0.0.0-20190522155817-f3200d17e092/go.mod h1:HSz+uSET+XFnRR8LxR5pz3Of3rY3CfYBVs4xY44aLks=
 golang.org/x/net v0.0.0-20190619014844-b5b0513f8c1b/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
-golang.org/x/net v0.0.0-20190918130420-a8b05e9114ab h1:h5tBRKZ1aY/bo6GNqe/4zWC8GkaLOFQ5wPKIOQ0i2sA=
-golang.org/x/net v0.0.0-20190918130420-a8b05e9114ab/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
-golang.org/x/net v0.0.0-20191209160850-c0dbc17a3553 h1:efeOvDhwQ29Dj3SdAV/MJf8oukgn+8D8WgaCaRMchF8=
-golang.org/x/net v0.0.0-20191209160850-c0dbc17a3553/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
+golang.org/x/net v0.0.0-20200226121028-0de0cce0169b h1:0mm1VjtFUOIlE1SbDlwjYaDxZVDP2S5ou6y0gSgXHu8=
+golang.org/x/net v0.0.0-20200226121028-0de0cce0169b/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
 golang.org/x/oauth2 v0.0.0-20180821212333-d2e6202438be/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/oauth2 v0.0.0-20190604053449-0f29369cfe45/go.mod h1:gOpvHmFTYa4IltrdGE7lF6nIHvwfUNPOp7c8zoXwtLw=
 golang.org/x/sync v0.0.0-20180314180146-1d60e4601c6f/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
@@ -293,10 +299,8 @@ golang.org/x/sys v0.0.0-20190507160741-ecd444e8653b/go.mod h1:h1NjWce9XRLGQEsW7w
 golang.org/x/sys v0.0.0-20190515120540-06a5c4944438 h1:khxRGsvPk4n2y8I/mLLjp7e5dMTJmH75wvqS6nMwUtY=
 golang.org/x/sys v0.0.0-20190515120540-06a5c4944438/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20190602015325-4c4f7f33c9ed/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
-golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3 h1:7TYNF4UdlohbFwpNH04CoPMp1cHUZgO1Ebq5r2hIjfo=
-golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
-golang.org/x/sys v0.0.0-20191218084908-4a24b4065292 h1:Y8q0zsdcgAd+JU8VUA8p8Qv2YhuY9zevDG2ORt5qBUI=
-golang.org/x/sys v0.0.0-20191218084908-4a24b4065292/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
+golang.org/x/sys v0.0.0-20200223170610-d5e6a3e2c0ae h1:/WDfKMnPU+m5M4xB+6x4kaepxRw6jWvR5iDRdvjHgy8=
+golang.org/x/sys v0.0.0-20200223170610-d5e6a3e2c0ae/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
 golang.org/x/text v0.3.2 h1:tW2bmiBqwgJj/UpqtC8EpXEZVYOwU0yG4iWbprSVAcs=
 golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk=
@@ -318,19 +322,16 @@ google.golang.org/cloud v0.0.0-20151119220103-975617b05ea8/go.mod h1:0H1ncTHf11K
 google.golang.org/genproto v0.0.0-20180817151627-c66870c02cf8 h1:Nw54tB0rB7hY/N0NQvRW8DG4Yk3Q6T9cu9RcFQDu1tc=
 google.golang.org/genproto v0.0.0-20180817151627-c66870c02cf8/go.mod h1:JiN7NxoALGmiZfu7CAH4rXhgtRTLTxftemlI0sWmxmc=
 google.golang.org/genproto v0.0.0-20190819201941-24fa4b261c55/go.mod h1:DMBHOl98Agz4BDEuKkezgsaosCRResVns1a3J2ZsMNc=
-google.golang.org/genproto v0.0.0-20190916214212-f660b8655731 h1:Phvl0+G5t5k/EUFUi0wPdUUeTL2HydMQUXHnunWgSb0=
-google.golang.org/genproto v0.0.0-20190916214212-f660b8655731/go.mod h1:IbNlFCBrqXvoKpeg0TB2l7cyZUmoaFKYIwrEpbDKLA8=
-google.golang.org/genproto v0.0.0-20191216205247-b31c10ee225f h1:0RYv5T9ZdroAqqfM2taEB0nJrArv0X1JpIdgUmY4xg8=
-google.golang.org/genproto v0.0.0-20191216205247-b31c10ee225f/go.mod h1:n3cpQtvxv34hfy77yVDNjmbRyujviMdxYliBSkLhpCc=
+google.golang.org/genproto v0.0.0-20200226201735-46b91f19d98c h1:xFOdgVPpeowWAH0MJ5i0XMp+3yWiWamMtN/kx9xThIQ=
+google.golang.org/genproto v0.0.0-20200226201735-46b91f19d98c/go.mod h1:55QSHmfGQM9UVYDPBsyGGes0y52j32PQ3BqQfXhyH3c=
 google.golang.org/grpc v0.0.0-20160317175043-d3ddb4469d5a/go.mod h1:yo6s7OP7yaDglbqo1J04qKzAhqBH6lvTonzMVmEdcZw=
 google.golang.org/grpc v1.19.0/go.mod h1:mqu4LbDTu4XGKhr4mRzUsmM4RtVoemTSY81AxZiDr8c=
 google.golang.org/grpc v1.21.0 h1:G+97AoqBnmZIT91cLG/EkCoK9NSelj64P8bOHHNmGn0=
 google.golang.org/grpc v1.21.0/go.mod h1:oYelfM1adQP15Ek0mdvEgi9Df8B9CZIaU1084ijfRaM=
 google.golang.org/grpc v1.23.0/go.mod h1:Y5yQAOtifL1yxbo5wqy6BxZv8vAUGQwXBOALyacEbxg=
-google.golang.org/grpc v1.23.1 h1:q4XQuHFC6I28BKZpo6IYyb3mNO+l7lSOxRuYTCiDfXk=
-google.golang.org/grpc v1.23.1/go.mod h1:Y5yQAOtifL1yxbo5wqy6BxZv8vAUGQwXBOALyacEbxg=
-google.golang.org/grpc v1.26.0 h1:2dTRdpdFEEhJYQD8EMLB61nnrzSCTbG38PhqdhvOltg=
-google.golang.org/grpc v1.26.0/go.mod h1:qbnxyOmOxrQa7FizSgH+ReBfzJrCY1pSN7KXBS8abTk=
+google.golang.org/grpc v1.27.0/go.mod h1:qbnxyOmOxrQa7FizSgH+ReBfzJrCY1pSN7KXBS8abTk=
+google.golang.org/grpc v1.27.1 h1:zvIju4sqAGvwKspUQOhwnpcqSbzi7/H6QomNNjTL4sk=
+google.golang.org/grpc v1.27.1/go.mod h1:qbnxyOmOxrQa7FizSgH+ReBfzJrCY1pSN7KXBS8abTk=
 gopkg.in/alecthomas/kingpin.v2 v2.2.6/go.mod h1:FMv+mEhP44yOT+4EoQTLFTRgOQ1FBLkstjWtayDeSgw=
 gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
 gopkg.in/check.v1 v1.0.0-20141024133853-64131543e789/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
@@ -339,6 +340,8 @@ gopkg.in/check.v1 v1.0.0-20180628173108-788fd7840127/go.mod h1:Co6ibVJAznAaIkqp8
 gopkg.in/errgo.v2 v2.1.0/go.mod h1:hNsd1EY+bozCKY1Ytp96fpM3vjJbqLJn88ws8XvfDNI=
 gopkg.in/ini.v1 v1.51.0 h1:AQvPpx3LzTDM0AjnIRlVFwFFGC+npRopjZxLJj6gdno=
 gopkg.in/ini.v1 v1.51.0/go.mod h1:pNLf8WUiyNEtQjuu5G5vTm06TEv9tsIgeAvK8hOrP4k=
+gopkg.in/ini.v1 v1.52.0 h1:j+Lt/M1oPPejkniCg1TkWE2J3Eh1oZTsHSXzMTzUXn4=
+gopkg.in/ini.v1 v1.52.0/go.mod h1:pNLf8WUiyNEtQjuu5G5vTm06TEv9tsIgeAvK8hOrP4k=
 gopkg.in/resty.v1 v1.12.0/go.mod h1:mDo4pnntr5jdWRML875a/NmxYqAlA73dVijT2AXvQQo=
 gopkg.in/yaml.v2 v2.0.0-20170812160011-eb3733d160e7/go.mod h1:JAlM8MvJe8wmxCU4Bli9HhUf9+ttbYbLASfIpnQbh74=
 gopkg.in/yaml.v2 v2.2.1/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
@@ -346,8 +349,8 @@ gopkg.in/yaml.v2 v2.2.2 h1:ZCJp+EgiOT7lHqUV2J862kp8Qj64Jo6az82+3Td9dZw=
 gopkg.in/yaml.v2 v2.2.2/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
 gopkg.in/yaml.v2 v2.2.4 h1:/eiJrUcujPVeJ3xlSWaiNi3uSVmDGBK1pDHUHAnao1I=
 gopkg.in/yaml.v2 v2.2.4/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
-gopkg.in/yaml.v2 v2.2.7 h1:VUgggvou5XRW9mHwD/yXxIYSMtY0zoKQf/v226p2nyo=
-gopkg.in/yaml.v2 v2.2.7/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
+gopkg.in/yaml.v2 v2.2.8 h1:obN1ZagJSUGI0Ek/LBmuj4SNLPfIny3KsKFopxRdj10=
+gopkg.in/yaml.v2 v2.2.8/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
 gotest.tools v2.2.0+incompatible h1:VsBPFP1AI068pPrMxtb/S8Zkgf9xEmTLJjfM+P5UIEo=
 gotest.tools v2.2.0+incompatible/go.mod h1:DsYFclhRJ6vuDpmuTbkuFWG+y2sxOXAzmJt81HFBacw=
 honnef.co/go/tools v0.0.0-20190102054323-c2f93a96b099/go.mod h1:rf3lG4BRIbNafJWhAfAdb/ePZxsR/4RtNHQocxwk9r4=

integration/.gitignore

@@ -0,0 +1 @@
+__diff_output__

integration/Dockerfile

@@ -0,0 +1,8 @@
+FROM amir20/docker-alpine-puppeteer:edge
+
+COPY --chown=pptruser:pptruser package*.json /app/
+RUN yarn 
+
+COPY --chown=pptruser:pptruser . /app/
+
+CMD [ "yarn", "test"]

integration/docker-compose.test.yml

@@ -0,0 +1,18 @@
+version: "3.4"
+services:
+  dozzle:
+    container_name: dozzle
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+    environment:
+      - DOZZLE_FILTER=name=dozzle
+    build:
+      context: ..    
+  integration:
+    build:
+      context: .
+    command: npm test
+    environment:
+      - BASE=http://dozzle:8080/
+    depends_on:
+      - dozzle

integration/jest-puppeteer.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  launch: {
+    headless: process.env.HEADLESS !== "false",
+    defaultViewport: { width: 1920, height: 1200 },
+    args: ["--no-sandbox", "--disable-setuid-sandbox"],
+    executablePath: process.env.CHROME_EXE_PATH || "",
+  },
+  browserContext: "incognito",
+};

integration/jest-setup.js

@@ -0,0 +1,5 @@
+const { toMatchImageSnapshot } = require("jest-image-snapshot");
+
+expect.extend({ toMatchImageSnapshot });
+
+jest.setTimeout(5000);

integration/package.json

@@ -0,0 +1,24 @@
+{
+ "name": "test",
+ "version": "1.0.0",
+ "description": "",
+ "scripts": {
+  "test": "jest"
+ },
+ "author": "",
+ "license": "ISC",
+ "dependencies": {
+  "jest": "^25.2.6",
+  "jest-image-snapshot": "^3.0.1",
+  "puppeteer": "^2.1.1"
+ },
+ "jest": {
+  "preset": "jest-puppeteer",
+  "setupFilesAfterEnv": [
+   "<rootDir>/jest-setup.js"
+  ]
+ },
+ "devDependencies": {
+  "jest-puppeteer": "^4.4.0"
+ }
+}

integration/test.js

@@ -0,0 +1,65 @@
+const puppeteer = require("puppeteer");
+const iPhoneX = puppeteer.devices["iPhone X"];
+const iPadLandscape = puppeteer.devices["iPad landscape"];
+
+const { BASE } = process.env;
+
+describe("home page", () => {
+  beforeEach(async () => {
+    await page.goto(BASE, { waitUntil: "networkidle2" });
+  });
+
+  it("renders full page on desktop", async () => {
+    const image = await page.screenshot({ fullPage: true });
+
+    expect(image).toMatchImageSnapshot();
+  });
+
+  it("renders ipad viewport", async () => {
+    await page.emulate(iPadLandscape);
+    const image = await page.screenshot();
+
+    expect(image).toMatchImageSnapshot();
+  });
+
+  it("renders iphone viewport", async () => {
+    await page.emulate(iPhoneX);
+    const image = await page.screenshot();
+
+    expect(image).toMatchImageSnapshot();
+  });
+
+  describe("has menu visible", () => {
+    beforeAll(async () => {
+      await jestPuppeteer.resetBrowser();
+      // await page.setViewport({ width: 1920, height: 1200 });
+    });
+
+    beforeEach(async () => {
+      await page.goto(BASE, { waitUntil: "networkidle2" });
+    });
+
+    it("and shows one container with correct title", async () => {
+      const menuTitle = await page.$eval("aside ul.menu-list li a", (e) => e.title);
+
+      expect(menuTitle).toEqual("dozzle");
+    });
+
+    it("and menu is clickable", async () => {
+      await page.click("aside ul.menu-list li a");
+
+      const className = await page.$eval("aside ul.menu-list li a", (e) => e.className);
+
+      expect(className).toContain("router-link-exact-active");
+    });
+
+    it("and when clicked shows logs", async () => {
+      await page.click("aside ul.menu-list li a");
+
+      await page.waitForSelector("ul.events li span.text");
+      const text = await page.$eval("ul.events li:nth-child(2) span.text", (e) => e.textContent);
+
+      expect(text).toContain("Dozzle version dev");
+    });
+  });
+});

main.go

@@ -2,14 +2,10 @@ package main
 
 import (
 	"context"
-	"encoding/json"
-	"fmt"
-	"html/template"
 	"net/http"
 	"net/url"
 	"os"
 	"os/signal"
-	"runtime"
 	"strings"
 	"time"
 
@@ -29,8 +25,6 @@ var (
 	tailSize = 300
 	filters  map[string]string
 	version  = "dev"
-	commit   = "none"
-	date     = "unknown"
 )
 
 type handler struct {
@@ -132,156 +126,3 @@ func main() {
 	srv.Shutdown(ctx)
 	os.Exit(0)
 }
-
-func (h *handler) index(w http.ResponseWriter, req *http.Request) {
-	fileServer := http.FileServer(h.box)
-	if h.box.Has(req.URL.Path) && req.URL.Path != "" && req.URL.Path != "/" {
-		fileServer.ServeHTTP(w, req)
-	} else {
-		text, _ := h.box.FindString("index.html")
-		text = strings.Replace(text, "__BASE__", "{{ .Base }}", -1)
-		tmpl, err := template.New("index.html").Parse(text)
-		if err != nil {
-			panic(err)
-		}
-
-		path := ""
-		if base != "/" {
-			path = base
-		}
-
-		data := struct {
-			Base    string
-			Version string
-		}{path, version}
-		err = tmpl.Execute(w, data)
-		if err != nil {
-			http.Error(w, err.Error(), http.StatusInternalServerError)
-		}
-	}
-}
-
-func (h *handler) listContainers(w http.ResponseWriter, r *http.Request) {
-	containers, err := h.client.ListContainers(h.showAll)
-	if err != nil {
-		http.Error(w, err.Error(), http.StatusInternalServerError)
-		return
-	}
-	err = json.NewEncoder(w).Encode(containers)
-	if err != nil {
-		http.Error(w, err.Error(), http.StatusInternalServerError)
-		return
-	}
-}
-
-func (h *handler) fetchLogsBetweenDates(w http.ResponseWriter, r *http.Request) {
-	w.Header().Set("Content-Type", "text/plain; charset=UTF-8")
-
-	from, _ := time.Parse(time.RFC3339, r.URL.Query().Get("from"))
-	to, _ := time.Parse(time.RFC3339, r.URL.Query().Get("to"))
-	id := r.URL.Query().Get("id")
-
-	messages, _ := h.client.ContainerLogsBetweenDates(r.Context(), id, from, to)
-
-	for _, m := range messages {
-		fmt.Fprintln(w, m)
-	}
-}
-
-func (h *handler) streamLogs(w http.ResponseWriter, r *http.Request) {
-	id := r.URL.Query().Get("id")
-	if id == "" {
-		http.Error(w, "id is required", http.StatusBadRequest)
-		return
-	}
-
-	f, ok := w.(http.Flusher)
-	if !ok {
-		http.Error(w, "Streaming unsupported!", http.StatusInternalServerError)
-		return
-	}
-
-	container, e := h.client.FindContainer(id)
-	if e != nil {
-		http.Error(w, e.Error(), http.StatusInternalServerError)
-		return
-	}
-
-	messages, err := h.client.ContainerLogs(r.Context(), container.ID, tailSize)
-
-	w.Header().Set("Content-Type", "text/event-stream")
-	w.Header().Set("Cache-Control", "no-cache")
-	w.Header().Set("Connection", "keep-alive")
-	w.Header().Set("Transfer-Encoding", "chunked")
-
-	log.Debugf("Starting to stream logs for %s", id)
-Loop:
-	for {
-		select {
-		case message, ok := <-messages:
-			if !ok {
-				break Loop
-			}
-			_, e := fmt.Fprintf(w, "data: %s\n\n", message)
-			if e != nil {
-				log.Debugf("Error while writing to log stream: %v", e)
-				break Loop
-			}
-			f.Flush()
-		case e := <-err:
-			log.Debugf("Error while reading from log stream: %v", e)
-			break Loop
-		}
-	}
-
-	log.WithField("NumGoroutine", runtime.NumGoroutine()).Debug("runtime stats")
-}
-
-func (h *handler) streamEvents(w http.ResponseWriter, r *http.Request) {
-	f, ok := w.(http.Flusher)
-	if !ok {
-		http.Error(w, "Streaming unsupported!", http.StatusInternalServerError)
-		return
-	}
-
-	w.Header().Set("Content-Type", "text/event-stream")
-	w.Header().Set("Cache-Control", "no-cache")
-	w.Header().Set("Connection", "keep-alive")
-	w.Header().Set("Transfer-Encoding", "chunked")
-
-	ctx := r.Context()
-	messages, err := h.client.Events(ctx)
-
-Loop:
-	for {
-		select {
-		case message, ok := <-messages:
-			if !ok {
-				break Loop
-			}
-			switch message.Action {
-			case "connect", "disconnect", "create", "destroy", "start", "stop":
-				log.Debugf("Triggering docker event: %v", message.Action)
-				_, err := fmt.Fprintf(w, "event: containers-changed\ndata: %s\n\n", message.Action)
-
-				if err != nil {
-					log.Debugf("Error while writing to event stream: %v", err)
-					break
-				}
-				f.Flush()
-			default:
-				log.Debugf("Ignoring docker event: %v", message.Action)
-			}
-		case <-ctx.Done():
-			break Loop
-		case <-err:
-			break Loop
-		}
-	}
-}
-
-func (h *handler) version(w http.ResponseWriter, r *http.Request) {
-	fmt.Fprintln(w, version)
-	fmt.Fprintln(w, commit)
-	fmt.Fprintln(w, date)
-}

main_test.go

@@ -259,7 +259,7 @@ func Test_createRoutes_redirect(t *testing.T) {
 	mockedClient := new(MockedClient)
 	box := packr.NewBox("./virtual")
 
-	handler := createRoutes("/foobar", &handler{mockedClient, true,box})
+	handler := createRoutes("/foobar", &handler{mockedClient, true, box})
 	req, err := http.NewRequest("GET", "/foobar", nil)
 	require.NoError(t, err, "NewRequest should not return an error.")
 	rr := httptest.NewRecorder()

package.json

@@ -1,17 +1,18 @@
 {
  "name": "dozzle",
- "version": "1.20.16",
+ "version": "1.22.8",
  "description": "Realtime log viewer for docker containers. ",
  "scripts": {
   "prestart": "npm run clean",
-  "start": "DOCKER_API_VERSION=1.38 concurrently 'npm run watch-server' 'npm run watch-assets'",
+  "start": "concurrently 'npm run watch-server' 'npm run watch-assets'",
   "watch-assets": "npx parcel watch --no-source-maps --public-url '__BASE__' assets/index.html -d static",
   "watch-server": "reflex -c .reflex",
   "prebuild": "npm run clean",
   "build": "npx parcel build --no-source-maps --public-url '__BASE__' assets/index.html -d static",
   "clean": "rm -rf static/ a_main-packr.go",
-  "release": "goreleaser --rm-dist",
-  "test": "jest"
+  "release": "release-it",
+  "test": "jest",
+  "integration": "docker-compose -f integration/docker-compose.test.yml run --rm integration"
  },
  "repository": {
   "type": "git",
@@ -24,39 +25,40 @@
  },
  "homepage": "https://github.com/amir20/dozzle#readme",
  "dependencies": {
-  "ansi-to-html": "^0.6.13",
-  "buefy": "^0.8.9",
-  "bulma": "^0.8.0",
-  "date-fns": "^2.9.0",
-  "hotkeys-js": "^3.7.3",
+  "ansi-to-html": "^0.6.14",
+  "buefy": "^0.8.17",
+  "bulma": "^0.8.2",
+  "caniuse-lite": "^1.0.30001048",
+  "date-fns": "^2.12.0",
+  "hotkeys-js": "^3.7.6",
   "lodash.debounce": "^4.0.8",
-  "semver": "^7.1.1",
+  "semver": "^7.3.2",
   "splitpanes": "^2.2.1",
   "store": "^2.0.12",
   "vue": "^2.6.11",
-  "vue-meta": "^2.3.2",
-  "vue-router": "^3.1.3",
-  "vuex": "^3.1.2"
+  "vue-meta": "^2.3.3",
+  "vue-router": "^3.1.6",
+  "vuex": "^3.3.0"
  },
  "devDependencies": {
-  "@babel/core": "^7.8.0",
-  "@babel/plugin-transform-runtime": "^7.8.0",
-  "@vue/component-compiler-utils": "^3.1.1",
-  "@vue/test-utils": "^1.0.0-beta.29",
+  "@babel/core": "^7.9.6",
+  "@babel/plugin-transform-runtime": "^7.9.6",
+  "@vue/component-compiler-utils": "^3.1.2",
+  "@vue/test-utils": "^1.0.0-beta.33",
   "babel-core": "^7.0.0-bridge.0",
-  "babel-jest": "^24.9.0",
-  "concurrently": "^5.0.2",
-  "cz-conventional-changelog": "^3.0.2",
+  "babel-jest": "^25.5.1",
+  "concurrently": "^5.2.0",
   "eventsourcemock": "^2.0.0",
-  "husky": "^4.0.7",
-  "jest": "^24.9.0",
+  "husky": "^4.2.5",
+  "jest": "^25.5.2",
   "jest-serializer-vue": "^2.0.2",
-  "lint-staged": "^9.5.0",
+  "lint-staged": "^10.2.1",
   "mockdate": "^2.0.5",
   "node-fetch": "^2.6.0",
   "parcel-bundler": "^1.12.4",
-  "prettier": "^1.19.1",
-  "sass": "^1.24.4",
+  "prettier": "^2.0.5",
+  "release-it": "^13.5.7",
+  "sass": "^1.26.5",
   "vue-hot-reload-api": "^2.3.4",
   "vue-jest": "^3.0.5",
   "vue-template-compiler": "^2.6.11"
@@ -68,16 +70,14 @@
  },
  "lint-staged": {
   "*.{js,vue,css}": [
-   "prettier --write",
-   "git add"
+   "prettier --write"
   ]
  },
  "browserslist": [
-  ">5%",
-  "not ie <= 8"
+  ">5%"
  ],
  "alias": {
-  "vue": "./node_modules/vue/dist/vue.esm.js"
+  "vue": "./node_modules/vue/dist/vue.runtime.esm.js"
  },
  "jest": {
   "clearMocks": true,
@@ -90,7 +90,8 @@
    "node_modules"
   ],
   "testPathIgnorePatterns": [
-   "node_modules"
+   "node_modules",
+   "<rootDir>/integration/"
   ],
   "transformIgnorePatterns": [
    "node_modules"
@@ -106,9 +107,12 @@
    ".+\\.js$": "babel-jest"
   }
  },
- "config": {
-  "commitizen": {
-   "path": "./node_modules/cz-conventional-changelog"
+ "release-it": {
+  "github": {
+   "release": true
+  },
+  "npm": {
+   "publish": false
   }
  }
 }

routes.go

@@ -0,0 +1,167 @@
+package main
+
+import (
+	"encoding/json"
+	"fmt"
+	"html/template"
+	"net/http"
+	"runtime"
+	"strings"
+	"time"
+
+	log "github.com/sirupsen/logrus"
+)
+
+func (h *handler) index(w http.ResponseWriter, req *http.Request) {
+	fileServer := http.FileServer(h.box)
+	if h.box.Has(req.URL.Path) && req.URL.Path != "" && req.URL.Path != "/" {
+		fileServer.ServeHTTP(w, req)
+	} else {
+		text, err := h.box.FindString("index.html")
+		if err != nil {
+			panic(err)
+		}
+		text = strings.Replace(text, "__BASE__", "{{ .Base }}", -1)
+		tmpl, err := template.New("index.html").Parse(text)
+		if err != nil {
+			panic(err)
+		}
+
+		path := ""
+		if base != "/" {
+			path = base
+		}
+
+		data := struct {
+			Base    string
+			Version string
+		}{path, version}
+		err = tmpl.Execute(w, data)
+		if err != nil {
+			http.Error(w, err.Error(), http.StatusInternalServerError)
+		}
+	}
+}
+
+func (h *handler) listContainers(w http.ResponseWriter, r *http.Request) {
+	containers, err := h.client.ListContainers(h.showAll)
+	if err != nil {
+		http.Error(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+	err = json.NewEncoder(w).Encode(containers)
+	if err != nil {
+		http.Error(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+}
+
+func (h *handler) fetchLogsBetweenDates(w http.ResponseWriter, r *http.Request) {
+	w.Header().Set("Content-Type", "text/plain; charset=UTF-8")
+
+	from, _ := time.Parse(time.RFC3339, r.URL.Query().Get("from"))
+	to, _ := time.Parse(time.RFC3339, r.URL.Query().Get("to"))
+	id := r.URL.Query().Get("id")
+
+	messages, _ := h.client.ContainerLogsBetweenDates(r.Context(), id, from, to)
+
+	for _, m := range messages {
+		fmt.Fprintln(w, m)
+	}
+}
+
+func (h *handler) streamLogs(w http.ResponseWriter, r *http.Request) {
+	id := r.URL.Query().Get("id")
+	if id == "" {
+		http.Error(w, "id is required", http.StatusBadRequest)
+		return
+	}
+
+	f, ok := w.(http.Flusher)
+	if !ok {
+		http.Error(w, "Streaming unsupported!", http.StatusInternalServerError)
+		return
+	}
+
+	container, e := h.client.FindContainer(id)
+	if e != nil {
+		http.Error(w, e.Error(), http.StatusInternalServerError)
+		return
+	}
+
+	messages, err := h.client.ContainerLogs(r.Context(), container.ID, tailSize)
+
+	w.Header().Set("Content-Type", "text/event-stream")
+	w.Header().Set("Cache-Control", "no-cache")
+	w.Header().Set("Connection", "keep-alive")
+	w.Header().Set("Transfer-Encoding", "chunked")
+
+	log.Debugf("Starting to stream logs for %s", id)
+Loop:
+	for {
+		select {
+		case message, ok := <-messages:
+			if !ok {
+				break Loop
+			}
+			_, e := fmt.Fprintf(w, "data: %s\n\n", message)
+			if e != nil {
+				log.Debugf("Error while writing to log stream: %v", e)
+				break Loop
+			}
+			f.Flush()
+		case e := <-err:
+			log.Debugf("Error while reading from log stream: %v", e)
+			break Loop
+		}
+	}
+
+	log.WithField("NumGoroutine", runtime.NumGoroutine()).Debug("runtime stats")
+}
+
+func (h *handler) streamEvents(w http.ResponseWriter, r *http.Request) {
+	f, ok := w.(http.Flusher)
+	if !ok {
+		http.Error(w, "Streaming unsupported!", http.StatusInternalServerError)
+		return
+	}
+
+	w.Header().Set("Content-Type", "text/event-stream")
+	w.Header().Set("Cache-Control", "no-cache")
+	w.Header().Set("Connection", "keep-alive")
+	w.Header().Set("Transfer-Encoding", "chunked")
+
+	ctx := r.Context()
+	messages, err := h.client.Events(ctx)
+
+Loop:
+	for {
+		select {
+		case message, ok := <-messages:
+			if !ok {
+				break Loop
+			}
+			switch message.Action {
+			case "connect", "disconnect", "create", "destroy", "start", "stop":
+				log.Debugf("Triggering docker event: %v", message.Action)
+				_, err := fmt.Fprintf(w, "event: containers-changed\ndata: %s\n\n", message.Action)
+
+				if err != nil {
+					log.Debugf("Error while writing to event stream: %v", err)
+					break
+				}
+				f.Flush()
+			default:
+				log.Debugf("Ignoring docker event: %v", message.Action)
+			}
+		case <-ctx.Done():
+			break Loop
+		case <-err:
+			break Loop
+		}
+	}
+}
+
+func (h *handler) version(w http.ResponseWriter, r *http.Request) {
+	fmt.Fprintln(w, version)
+}