identities

.browserslistrc

@@ -0,0 +1,2 @@
+> 1%
+last 2 versions

.editorconfig

@@ -0,0 +1,7 @@
+[*.{js,jsx,ts,tsx,vue}]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+max_line_length = 100

.eslintrc.js

@@ -0,0 +1,17 @@
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+  },
+  extends: [
+    'plugin:vue/essential',
+    '@vue/airbnb',
+  ],
+  rules: {
+    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+  },
+  parserOptions: {
+    parser: 'babel-eslint',
+  },
+};

.gitignore

@@ -1,104 +1,21 @@
-# Logs
-logs
-*.log
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-lerna-debug.log*
 
-# Diagnostic reports (https://nodejs.org/api/report.html)
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
-
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-*.lcov
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules/
-jspm_packages/
-
-# TypeScript v1 declaration files
-typings/
-
-# TypeScript cache
-*.tsbuildinfo
-
-# Optional npm cache directory
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Microbundle cache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variables file
-.env
-.env.test
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-
-# Next.js build output
-.next
-
-# Nuxt.js build / generate output
-.nuxt
-dist
-
-# Gatsby files
-.cache/
-# Comment in the public line in if your project uses Gatsby and *not* Next.js
-# https://nextjs.org/blog/next-9-1#public-directory-support
-# public
-
-# vuepress build output
-.vuepress/dist
-
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# TernJS port file
-.tern-port
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

README.md

@@ -0,0 +1,24 @@
+# dash-platform-console
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Lints and fixes files
+```
+npm run lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

babel.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset',
+  ],
+};

package.json

@@ -0,0 +1,47 @@
+{
+  "name": "dash-platform-console",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "lint": "vue-cli-service lint"
+  },
+  "dependencies": {
+    "@dashevo/dapi-client": "github:dashevo/dapi-client#v0.8-dev",
+    "@dashevo/dpp": "github:dashevo/js-dpp#v0.10-dev",
+    "core-js": "^3.4.3",
+    "vue": "^2.6.10",
+    "vue-router": "^3.1.3",
+    "vuelidate": "^0.7.4",
+    "vuetify": "^2.1.0",
+    "vuex": "^3.1.2",
+    "vuex-persistedstate": "^2.7.0"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "^4.1.0",
+    "@vue/cli-plugin-eslint": "^4.1.0",
+    "@vue/cli-plugin-router": "^4.1.0",
+    "@vue/cli-plugin-vuex": "^4.1.0",
+    "@vue/cli-service": "^4.1.0",
+    "@vue/eslint-config-airbnb": "^4.0.0",
+    "babel-eslint": "^10.0.3",
+    "eslint": "^5.16.0",
+    "eslint-plugin-vue": "^5.0.0",
+    "lint-staged": "^9.4.3",
+    "sass": "^1.19.0",
+    "sass-loader": "^8.0.0",
+    "vue-cli-plugin-vuetify": "^2.0.2",
+    "vue-template-compiler": "^2.6.10",
+    "vuetify-loader": "^1.3.0"
+  },
+  "gitHooks": {
+    "pre-commit": "lint-staged"
+  },
+  "lint-staged": {
+    "*.{js,vue}": [
+      "vue-cli-service lint",
+      "git add"
+    ]
+  }
+}

public/index.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title>Dash platform console</title>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but dash-platform-console doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

src/App.vue

@@ -0,0 +1,28 @@
+<template>
+  <v-app>
+    <v-app-bar app>
+      <v-toolbar-title>dashevo exprlorer</v-toolbar-title>
+
+      <v-spacer />
+
+      <v-btn text :to="{ name: 'identities' }">Identities</v-btn>
+      <v-btn class="ml-1" text :to="{ name: 'names' }">Names</v-btn>
+      <v-btn class="ml-1" text :to="{ name: 'contracts' }">Contracts</v-btn>
+      <v-btn class="ml-1" text :to="{ name: 'documents' }">Documents</v-btn>
+
+    </v-app-bar>
+
+    <v-content>
+      <router-view />
+    </v-content>
+  </v-app>
+</template>
+
+<script>
+export default {
+  created() {
+    this.$vuetify.theme.dark = window.matchMedia
+      && window.matchMedia('(prefers-color-scheme: dark)').matches;
+  },
+};
+</script>

src/assets/logo.svg

@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 87.5 100"><defs><style>.cls-1{fill:#1697f6;}.cls-2{fill:#7bc6ff;}.cls-3{fill:#1867c0;}.cls-4{fill:#aeddff;}</style></defs><title>Artboard 46</title><polyline class="cls-1" points="43.75 0 23.31 0 43.75 48.32"/><polygon class="cls-2" points="43.75 62.5 43.75 100 0 14.58 22.92 14.58 43.75 62.5"/><polyline class="cls-3" points="43.75 0 64.19 0 43.75 48.32"/><polygon class="cls-4" points="64.58 14.58 87.5 14.58 43.75 100 43.75 62.5 64.58 14.58"/></svg>

src/main.js

@@ -0,0 +1,14 @@
+import Vue from 'vue';
+import App from './App.vue';
+import router from './router';
+import store from './store';
+import vuetify from './plugins/vuetify';
+
+Vue.config.productionTip = false;
+
+new Vue({
+  router,
+  store,
+  vuetify,
+  render: h => h(App),
+}).$mount('#app');

src/plugins/vuetify.js

@@ -0,0 +1,7 @@
+import Vue from 'vue';
+import Vuetify from 'vuetify/lib';
+
+Vue.use(Vuetify);
+
+export default new Vuetify({
+});

src/router/index.js

@@ -0,0 +1,39 @@
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+
+Vue.use(VueRouter);
+
+const routes = [
+  {
+    path: '/identities',
+    name: 'identities',
+    component: () => import(/* webpackChunkName: "identities" */ '../views/Identities.vue'),
+  },
+  {
+    path: '/contracts',
+    name: 'contracts',
+    component: () => import(/* webpackChunkName: "contracts" */ '../views/Contracts.vue'),
+  },
+  {
+    path: '/documents',
+    name: 'documents',
+    component: () => import(/* webpackChunkName: "documents" */ '../views/Documents.vue'),
+  },
+  {
+    path: '/names',
+    name: 'names',
+    component: () => import(/* webpackChunkName: "names" */ '../views/Names.vue'),
+  },
+  {
+    path: '*',
+    redirect: 'identities',
+  },
+];
+
+const router = new VueRouter({
+  mode: 'history',
+  base: process.env.BASE_URL,
+  routes,
+});
+
+export default router;

src/store/index.js

@@ -0,0 +1,28 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import createPersistedState from 'vuex-persistedstate';
+
+Vue.use(Vuex);
+
+export default new Vuex.Store({
+  state: {
+    identities: [],
+    names: [],
+    contracts: [],
+    documents: [],
+  },
+  mutations: {
+    addIdentity(state, identity) {
+      state.identities.push(identity);
+    },
+  },
+  actions: {
+    async createIdentity({ commit }, type) {
+      const identity = await new Promise((resolve) => {
+        setTimeout(() => resolve({ id: `t_id_${Date.now()}`, type }), 2000);
+      });
+      commit('addIdentity', identity);
+    },
+  },
+  plugins: [createPersistedState()],
+});

src/views/Contracts.vue

@@ -0,0 +1,8 @@
+<template>
+  <div></div>
+</template>
+
+<script>
+export default {
+};
+</script>

src/views/Documents.vue

@@ -0,0 +1,9 @@
+<template>
+  <div></div>
+</template>
+
+<script>
+export default {
+
+};
+</script>

src/views/Identities.vue

@@ -0,0 +1,92 @@
+<template>
+  <v-container>
+    <v-row>
+      <v-col>
+        <v-card tile flat>
+          <v-card-title>
+            Create identity
+          </v-card-title>
+          <v-card-text>
+            <v-container>
+              <v-row>
+              <v-col>
+                <v-btn
+                  color="teal"
+                  :loading="createAppIdentityLoading"
+                  @click="() => createIdentity(1)"
+                >
+                  application
+                </v-btn>
+              <v-col>
+              </v-col>
+                <v-btn
+                  color="cyan"
+                  :loading="createUserIdentityLoading"
+                  @click="() => createIdentity(2)"
+                >
+                  user
+                </v-btn>
+              </v-col>
+            </v-row>
+            </v-container>
+
+          </v-card-text>
+        </v-card>
+      </v-col>
+    </v-row>
+
+    <v-row>
+      <v-col>
+         <v-simple-table>
+          <thead>
+            <tr>
+              <th class="text-left">Id</th>
+              <th class="text-left">Type</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="identity in identities" :key="identity.id">
+              <td>{{ identity.id }}</td>
+              <td>{{ identity.type === 1 ? 'application' : 'user' }}</td>
+            </tr>
+          </tbody>
+      </v-simple-table>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+
+export default {
+  data() {
+    return {
+      createAppIdentityLoading: false,
+      createUserIdentityLoading: false,
+    };
+  },
+  computed: {
+    ...mapState(['identities']),
+  },
+  methods: {
+    createIdentity(type) {
+      if (type === 1) {
+        this.createAppIdentityLoading = true;
+      }
+      if (type === 2) {
+        this.createUserIdentityLoading = true;
+      }
+      this.$store.dispatch('createIdentity', type).finally(() => {
+        if (type === 1) {
+          this.createAppIdentityLoading = false;
+        }
+        if (type === 2) {
+          this.createUserIdentityLoading = false;
+        }
+      });
+    },
+  },
+
+};
+</script>

src/views/Names.vue

@@ -0,0 +1,9 @@
+<template>
+  <div></div>
+</template>
+
+<script>
+export default {
+
+};
+</script>

vue.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  lintOnSave: false,
+  transpileDependencies: [
+    'vuetify',
+  ],
+};