From 020b3c143b7706d398fedd92755a7754cdf114fa Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Fri, 3 Jul 2020 15:16:53 -0400 Subject: [PATCH 01/21] Add files --- src/app/ui/.storybook/main.js | 19 ++++++++++++++++++ src/app/ui/package.json | 4 ++-- src/app/ui/src/index.js | 2 +- src/app/ui/src/page/component/menu.js | 1 + src/app/ui/src/page/component/menu.stories.js | 20 +++++++++++++++++++ ...pack.config.babel.js => webpack.config.js} | 14 ++++++------- 6 files changed, 49 insertions(+), 11 deletions(-) create mode 100644 src/app/ui/src/page/component/menu.stories.js rename src/app/ui/{webpack.config.babel.js => webpack.config.js} (82%) diff --git a/src/app/ui/.storybook/main.js b/src/app/ui/.storybook/main.js index 46f886e6..c9441214 100644 --- a/src/app/ui/.storybook/main.js +++ b/src/app/ui/.storybook/main.js @@ -1,3 +1,6 @@ +const path = require('path'); +const rootWebpack = require('../webpack.config.js'); + module.exports = { stories: ['../src/**/*.stories.js'], addons: [ @@ -6,4 +9,20 @@ module.exports = { '@storybook/addon-knobs/register', '@storybook/addon-a11y/register', ], + webpackFinal: (config) => { + return { + ...config, + plugins: [ + ...config.plugins, + ...rootWebpack.plugins, + ], + module: { + ...config.module, + rules: [ + ...config.module.rules, + ...rootWebpack.module.rules, + ] + } + }; + }, }; \ No newline at end of file diff --git a/src/app/ui/package.json b/src/app/ui/package.json index 1dbaebed..c2579b74 100644 --- a/src/app/ui/package.json +++ b/src/app/ui/package.json @@ -10,7 +10,7 @@ "test": "cypress run", "test-debug": "DEBUG=cypress:* cypress run", "cypress": "cypress open", - "storybook": "start-storybook" + "storybook": "start-storybook -p 9090" }, "repository": { "type": "git", @@ -55,4 +55,4 @@ "webpack": "^4.42.1", "webpack-cli": "^3.3.11" } -} +} \ No newline at end of file diff --git a/src/app/ui/src/index.js b/src/app/ui/src/index.js index 0e8c77a6..f26d1424 100644 --- a/src/app/ui/src/index.js +++ b/src/app/ui/src/index.js @@ -8,7 +8,7 @@ import ErrorPage from "./page/error"; import LayoutMain from "./page/layout/main"; import Auth from "./module/auth"; import "../node_modules/@fortawesome/fontawesome-free/js/all.js"; -import "../style/main.scss"; +//import "../style/main.scss"; m.route.prefix = ""; diff --git a/src/app/ui/src/page/component/menu.js b/src/app/ui/src/page/component/menu.js index e0845409..51385866 100644 --- a/src/app/ui/src/page/component/menu.js +++ b/src/app/ui/src/page/component/menu.js @@ -1,5 +1,6 @@ import m from "mithril"; import Auth from "../../module/auth"; +import "../../../style/main.scss"; function logout() { Auth.clear(); diff --git a/src/app/ui/src/page/component/menu.stories.js b/src/app/ui/src/page/component/menu.stories.js new file mode 100644 index 00000000..f48cb3f7 --- /dev/null +++ b/src/app/ui/src/page/component/menu.stories.js @@ -0,0 +1,20 @@ +// eslint-disable-next-line no-unused-vars +import m from "mithril"; +//import { action } from "@storybook/addon-actions"; +import { withKnobs } from "@storybook/addon-knobs"; +import { withA11y } from "@storybook/addon-a11y"; +import Menu from "./menu"; +import "../../../style/main.scss"; + +export default { + title: "Structure/Menu", + component: Menu, + decorators: [withKnobs, withA11y], +}; + +export const menu = () => ({ + view: () => , +}); +menu.story = { + name: "Menu", +}; diff --git a/src/app/ui/webpack.config.babel.js b/src/app/ui/webpack.config.js similarity index 82% rename from src/app/ui/webpack.config.babel.js rename to src/app/ui/webpack.config.js index 214bc85f..95d5aa44 100644 --- a/src/app/ui/webpack.config.babel.js +++ b/src/app/ui/webpack.config.js @@ -1,13 +1,13 @@ -import { resolve } from "path"; -import { CleanWebpackPlugin } from "clean-webpack-plugin"; -import HtmlWebpackPlugin from "html-webpack-plugin"; -import MiniCssExtractPlugin from "mini-css-extract-plugin"; -import CopyWebpackPlugin from "copy-webpack-plugin"; +const { resolve } = require("path"); +const { CleanWebpackPlugin } = require("clean-webpack-plugin"); +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const CopyWebpackPlugin = require("copy-webpack-plugin"); // Try the environment variable, otherwise use root. const ASSET_PATH = process.env.ASSET_PATH || "/"; -var Webpack = { +module.exports = { entry: "./src/index.js", plugins: [ new CleanWebpackPlugin(), @@ -70,5 +70,3 @@ var Webpack = { ], }, }; - -export default Webpack; From b0b09c2ca0ecda8b83b3d1a409ae03f5e99d8f24 Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Fri, 3 Jul 2020 16:47:15 -0400 Subject: [PATCH 02/21] Add jsonconfig and add aliases --- Makefile | 2 +- src/app/api/cmd/api/main.go | 5 +++-- src/app/ui/.storybook/main.js | 6 +++++ src/app/ui/jsconfig.json | 22 +++++++++++++++++++ src/app/ui/package.json | 2 +- src/app/ui/src/index.js | 20 ++++++++--------- src/app/ui/src/page/component/menu.js | 3 +-- src/app/ui/src/page/component/menu.stories.js | 2 +- src/app/ui/src/page/layout/main.js | 2 +- src/app/ui/src/page/login.js | 8 +++---- src/app/ui/src/page/notepad.js | 4 ++-- src/app/ui/src/page/register.js | 6 ++--- src/app/ui/src/store/note.js | 2 +- src/app/ui/webpack.config.js | 6 +++++ 14 files changed, 62 insertions(+), 28 deletions(-) create mode 100644 src/app/ui/jsconfig.json diff --git a/Makefile b/Makefile index 48bdc7aa..a7cad913 100644 --- a/Makefile +++ b/Makefile @@ -56,7 +56,7 @@ endif .PHONY: npm npm: # Run the NPM commands from the UI folder. - cd ${GOPATH}/src/app/ui && npm run $(ARGS) + cd ${GOPATH}/src/app/ui && npm $(ARGS) .PHONY: api-dep api-dep: diff --git a/src/app/api/cmd/api/main.go b/src/app/api/cmd/api/main.go index 5962ebd4..7a92206b 100644 --- a/src/app/api/cmd/api/main.go +++ b/src/app/api/cmd/api/main.go @@ -23,8 +23,9 @@ func main() { config.LoadRoutes(core) // Start the web server. - l.Printf("Server started.") - err := http.ListenAndServe(fmt.Sprintf(":%v", settings.Port), config.Middleware(core)) + socket := fmt.Sprintf(":%v", settings.Port) + l.Printf("Server started on %v", socket) + err := http.ListenAndServe(socket, config.Middleware(core)) if err != nil { l.Printf(err.Error()) } diff --git a/src/app/ui/.storybook/main.js b/src/app/ui/.storybook/main.js index c9441214..d852fdd0 100644 --- a/src/app/ui/.storybook/main.js +++ b/src/app/ui/.storybook/main.js @@ -16,6 +16,12 @@ module.exports = { ...config.plugins, ...rootWebpack.plugins, ], + resolve: { + alias: { + ...config.resolve.alias, + ...rootWebpack.resolve.alias, + }, + }, module: { ...config.module, rules: [ diff --git a/src/app/ui/jsconfig.json b/src/app/ui/jsconfig.json new file mode 100644 index 00000000..61babcec --- /dev/null +++ b/src/app/ui/jsconfig.json @@ -0,0 +1,22 @@ +{ + "compilerOptions": { + "target": "es5", + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "baseUrl": "./", + "checkJs": false, + "paths": { + "~/*": [ + "*" + ], + "@/*": [ + "src/*" + ], + }, + }, + "include": [ + "src/**/*", + ".storybook/**/*", + "test/**/*", + ] +} \ No newline at end of file diff --git a/src/app/ui/package.json b/src/app/ui/package.json index c2579b74..f2c6b435 100644 --- a/src/app/ui/package.json +++ b/src/app/ui/package.json @@ -55,4 +55,4 @@ "webpack": "^4.42.1", "webpack-cli": "^3.3.11" } -} \ No newline at end of file +} diff --git a/src/app/ui/src/index.js b/src/app/ui/src/index.js index f26d1424..e33d8703 100644 --- a/src/app/ui/src/index.js +++ b/src/app/ui/src/index.js @@ -1,14 +1,14 @@ import m from "mithril"; -import AboutPage from "./page/about"; -import LoginPage from "./page/login"; -import RegisterPage from "./page/register"; -import HomePage from "./page/home"; -import NotepadPage from "./page/notepad"; -import ErrorPage from "./page/error"; -import LayoutMain from "./page/layout/main"; -import Auth from "./module/auth"; -import "../node_modules/@fortawesome/fontawesome-free/js/all.js"; -//import "../style/main.scss"; +import AboutPage from "@/page/about"; +import LoginPage from "@/page/login"; +import RegisterPage from "@/page/register"; +import HomePage from "@/page/home"; +import NotepadPage from "@/page/notepad"; +import ErrorPage from "@/page/error"; +import LayoutMain from "@/page/layout/main"; +import Auth from "@/module/auth"; +import "~/node_modules/@fortawesome/fontawesome-free/js/all.js"; +import "~/style/main.scss"; m.route.prefix = ""; diff --git a/src/app/ui/src/page/component/menu.js b/src/app/ui/src/page/component/menu.js index 51385866..0ffad14d 100644 --- a/src/app/ui/src/page/component/menu.js +++ b/src/app/ui/src/page/component/menu.js @@ -1,6 +1,5 @@ import m from "mithril"; -import Auth from "../../module/auth"; -import "../../../style/main.scss"; +import Auth from "@/module/auth"; function logout() { Auth.clear(); diff --git a/src/app/ui/src/page/component/menu.stories.js b/src/app/ui/src/page/component/menu.stories.js index f48cb3f7..31a13cee 100644 --- a/src/app/ui/src/page/component/menu.stories.js +++ b/src/app/ui/src/page/component/menu.stories.js @@ -4,7 +4,7 @@ import m from "mithril"; import { withKnobs } from "@storybook/addon-knobs"; import { withA11y } from "@storybook/addon-a11y"; import Menu from "./menu"; -import "../../../style/main.scss"; +import "~/style/main.scss"; export default { title: "Structure/Menu", diff --git a/src/app/ui/src/page/layout/main.js b/src/app/ui/src/page/layout/main.js index c73fe492..c54d0018 100644 --- a/src/app/ui/src/page/layout/main.js +++ b/src/app/ui/src/page/layout/main.js @@ -1,5 +1,5 @@ import m from "mithril"; -import Menu from "../component/menu"; +import Menu from "@/page/component/menu"; var View = { view: function (vnode) { diff --git a/src/app/ui/src/page/login.js b/src/app/ui/src/page/login.js index 5f2bd7a6..68bb6113 100644 --- a/src/app/ui/src/page/login.js +++ b/src/app/ui/src/page/login.js @@ -1,8 +1,8 @@ import m from "mithril"; -import Submit from "../module/submit"; -import User from "../store/user"; -import Flash from "./component/flash"; -import Auth from "../module/auth"; +import Submit from "@/module/submit"; +import User from "@/store/user"; +import Flash from "@/page/component/flash"; +import Auth from "@/module/auth"; var data = { title: "Login", diff --git a/src/app/ui/src/page/notepad.js b/src/app/ui/src/page/notepad.js index 41b2f79b..b488bba1 100644 --- a/src/app/ui/src/page/notepad.js +++ b/src/app/ui/src/page/notepad.js @@ -1,6 +1,6 @@ import m from "mithril"; -import Note from "../store/note"; -import Flash from "./component/flash"; +import Note from "@/store/note"; +import Flash from "@/page/component/flash"; function onSubmit() { Note.create() diff --git a/src/app/ui/src/page/register.js b/src/app/ui/src/page/register.js index 28035918..712df85a 100644 --- a/src/app/ui/src/page/register.js +++ b/src/app/ui/src/page/register.js @@ -1,7 +1,7 @@ import m from "mithril"; -import Submit from "../module/submit"; -import User from "../store/user"; -import Flash from "./component/flash"; +import Submit from "@/module/submit"; +import User from "@/store/user"; +import Flash from "@/page/component/flash"; var data = { title: "Register", diff --git a/src/app/ui/src/store/note.js b/src/app/ui/src/store/note.js index ca933b23..d943a1f5 100644 --- a/src/app/ui/src/store/note.js +++ b/src/app/ui/src/store/note.js @@ -1,5 +1,5 @@ import m from "mithril"; -import Auth from "../module/auth"; +import Auth from "@/module/auth"; var Note = { current: {}, diff --git a/src/app/ui/webpack.config.js b/src/app/ui/webpack.config.js index 95d5aa44..e4266e77 100644 --- a/src/app/ui/webpack.config.js +++ b/src/app/ui/webpack.config.js @@ -26,6 +26,12 @@ module.exports = { { copyUnmodified: true } ), ], + resolve: { + alias: { + "~": resolve(__dirname), + "@": resolve(__dirname, "./src"), + }, + }, output: { path: resolve(__dirname, "./dist"), filename: "static/[name].[contenthash].js", From 005393104bc158fd00202266a9d08bb1fa812c25 Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Fri, 3 Jul 2020 17:16:52 -0400 Subject: [PATCH 03/21] Move test block --- src/app/ui/src/index.stories.js | 6 +++--- src/app/ui/src/{module => page/component}/block.js | 0 2 files changed, 3 insertions(+), 3 deletions(-) rename src/app/ui/src/{module => page/component}/block.js (100%) diff --git a/src/app/ui/src/index.stories.js b/src/app/ui/src/index.stories.js index e5e5ff09..96815cbf 100644 --- a/src/app/ui/src/index.stories.js +++ b/src/app/ui/src/index.stories.js @@ -3,7 +3,7 @@ import m from "mithril"; import { action } from "@storybook/addon-actions"; import { withKnobs, text, boolean, number } from "@storybook/addon-knobs"; import { withA11y } from "@storybook/addon-a11y"; -import Block from "./module/block"; +import Block from "@/page/component/block"; export default { title: "Structure/Block", @@ -37,7 +37,7 @@ export const DynamicText = () => ({ export const long = () => { return { - view: () => Long, + view: () => {text("Text", "Long")}, }; }; long.story = { @@ -45,7 +45,7 @@ long.story = { }; export const short = () => ({ - view: () => Short, + view: () => {text("Text", "Short")}, }); export const emoji = () => ({ diff --git a/src/app/ui/src/module/block.js b/src/app/ui/src/page/component/block.js similarity index 100% rename from src/app/ui/src/module/block.js rename to src/app/ui/src/page/component/block.js From 64b1f3cf11fd710207599ce883183ae69b17e71c Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Fri, 3 Jul 2020 18:03:59 -0400 Subject: [PATCH 04/21] Split logic for login and register --- src/app/ui/src/index.js | 14 +++--- .../ui/src/module/{auth.js => cookiestore.js} | 12 ++--- src/app/ui/src/page/component/menu.js | 8 ++-- src/app/ui/src/store/note.js | 10 ++-- src/app/ui/src/store/user.js | 24 ---------- src/app/ui/src/store/userlogin.js | 46 +++++++++++++++++++ src/app/ui/src/store/userregister.js | 40 ++++++++++++++++ src/app/ui/src/{page => view}/login.js | 43 ++++------------- src/app/ui/src/{page => view}/register.js | 44 ++++++------------ 9 files changed, 129 insertions(+), 112 deletions(-) rename src/app/ui/src/module/{auth.js => cookiestore.js} (64%) delete mode 100644 src/app/ui/src/store/user.js create mode 100644 src/app/ui/src/store/userlogin.js create mode 100644 src/app/ui/src/store/userregister.js rename src/app/ui/src/{page => view}/login.js (73%) rename src/app/ui/src/{page => view}/register.js (76%) diff --git a/src/app/ui/src/index.js b/src/app/ui/src/index.js index e33d8703..d7db72c0 100644 --- a/src/app/ui/src/index.js +++ b/src/app/ui/src/index.js @@ -1,12 +1,12 @@ import m from "mithril"; import AboutPage from "@/page/about"; -import LoginPage from "@/page/login"; -import RegisterPage from "@/page/register"; +import LoginPage from "@/view/login"; +import RegisterPage from "@/view/register"; import HomePage from "@/page/home"; import NotepadPage from "@/page/notepad"; import ErrorPage from "@/page/error"; import LayoutMain from "@/page/layout/main"; -import Auth from "@/module/auth"; +import CookieStore from "@/module/cookiestore"; import "~/node_modules/@fortawesome/fontawesome-free/js/all.js"; import "~/style/main.scss"; @@ -15,25 +15,25 @@ m.route.prefix = ""; m.route(document.body, "/", { "/": { onmatch: function () { - if (Auth.isLoggedIn()) return Index; + if (CookieStore.isLoggedIn()) return Index; else m.route.set("/login"); }, }, "/notepad": { onmatch: function () { - if (Auth.isLoggedIn()) return Notepad; + if (CookieStore.isLoggedIn()) return Notepad; else m.route.set("/login"); }, }, "/login": { onmatch: function () { - if (Auth.isLoggedIn()) m.route.set("/"); + if (CookieStore.isLoggedIn()) m.route.set("/"); else return Login; }, }, "/register": { onmatch: function () { - if (Auth.isLoggedIn()) m.route.set("/"); + if (CookieStore.isLoggedIn()) m.route.set("/"); else return Register; }, }, diff --git a/src/app/ui/src/module/auth.js b/src/app/ui/src/module/cookiestore.js similarity index 64% rename from src/app/ui/src/module/auth.js rename to src/app/ui/src/module/cookiestore.js index 9622da59..d3abaa97 100644 --- a/src/app/ui/src/module/auth.js +++ b/src/app/ui/src/module/cookiestore.js @@ -1,15 +1,15 @@ import Cookie from "js-cookie"; -var Auth = { +var CookieStore = { cookieName: "auth", save: (auth) => { - Cookie.set(Auth.cookieName, auth); + Cookie.set(CookieStore.cookieName, auth); }, clear: () => { - Cookie.remove(Auth.cookieName); + Cookie.remove(CookieStore.cookieName); }, bearerToken: () => { - let auth = Cookie.get(Auth.cookieName); + let auth = Cookie.get(CookieStore.cookieName); if (auth === undefined) { return false; } @@ -19,7 +19,7 @@ var Auth = { }, isLoggedIn: () => { try { - let auth = Cookie.get(Auth.cookieName); + let auth = Cookie.get(CookieStore.cookieName); if (auth === undefined) { return false; } @@ -32,4 +32,4 @@ var Auth = { }, }; -export default Auth; +export default CookieStore; diff --git a/src/app/ui/src/page/component/menu.js b/src/app/ui/src/page/component/menu.js index 0ffad14d..c0388ff6 100644 --- a/src/app/ui/src/page/component/menu.js +++ b/src/app/ui/src/page/component/menu.js @@ -1,8 +1,8 @@ import m from "mithril"; -import Auth from "@/module/auth"; +import CookieStore from "~/src/module/cookiestore"; function logout() { - Auth.clear(); + CookieStore.clear(); m.route.set("/"); } @@ -45,7 +45,7 @@ var View = { Menu
-
+
@@ -59,9 +32,9 @@ var Page = { data-cy="email" required oninput={(e) => { - User.current.email = e.target.value; + UserLogin.user.email = e.target.value; }} - value={User.current.email} + value={UserLogin.user.email} >
@@ -77,9 +50,9 @@ var Page = { data-cy="password" required oninput={(e) => { - User.current.password = e.target.value; + UserLogin.user.password = e.target.value; }} - value={User.current.password} + value={UserLogin.user.password} >
@@ -101,7 +74,7 @@ var Page = { type="button" class="button is-light" onclick={() => { - User.clear(); + UserLogin.clear(); }} > Clear diff --git a/src/app/ui/src/page/register.js b/src/app/ui/src/view/register.js similarity index 76% rename from src/app/ui/src/page/register.js rename to src/app/ui/src/view/register.js index 712df85a..f170454f 100644 --- a/src/app/ui/src/page/register.js +++ b/src/app/ui/src/view/register.js @@ -1,33 +1,15 @@ +// eslint-disable-next-line no-unused-vars import m from "mithril"; -import Submit from "@/module/submit"; -import User from "@/store/user"; -import Flash from "@/page/component/flash"; +import UserRegister from "@/store/userregister"; var data = { title: "Register", subtitle: "Enter your information below.", }; -function onsubmit(e) { - Submit.start(e); - - User.register() - .then(() => { - User.clear(); - Submit.finish(); - - Flash.success("User registered."); - m.route.set("/login"); - }) - .catch((err) => { - Submit.finish(); - Flash.warning(err.response.message); - }); -} - var Page = { onremove: () => { - User.clear(); + UserRegister.clear(); }, view: () => (
@@ -39,7 +21,7 @@ var Page = {
- +
@@ -51,9 +33,9 @@ var Page = { data-cy="first_name" required oninput={(e) => { - User.current.first_name = e.target.value; + UserRegister.user.first_name = e.target.value; }} - value={User.current.first_name} + value={UserRegister.user.first_name} >
@@ -69,9 +51,9 @@ var Page = { data-cy="last_name" required oninput={(e) => { - User.current.last_name = e.target.value; + UserRegister.user.last_name = e.target.value; }} - value={User.current.last_name} + value={UserRegister.user.last_name} >
@@ -87,9 +69,9 @@ var Page = { data-cy="email" required oninput={(e) => { - User.current.email = e.target.value; + UserRegister.user.email = e.target.value; }} - value={User.current.email} + value={UserRegister.user.email} > @@ -105,9 +87,9 @@ var Page = { data-cy="password" required oninput={(e) => { - User.current.password = e.target.value; + UserRegister.user.password = e.target.value; }} - value={User.current.password} + value={UserRegister.user.password} > @@ -129,7 +111,7 @@ var Page = { type="button" class="button is-light" onclick={() => { - User.clear(); + UserRegister.clear(); }} > Clear From 8699f72b7434fb04c25074a0e7e0f7a8adc221ab Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Fri, 3 Jul 2020 18:23:12 -0400 Subject: [PATCH 05/21] Finish moved all pages to view folder --- src/app/ui/jsconfig.json | 6 +- src/app/ui/src/{page => }/component/block.js | 0 src/app/ui/src/{page => }/component/flash.js | 0 src/app/ui/src/{page => }/component/menu.js | 2 +- .../src/{page => }/component/menu.stories.js | 0 src/app/ui/src/index.js | 10 +-- src/app/ui/src/index.stories.js | 2 +- src/app/ui/src/{page => }/layout/main.js | 2 +- src/app/ui/src/store/note.js | 54 ----------- src/app/ui/src/store/notestore.js | 89 +++++++++++++++++++ src/app/ui/src/store/userlogin.js | 6 +- src/app/ui/src/store/userregister.js | 4 +- src/app/ui/src/{page => view}/about.js | 0 src/app/ui/src/{page => view}/error.js | 2 +- src/app/ui/src/{page => view}/home.js | 0 src/app/ui/src/view/login.js | 4 +- src/app/ui/src/{page => view}/notepad.js | 58 +++--------- src/app/ui/src/view/register.js | 2 +- src/app/ui/webpack.config.js | 2 +- 19 files changed, 124 insertions(+), 119 deletions(-) rename src/app/ui/src/{page => }/component/block.js (100%) rename src/app/ui/src/{page => }/component/flash.js (100%) rename src/app/ui/src/{page => }/component/menu.js (97%) rename src/app/ui/src/{page => }/component/menu.stories.js (100%) rename src/app/ui/src/{page => }/layout/main.js (79%) delete mode 100644 src/app/ui/src/store/note.js create mode 100644 src/app/ui/src/store/notestore.js rename src/app/ui/src/{page => view}/about.js (100%) rename src/app/ui/src/{page => view}/error.js (83%) rename src/app/ui/src/{page => view}/home.js (100%) rename src/app/ui/src/{page => view}/notepad.js (61%) diff --git a/src/app/ui/jsconfig.json b/src/app/ui/jsconfig.json index 61babcec..c0ffc357 100644 --- a/src/app/ui/jsconfig.json +++ b/src/app/ui/jsconfig.json @@ -6,12 +6,12 @@ "baseUrl": "./", "checkJs": false, "paths": { - "~/*": [ - "*" - ], "@/*": [ "src/*" ], + "~/*": [ + "*" + ], }, }, "include": [ diff --git a/src/app/ui/src/page/component/block.js b/src/app/ui/src/component/block.js similarity index 100% rename from src/app/ui/src/page/component/block.js rename to src/app/ui/src/component/block.js diff --git a/src/app/ui/src/page/component/flash.js b/src/app/ui/src/component/flash.js similarity index 100% rename from src/app/ui/src/page/component/flash.js rename to src/app/ui/src/component/flash.js diff --git a/src/app/ui/src/page/component/menu.js b/src/app/ui/src/component/menu.js similarity index 97% rename from src/app/ui/src/page/component/menu.js rename to src/app/ui/src/component/menu.js index c0388ff6..fa5ffcfb 100644 --- a/src/app/ui/src/page/component/menu.js +++ b/src/app/ui/src/component/menu.js @@ -1,5 +1,5 @@ import m from "mithril"; -import CookieStore from "~/src/module/cookiestore"; +import CookieStore from "@/module/cookiestore"; function logout() { CookieStore.clear(); diff --git a/src/app/ui/src/page/component/menu.stories.js b/src/app/ui/src/component/menu.stories.js similarity index 100% rename from src/app/ui/src/page/component/menu.stories.js rename to src/app/ui/src/component/menu.stories.js diff --git a/src/app/ui/src/index.js b/src/app/ui/src/index.js index d7db72c0..76d38014 100644 --- a/src/app/ui/src/index.js +++ b/src/app/ui/src/index.js @@ -1,11 +1,11 @@ import m from "mithril"; -import AboutPage from "@/page/about"; +import AboutPage from "@/view/about"; import LoginPage from "@/view/login"; import RegisterPage from "@/view/register"; -import HomePage from "@/page/home"; -import NotepadPage from "@/page/notepad"; -import ErrorPage from "@/page/error"; -import LayoutMain from "@/page/layout/main"; +import HomePage from "@/view/home"; +import NotepadPage from "@/view/notepad"; +import ErrorPage from "@/view/error"; +import LayoutMain from "@/layout/main"; import CookieStore from "@/module/cookiestore"; import "~/node_modules/@fortawesome/fontawesome-free/js/all.js"; import "~/style/main.scss"; diff --git a/src/app/ui/src/index.stories.js b/src/app/ui/src/index.stories.js index 96815cbf..637447e1 100644 --- a/src/app/ui/src/index.stories.js +++ b/src/app/ui/src/index.stories.js @@ -3,7 +3,7 @@ import m from "mithril"; import { action } from "@storybook/addon-actions"; import { withKnobs, text, boolean, number } from "@storybook/addon-knobs"; import { withA11y } from "@storybook/addon-a11y"; -import Block from "@/page/component/block"; +import Block from "@/component/block"; export default { title: "Structure/Block", diff --git a/src/app/ui/src/page/layout/main.js b/src/app/ui/src/layout/main.js similarity index 79% rename from src/app/ui/src/page/layout/main.js rename to src/app/ui/src/layout/main.js index c54d0018..0e4b7ff8 100644 --- a/src/app/ui/src/page/layout/main.js +++ b/src/app/ui/src/layout/main.js @@ -1,5 +1,5 @@ import m from "mithril"; -import Menu from "@/page/component/menu"; +import Menu from "@/component/menu"; var View = { view: function (vnode) { diff --git a/src/app/ui/src/store/note.js b/src/app/ui/src/store/note.js deleted file mode 100644 index 6f6c100d..00000000 --- a/src/app/ui/src/store/note.js +++ /dev/null @@ -1,54 +0,0 @@ -import m from "mithril"; -import CookieStore from "~/src/module/cookiestore"; - -var Note = { - current: {}, - list: [], - clear: () => { - Note.current = {}; - }, - create: () => { - return m.request({ - method: "POST", - url: "/api/v1/note", - headers: { - Authorization: CookieStore.bearerToken(), - }, - body: Note.current, - }); - }, - load: () => { - return m - .request({ - method: "GET", - url: "/api/v1/note", - headers: { - Authorization: CookieStore.bearerToken(), - }, - }) - .then((result) => { - Note.list = result.notes; - }); - }, - update: (id, text) => { - return m.request({ - method: "PUT", - url: "/api/v1/note/" + id, - headers: { - Authorization: CookieStore.bearerToken(), - }, - body: { message: text }, - }); - }, - delete: (id) => { - return m.request({ - method: "DELETE", - url: "/api/v1/note/" + id, - headers: { - Authorization: CookieStore.bearerToken(), - }, - }); - }, -}; - -export default Note; diff --git a/src/app/ui/src/store/notestore.js b/src/app/ui/src/store/notestore.js new file mode 100644 index 00000000..c8de9107 --- /dev/null +++ b/src/app/ui/src/store/notestore.js @@ -0,0 +1,89 @@ +import m from "mithril"; +import Flash from "@/component/flash"; +import CookieStore from "@/module/cookiestore"; + +var NoteStore = { + current: {}, + list: [], + clear: () => { + NoteStore.current = {}; + }, + submit: () => { + NoteStore.create() + .then(() => { + Flash.success("Note created."); + // This could be optimized instead of reloading. + NoteStore.load(); + NoteStore.clear(); + }) + .catch((err) => { + Flash.warning(err.response.message); + }); + }, + create: () => { + return m.request({ + method: "POST", + url: "/api/v1/note", + headers: { + Authorization: CookieStore.bearerToken(), + }, + body: NoteStore.current, + }); + }, + load: () => { + return m + .request({ + method: "GET", + url: "/api/v1/note", + headers: { + Authorization: CookieStore.bearerToken(), + }, + }) + .then((result) => { + NoteStore.list = result.notes; + }); + }, + runUpdate: (id, value) => { + NoteStore.update(id, value) + .then(() => { + Flash.success("Note updated."); + }) + .catch((e) => { + Flash.warning("Could not update note: " + e.response.message); + }); + }, + update: (id, text) => { + return m.request({ + method: "PUT", + url: "/api/v1/note/" + id, + headers: { + Authorization: CookieStore.bearerToken(), + }, + body: { message: text }, + }); + }, + runDelete: (id) => { + NoteStore.delete(id) + .then(() => { + Flash.success("Note deleted."); + NoteStore.list = NoteStore.list.filter(function (i) { + return i.id !== id; + }); + }) + .catch((err) => { + console.log(err); + Flash.warning("Could not delete: " + err.response.message); + }); + }, + delete: (id) => { + return m.request({ + method: "DELETE", + url: "/api/v1/note/" + id, + headers: { + Authorization: CookieStore.bearerToken(), + }, + }); + }, +}; + +export default NoteStore; diff --git a/src/app/ui/src/store/userlogin.js b/src/app/ui/src/store/userlogin.js index 7dd806e7..e878de47 100644 --- a/src/app/ui/src/store/userlogin.js +++ b/src/app/ui/src/store/userlogin.js @@ -1,7 +1,7 @@ import m from "mithril"; import Submit from "@/module/submit"; -import Flash from "@/page/component/flash"; -import CookieStore from "~/src/module/cookiestore"; +import Flash from "@/component/flash"; +import CookieStore from "@/module/cookiestore"; var UserLogin = { user: { @@ -18,7 +18,7 @@ var UserLogin = { body: UserLogin.user, }); }, - onSubmit: function (e) { + submit: function (e) { Submit.start(e); UserLogin.login() diff --git a/src/app/ui/src/store/userregister.js b/src/app/ui/src/store/userregister.js index d5f1e97e..bbd3d4a4 100644 --- a/src/app/ui/src/store/userregister.js +++ b/src/app/ui/src/store/userregister.js @@ -1,6 +1,6 @@ import m from "mithril"; import Submit from "@/module/submit"; -import Flash from "@/page/component/flash"; +import Flash from "@/component/flash"; var UserRegister = { user: { @@ -19,7 +19,7 @@ var UserRegister = { body: UserRegister.user, }); }, - onSubmit: function (e) { + submit: function (e) { Submit.start(e); UserRegister.register() diff --git a/src/app/ui/src/page/about.js b/src/app/ui/src/view/about.js similarity index 100% rename from src/app/ui/src/page/about.js rename to src/app/ui/src/view/about.js diff --git a/src/app/ui/src/page/error.js b/src/app/ui/src/view/error.js similarity index 83% rename from src/app/ui/src/page/error.js rename to src/app/ui/src/view/error.js index 2436fdb6..7d95b11b 100644 --- a/src/app/ui/src/page/error.js +++ b/src/app/ui/src/view/error.js @@ -12,7 +12,7 @@ var Page = {

{data.title}

-

This is a an error page.

+

The page is not found.

diff --git a/src/app/ui/src/page/home.js b/src/app/ui/src/view/home.js similarity index 100% rename from src/app/ui/src/page/home.js rename to src/app/ui/src/view/home.js diff --git a/src/app/ui/src/view/login.js b/src/app/ui/src/view/login.js index 507ad75b..64f2b09b 100644 --- a/src/app/ui/src/view/login.js +++ b/src/app/ui/src/view/login.js @@ -1,5 +1,5 @@ import m from "mithril"; -import UserLogin from "~/src/store/userlogin"; +import UserLogin from "@/store/userlogin"; var data = { title: "Login", @@ -20,7 +20,7 @@ var Page = {
- +
diff --git a/src/app/ui/src/page/notepad.js b/src/app/ui/src/view/notepad.js similarity index 61% rename from src/app/ui/src/page/notepad.js rename to src/app/ui/src/view/notepad.js index b488bba1..b338db96 100644 --- a/src/app/ui/src/page/notepad.js +++ b/src/app/ui/src/view/notepad.js @@ -1,26 +1,12 @@ import m from "mithril"; -import Note from "@/store/note"; -import Flash from "@/page/component/flash"; - -function onSubmit() { - Note.create() - .then(() => { - Flash.success("Note created."); - // This could be optimized instead of reloading. - Note.load(); - Note.clear(); - }) - .catch((err) => { - Flash.warning(err.response.message); - }); -} +import NoteStore from "@/store/notestore"; var Page = { oninit: () => { - Note.load(); + NoteStore.load(); }, onremove: () => { - Note.clear(); + NoteStore.clear(); }, view: () => m( @@ -42,18 +28,22 @@ var Page = { if (e.key !== "Enter") { return; } - onSubmit(); + NoteStore.submit(); }} oninput={(e) => { - Note.current.message = e.target.value; + NoteStore.current.message = e.target.value; }} - value={Note.current.message} + value={NoteStore.current.message} />
+
+ ), + }; }; export default View; From f352abc62552eeb7917f2b6618989f459b420400 Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Tue, 7 Jul 2020 19:35:13 -0400 Subject: [PATCH 19/21] Convert more elements to closure components --- src/app/ui/src/component/note.js | 104 ++++++++++++------------ src/app/ui/src/component/simple-page.js | 30 +++---- src/app/ui/src/example/block.js | 6 +- src/app/ui/src/layout/main.js | 14 +++- src/app/ui/src/view/notepad.js | 101 +++++++++++------------ 5 files changed, 131 insertions(+), 124 deletions(-) diff --git a/src/app/ui/src/component/note.js b/src/app/ui/src/component/note.js index fb1a9963..390de9ee 100644 --- a/src/app/ui/src/component/note.js +++ b/src/app/ui/src/component/note.js @@ -2,63 +2,59 @@ import m from "mithril"; // eslint-disable-line no-unused-vars import Debounce from "@/module/debounce"; import NoteStore from "@/store/notestore"; -var View = { - oninit: (vnode) => { - vnode.state.id = vnode.attrs.id; - vnode.state.message = vnode.attrs.message; - }, - view: (vnode) => ( -
  • -
    -
    -
    - { - vnode.state.message = e.target.value; - }} - onkeyup={(e) => { - Debounce.run( - vnode.state.id, - () => { - NoteStore.runUpdate(vnode.state.id, e.target.value); - vnode.state.saving = "Saving..."; - m.redraw(); - setTimeout(function () { - vnode.state.saving = ""; +var View = () => { + return { + view: (vnode) => ( +
  • +
    +
    +
    + { + Debounce.run( + vnode.attrs.id, + () => { + NoteStore.runUpdate(vnode.attrs.id, e.target.value); + vnode.state.saving = "Saving..."; m.redraw(); - }, 1000); - }, - 1000 - ); - }} - /> + setTimeout(function () { + vnode.state.saving = ""; + m.redraw(); + }, 1000); + }, + 1000 + ); + }} + /> +
    +
    - - -
  • - ), + + ), + }; }; export default View; diff --git a/src/app/ui/src/component/simple-page.js b/src/app/ui/src/component/simple-page.js index f1bbedd1..437e16a1 100644 --- a/src/app/ui/src/component/simple-page.js +++ b/src/app/ui/src/component/simple-page.js @@ -1,19 +1,21 @@ import m from "mithril"; // eslint-disable-line no-unused-vars -var Page = { - view: (vnode) => - m( - "page", -
    -
    -
    -

    {vnode.attrs.title}

    -

    {vnode.attrs.description}

    -
    {vnode.attrs.content}
    -
    -
    -
    - ), +var Page = () => { + return { + view: (vnode) => + m( + "page", +
    +
    +
    +

    {vnode.attrs.title}

    +

    {vnode.attrs.description}

    +
    {vnode.attrs.content}
    +
    +
    +
    + ), + }; }; export default Page; diff --git a/src/app/ui/src/example/block.js b/src/app/ui/src/example/block.js index 9f520f6e..6f6892cd 100644 --- a/src/app/ui/src/example/block.js +++ b/src/app/ui/src/example/block.js @@ -1,7 +1,9 @@ import m from "mithril"; // eslint-disable-line no-unused-vars -var Block = { - view: (vnode) => m("",
    {vnode.children}
    ), +var Block = () => { + return { + view: (vnode) => m("",
    {vnode.children}
    ), + }; }; export default Block; diff --git a/src/app/ui/src/layout/main.js b/src/app/ui/src/layout/main.js index 5ce274ea..13d3dca7 100644 --- a/src/app/ui/src/layout/main.js +++ b/src/app/ui/src/layout/main.js @@ -2,10 +2,16 @@ import m from "mithril"; // eslint-disable-line no-unused-vars import Menu from "@/component/menu"; import Flash from "@/component/flash"; -var View = { - view: function (vnode) { - return m("main.layout", [m(Menu), m("section", vnode.children), m(Flash)]); - }, +var View = () => { + return { + view: function (vnode) { + return m("main.layout", [ + m(Menu), + m("section", vnode.children), + m(Flash), + ]); + }, + }; }; export default View; diff --git a/src/app/ui/src/view/notepad.js b/src/app/ui/src/view/notepad.js index ef31b5fd..4add5fb2 100644 --- a/src/app/ui/src/view/notepad.js +++ b/src/app/ui/src/view/notepad.js @@ -9,59 +9,60 @@ var Page = { onremove: () => { NoteStore.clear(); }, - view: () => - m( - "notepad", -
    -
    -
    -
    - -
    - { - if (e.key !== "Enter") { - return; - } - NoteStore.submit(); - }} - oninput={(e) => { - NoteStore.current.message = e.target.value; - }} - value={NoteStore.current.message} - /> -
    + view: () => ( +
    +
    +
    +
    + +
    + { + if (e.key !== "Enter") { + return; + } + NoteStore.submit(); + }} + oninput={(e) => { + NoteStore.current.message = e.target.value; + }} + value={NoteStore.current.message} + />
    - -
    -
    -
      - {NoteStore.list.map((note) => ( - - ))} -
    + +
    +
    +
      + {NoteStore.list.map((note) => ( + { + note.message = e.target.value; + }} + /> + ))} +
    -
    - ), +
    +
    + ), }; export default Page; From c3a3076927d4283fc8e5fba8be0a143c9bc803cb Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Tue, 7 Jul 2020 19:43:38 -0400 Subject: [PATCH 20/21] Simplify userlogin --- src/app/ui/src/store/userlogin.js | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/src/app/ui/src/store/userlogin.js b/src/app/ui/src/store/userlogin.js index 68878778..e0d8b44b 100644 --- a/src/app/ui/src/store/userlogin.js +++ b/src/app/ui/src/store/userlogin.js @@ -4,17 +4,14 @@ import Flash from "@/component/flash"; import CookieStore from "@/module/cookiestore"; var UserLogin = (e, user) => { - let login = () => { - return m.request({ + Submit.start(e); + + return m + .request({ method: "POST", url: "/api/v1/login", body: user, - }); - }; - - Submit.start(e); - - return login() + }) .then((data) => { Submit.finish(); From 4f3938611dafb71e6d261fa2b28ac581fe7afeef Mon Sep 17 00:00:00 2001 From: Joseph Spurrier Date: Tue, 7 Jul 2020 21:53:11 -0400 Subject: [PATCH 21/21] Convert more to closures --- src/app/ui/src/view/login.js | 174 +++++++++++----------- src/app/ui/src/view/notepad.js | 118 +++++++-------- src/app/ui/src/view/register.js | 247 ++++++++++++++++---------------- 3 files changed, 268 insertions(+), 271 deletions(-) diff --git a/src/app/ui/src/view/login.js b/src/app/ui/src/view/login.js index d6cd7dd1..446f82fa 100644 --- a/src/app/ui/src/view/login.js +++ b/src/app/ui/src/view/login.js @@ -7,102 +7,100 @@ var data = { subtitle: "Enter your login information below.", }; -var clear = (vnode) => { - vnode.state.user = {}; -}; +var Page = (vnodeInitial) => { + let user = {}; -var Page = { - oninit: (vnode) => { - clear(vnode); + var clear = () => { + user = {}; + }; - // Prefill the fields. - if (vnode.attrs.email) { - vnode.state.user.email = vnode.attrs.email; - } - if (vnode.attrs.password) { - vnode.state.user.password = vnode.attrs.password; - } - }, - onremove: (vnode) => { - clear(vnode); - }, - view: (vnode) => ( -
    -
    -
    -
    -

    {data.title}

    -

    {data.subtitle}

    -
    + // Prefill the fields. + if (vnodeInitial.attrs.email) { + user.email = vnodeInitial.attrs.email; + } + if (vnodeInitial.attrs.password) { + user.password = vnodeInitial.attrs.password; + } -
    - { - UserLogin(e, vnode.state.user) - .then(() => { - clear(vnode); - }) - .catch(() => {}); - }} - > - { - vnode.state.user.email = e.target.value; - }} - value={vnode.state.user.email} - /> + return { + view: (vnode) => ( +
    +
    +
    +
    +

    {data.title}

    +

    {data.subtitle}

    +
    - { - vnode.state.user.password = e.target.value; +
    + { + UserLogin(e, user) + .then(() => { + clear(vnode); + }) + .catch(() => {}); }} - value={vnode.state.user.password} - type="password" - /> + > + { + user.email = e.target.value; + }} + value={user.email} + /> -
    -

    - -

    + { + user.password = e.target.value; + }} + value={user.password} + type="password" + /> -

    - -

    +
    +

    + +

    + +

    + +

    -

    - - Register - -

    -
    - -
    -
    -
    -
    - ), +

    + + Register + +

    +
    + +
    + + +
    + ), + }; }; export default Page; diff --git a/src/app/ui/src/view/notepad.js b/src/app/ui/src/view/notepad.js index 4add5fb2..2edda963 100644 --- a/src/app/ui/src/view/notepad.js +++ b/src/app/ui/src/view/notepad.js @@ -2,67 +2,69 @@ import m from "mithril"; // eslint-disable-line no-unused-vars import NoteStore from "@/store/notestore"; import Note from "@/component/note"; -var Page = { - oninit: () => { - NoteStore.load(); - }, - onremove: () => { - NoteStore.clear(); - }, - view: () => ( -
    -
    -
    -
    - -
    - { - if (e.key !== "Enter") { - return; - } - NoteStore.submit(); - }} - oninput={(e) => { - NoteStore.current.message = e.target.value; - }} - value={NoteStore.current.message} - /> +var Page = () => { + NoteStore.load(); + + return { + view: () => ( +
    +
    +
    +
    + +
    + { + if (e.key !== "Enter") { + return; + } + NoteStore.submit(); + }} + oninput={(e) => { + NoteStore.current.message = e.target.value; + }} + value={NoteStore.current.message} + /> +
    + +
    +
    +
      + {NoteStore.list.map((note) => ( + { + note.message = e.target.value; + }} + /> + ))} +
    - -
    -
    -
      - {NoteStore.list.map((note) => ( - { - note.message = e.target.value; - }} - /> - ))} -
    -
    -
    - ), + + ), + }; }; export default Page; diff --git a/src/app/ui/src/view/register.js b/src/app/ui/src/view/register.js index 164ea77c..254b74b5 100644 --- a/src/app/ui/src/view/register.js +++ b/src/app/ui/src/view/register.js @@ -6,141 +6,138 @@ var data = { subtitle: "Enter your information below.", }; -var Page = { - onremove: () => { - UserRegister.clear(); - }, - oninit: (vnode) => { - // Prefill the fields. - if (vnode.attrs.firstName) { - UserRegister.user.first_name = vnode.attrs.firstName; - } - if (vnode.attrs.lastName) { - UserRegister.user.last_name = vnode.attrs.lastName; - } - if (vnode.attrs.email) { - UserRegister.user.email = vnode.attrs.email; - } - if (vnode.attrs.password) { - UserRegister.user.password = vnode.attrs.password; - } - }, - view: () => { - return m( - "", -
    -
    -
    -
    -

    {data.title}

    -

    {data.subtitle}

    -
    +var Page = (vnodeInitial) => { + // Prefill the fields. + if (vnodeInitial.attrs.firstName) { + UserRegister.user.first_name = vnodeInitial.attrs.firstName; + } + if (vnodeInitial.attrs.lastName) { + UserRegister.user.last_name = vnodeInitial.attrs.lastName; + } + if (vnodeInitial.attrs.email) { + UserRegister.user.email = vnodeInitial.attrs.email; + } + if (vnodeInitial.attrs.password) { + UserRegister.user.password = vnodeInitial.attrs.password; + } -
    -
    -
    - -
    - { - UserRegister.user.first_name = e.target.value; - }} - value={UserRegister.user.first_name} - > + return { + view: () => { + return ( +
    +
    +
    +
    +

    {data.title}

    +

    {data.subtitle}

    +
    + +
    + +
    + +
    + { + UserRegister.user.first_name = e.target.value; + }} + value={UserRegister.user.first_name} + > +
    -
    -
    - -
    - { - UserRegister.user.last_name = e.target.value; - }} - value={UserRegister.user.last_name} - > +
    + +
    + { + UserRegister.user.last_name = e.target.value; + }} + value={UserRegister.user.last_name} + > +
    -
    -
    - -
    - { - UserRegister.user.email = e.target.value; - }} - value={UserRegister.user.email} - > +
    + +
    + { + UserRegister.user.email = e.target.value; + }} + value={UserRegister.user.email} + > +
    -
    -
    - -
    - { - UserRegister.user.password = e.target.value; - }} - value={UserRegister.user.password} - > +
    + +
    + { + UserRegister.user.password = e.target.value; + }} + value={UserRegister.user.password} + > +
    -
    -
    -

    - -

    +
    +

    + +

    -

    - -

    -
    - -
    -
    -
    -
    - ); - }, +

    + +

    +
    + +
    +
    +
    +
    + ); + }, + }; }; export default Page;