taskr

.gitignore

@@ -0,0 +1,10 @@
+# build output
+dist
+renderer/.next
+renderer/out
+
+# dependencies
+node_modules
+
+# logs
+npm-debug.log

license

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

main/index.js

@@ -0,0 +1,38 @@
+'use strict'
+
+// Native
+const { format } = require('url')
+const { join } = require('path')
+
+// Packages
+const { BrowserWindow, app } = require('electron')
+const isDev = require('electron-is-dev')
+const prepareNext = require('electron-next')
+const { resolve } = require('app-root-path')
+
+// Prepare the renderer once the app is ready
+app.on('ready', async () => {
+  await prepareNext('./renderer')
+
+  const mainWindow = new BrowserWindow({
+    width: 300,
+    height: 550,
+    resizable: false,
+    titleBarStyle: 'hiddenInset',
+    icon: join(__dirname, 'main/static/icon.icns')
+  })
+
+  const devPath = 'http://localhost:8000/start'
+
+  const prodPath = format({
+    pathname: resolve('renderer/out/start/index.html'),
+    protocol: 'file:',
+    slashes: true
+  })
+
+  const url = isDev ? devPath : prodPath
+  mainWindow.loadURL(url)
+})
+
+// Quit the app once all windows are closed
+app.on('window-all-closed', app.quit)

package.json

@@ -0,0 +1,59 @@
+{
+  "name": "taskr",
+  "version": "0.0.0",
+  "description": "A simple task manager app",
+  "main": "main/index.js",
+  "repository": "https://github.com/bukinoshita/taskr.git",
+  "author": "Bu Kinoshita <bukinoshita@gmail.com>",
+  "license": "MIT",
+  "scripts": {
+    "start": "electron .",
+    "build": "next build renderer && next export renderer",
+    "dist": "npm run build && build --dir",
+    "prod": "electron-builder",
+    "test": "xo"
+  },
+  "build": {
+    "appId": "taskr",
+    "files": ["**/*", "!renderer", "renderer/out"],
+    "win": {
+      "target": ["squirrel"],
+      "icon": "main/static/icon.ico"
+    },
+    "mac": {
+      "category": "public.app-category.developer-tools",
+      "icon": "main/static/icon.icns"
+    }
+  },
+  "dependencies": {
+    "app-root-path": "^2.0.1",
+    "classnames": "^2.2.5",
+    "electron-is-dev": "^0.3.0",
+    "electron-next": "^3.1.3",
+    "prop-types": "^15.6.0",
+    "uid-promise": "^1.0.0"
+  },
+  "devDependencies": {
+    "electron": "^1.7.10",
+    "electron-builder": "^19.49.2",
+    "eslint-config-prettier": "^2.9.0",
+    "eslint-plugin-react": "^7.5.1",
+    "next": "^4.2.1",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "xo": "^0.18.2"
+  },
+  "xo": {
+    "extends": ["prettier", "prettier/react", "plugin:react/recommended"],
+    "rules": {
+      "react/no-unescaped-entities": 0,
+      "react/react-in-jsx-scope": 0,
+      "react/display-name": 0,
+      "react/prop-types": 0,
+      "default-case": 0,
+      "no-case-declarations": 0
+    },
+    "ignores": ["node_modules"],
+    "globals": ["localStorage"]
+  }
+}

readme.md

@@ -0,0 +1,34 @@
+![](https://github.com/bukinoshita/taskr/blob/master/media/banner.png)
+
+## Usage
+
+[Download the latest release!]()
+
+## Contribute
+
+To run it locally on your own computer:
+
+* [Fork](https://help.github.com/articles/fork-a-repo/) this repository
+* [Clone](https://help.github.com/articles/cloning-a-repository/) it to your
+  local device
+* [Install](https://yarnpkg.com/en/docs/cli/install) the dependencies
+* [Run](https://github.com/bukinoshita/taskr/blob/master/package.json#L10) the
+  project
+
+To make sure that your code works in the finished application, you can generate
+the binaries like this:
+
+```bash
+$ yarn dist
+```
+
+After that, you will see the binary in the `./dist` folder!
+
+## Demo
+
+![](https://github.com/bukinoshita/taskr/blob/master/media/taskr.png)
+![](https://github.com/bukinoshita/taskr/blob/master/media/new-task.png)
+
+## License
+
+MIT © [Bu Kinoshita](https://bukinoshita.io)

renderer/components/backlog.js

@@ -0,0 +1,37 @@
+'use strict'
+
+// Components
+import EmptyState from './empty-state'
+import Task from './task'
+
+const Backlog = ({ tasks, onDelete, onMove }) => {
+  const list =
+    tasks.length === 0 ? (
+      <EmptyState title="tasks on backlog" />
+    ) : (
+      tasks.map(task => (
+        <Task key={task.id} task={task} onDelete={onDelete} onMove={onMove} />
+      ))
+    )
+
+  return (
+    <ul>
+      {list}
+
+      <style jsx>{`
+        ul {
+          overflow-y: auto;
+          flex-basis: 315px;
+          max-height: 315px;
+          min-height: 315px;
+        }
+      `}</style>
+    </ul>
+  )
+}
+
+Backlog.defaultProps = {
+  tasks: []
+}
+
+export default Backlog

renderer/components/button.js

@@ -0,0 +1,41 @@
+'use strict'
+
+// Packages
+import PropTypes from 'prop-types'
+
+const Button = ({ children, type, onClick }) => {
+  return (
+    <button type={type} onClick={onClick}>
+      {children}
+
+      <style jsx>{`
+        button {
+          width: 100%;
+          height: 36px;
+          background: white;
+          border: none;
+          color: #000;
+          font-weight: 600;
+          font-size: 10px;
+          cursor: pointer;
+          text-transform: uppercase;
+          letter-spacing: 2px;
+          outline: none;
+        }
+      `}</style>
+    </button>
+  )
+}
+
+Button.defaultProps = {
+  onClick: null,
+  type: 'button'
+}
+
+Button.propTypes = {
+  children: PropTypes.node,
+  type: PropTypes.string,
+  onClick: PropTypes.func
+}
+
+export default Button

renderer/components/done.js

@@ -0,0 +1,35 @@
+'use strict'
+
+// Components
+import EmptyState from './empty-state'
+import Task from './task'
+
+const Done = ({ tasks }) => {
+  const list =
+    tasks.length === 0 ? (
+      <EmptyState title="tasks done" />
+    ) : (
+      tasks.map(task => <Task key={task.id} task={task} isDone={true} />)
+    )
+
+  return (
+    <ul>
+      {list}
+
+      <style jsx>{`
+        ul {
+          overflow-y: auto;
+          flex-basis: 315px;
+          max-height: 315px;
+          min-height: 315px;
+        }
+      `}</style>
+    </ul>
+  )
+}
+
+Done.defaultProps = {
+  tasks: []
+}
+
+export default Done

renderer/components/empty-state.js

@@ -0,0 +1,30 @@
+'use strict'
+
+const EmptyState = ({ title }) => {
+  return (
+    <div>
+      <h3>You do not have any {title}.</h3>
+
+      <style jsx>{`
+        div {
+          display: flex;
+          align-items: center;
+          text-align: center;
+          width: 100%;
+          height: 275px;
+        }
+
+        h3 {
+          color: white;
+          text-align: center;
+          font-size: 12px;
+          width: 100%;
+          opacity: 0.75;
+          line-height: 20px;
+        }
+      `}</style>
+    </div>
+  )
+}
+
+export default EmptyState

renderer/components/hero.js

@@ -0,0 +1,29 @@
+'use strict'
+
+const Hero = ({ type }) => {
+  return (
+    <header>
+      <h1>{type}</h1>
+
+      <style jsx>{`
+        header {
+          flex-basis: 115px;
+          display: flex;
+          align-items: flex-end;
+          padding-bottom: 20px;
+        }
+
+        h1 {
+          color: white;
+          font-size: 30px;
+        }
+      `}</style>
+    </header>
+  )
+}
+
+Hero.defaultProps = {
+  type: 'Today'
+}
+
+export default Hero