ReadMe

README.md

@@ -1,19 +1,13 @@
-# Electron application example
+# mpad
 
-This example shows how you can use Next.js inside an Electron application to avoid a lot of configuration. It uses the Next.js router as view and server-render to speed up the initial render of the application.
+A multi-use clipboard manager and note pad for macOS.
 
-For development it's going to run an HTTP server and let Next.js handle routing. In production it uses `next export` to pre-generate HTML static files and uses them in your app instead of running an HTTP server.
+# Download
 
-**You can find a detailed documentation about how to build Electron apps with Next.js [here](https://leo.im/2017/electron-next)!**
+Coming soon.
 
-## How to use
-
-Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
-
-```bash
-npx create-next-app --example with-electron with-electron-app
-# or
-yarn create next-app --example with-electron with-electron-app
+# Development
 ```
-
-You can create the production app using `npm run dist`.
+yarn
+yarn start
+```

main/index.js

@@ -10,8 +10,8 @@ const low = require('lowdb')
 const FileSync = require('lowdb/adapters/FileSync')
 const fs = require('fs-extra')
 const shortid = require('shortid')
-const SHA256 = require('crypto-js/sha256')
 const keytar = require('keytar')
+const CryptoJS = require('crypto-js')
 
 let tray = null
 let window = null
@@ -22,15 +22,28 @@ const path = app.getPath('userData')
 app.dock.hide()
 
 app.on('ready', async () => {
-    await prepareNext('./renderer')
-
     salt = await keytar.getPassword('mpad', 'hash')
-
     if (!salt) {
-        salt = SHA256(shortid.generate())
+        salt = CryptoJS.SHA256(shortid.generate())
         await keytar.setPassword('mpad', 'hash', salt.toString())
     }
 
+    var file = await fs.readFile(join(path, '.db')).catch((e) => console.log('No database detected.'))
+
+    if (file) {
+        try {
+            var crypt = CryptoJS.AES.decrypt(file.toString(), salt)
+            crypt.toString(CryptoJS.enc.Utf8)
+            console.log('Decrypted successfully.')
+        } catch (error) {
+            console.log(error)
+            await fs.rename(join(path, '.db'), `${join(path, '.db')}.${Date.now()}`)
+            console.log('Failed to decrypt. Deleting database.')
+        }
+    }
+
+    await prepareNext('./renderer')
+
     createTray()
     createWindow()
 })

main/preload.js

@@ -8,14 +8,9 @@ const NetworkSpeed = require('network-speed')
 const { join } = require('path')
 const CryptoJS = require('crypto-js')
 
-// Since we disabled nodeIntegration we can reintroduce
-// needed node functionality here
-
 const salt = process.argv.find((arg) => arg.startsWith('salt:')).split(':')[1]
 const dbPath = process.argv.find((arg) => arg.startsWith('dbPath:')).split(':')[1]
 
-console.log(salt)
-
 const encrypt = (message) => {
     return CryptoJS.AES.encrypt(JSON.stringify(message), salt).toString()
 }
@@ -33,16 +28,16 @@ const db = low(adapter)
 
 db.defaults({ clipboards: [], notes: '' }).write()
 
-const CopyEvent = (detail) => new CustomEvent('copy', { detail: detail })
+const CopyEvent = (detail) => new CustomEvent('clipboardEvent', { detail: detail })
 const copyHandler = () => {
     const newClip = { id: shortid.generate(), date: Date.now(), content: clipboard.readText() }
     if (/^\s*$/.test(newClip.content)) return
 
     const latest = db.get('clipboards').sortBy('date').reverse().take(5).value()
     const exists = latest.find((clip) => clip.content === newClip.content)
-
     if (exists) return
 
+    console.log('newClip', newClip)
     window.dispatchEvent(CopyEvent(newClip))
 
     db.get('clipboards').push(newClip).write()

renderer/pages/_app.js

@@ -1,15 +1,13 @@
 import Nav from '../components/Nav'
 import '../global.scss'
-import { useStats } from '../lib/mstats'
 
 export default function App({ Component, pageProps }) {
-    const stats = useStats()
     return (
         <>
             <div className='w-full h-screen flex flex-col bg-white text-shadow-lg'>
                 <Nav />
                 <div className='relative w-full box-border h-screen p-4 text-gray-600 overflow-auto  hide-scroll-bar'>
-                    <Component {...stats} {...pageProps} />
+                    <Component {...pageProps} />
                 </div>
             </div>
         </>

renderer/pages/index.js

@@ -29,15 +29,14 @@ const ClipboardPage = ({ stats }) => {
     useEffect(() => {
         const handler = (e) => {
             console.log('Detected copy event.')
-            console.log(e)
-
-            console.log(clipboards)
+            console.log('e', e)
+            console.log('e.detail', e.detail)
 
             setClipboards([e.detail, ...clipboards])
         }
 
-        window.addEventListener('copy', handler)
-        return () => window.removeEventListener('copy', handler)
+        window.addEventListener('clipboardEvent', handler)
+        return () => window.removeEventListener('clipboardEvent', handler)
     }, [clipboards])
 
     return (
@@ -52,6 +51,11 @@ const ClipboardPage = ({ stats }) => {
                         </CopyToClipboard>
                     )
                 })}
+
+                {!clipboards && <p className='text-xs text-gray-400'>Loading...</p>}
+                {clipboards?.length <= 0 && (
+                    <p className='text-xs font-mono font-medium text-gray-400'>No clips found. Copy something!</p>
+                )}
             </div>
         </>
     )

renderer/pages/notes.js

@@ -1,5 +1,4 @@
 import { useState, useEffect } from 'react'
-import { useStats } from '../lib/mstats'
 
 const { db } = global