From 8900474af74c2a5eff3003e91fdff6ee035e35e5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ond=C5=99ej=20Syn=C3=A1=C4=8Dek?=
 <ondrejsynacek@fastmail.com>
Date: Sun, 20 Dec 2020 15:24:25 +0100
Subject: [PATCH] refactor: completely remove existing javascript and use
 Svelte app exclusively for rendering

---
 lib/frontend/components/Input.svelte          |  7 ++++-
 lib/frontend/constants.js                     |  5 ++++
 lib/frontend/index.js                         |  2 +-
 lib/frontend/logger-boot.js                   |  2 +-
 .../app => frontend/services}/logger.js       |  0
 lib/frontend/services/storageListener.js      |  6 +---
 lib/frontend/stores/configStore.js            |  2 +-
 lib/frontend/stores/eventStore.js             |  2 +-
 lib/static/app/crawler.js                     | 20 -------------
 lib/static/app/storage.js                     | 27 -----------------
 lib/static/app/utils.js                       | 27 -----------------
 lib/static/index.html                         |  9 ------
 lib/static/index.js                           | 17 -----------
 lib/static/style.css                          | 30 -------------------
 webpack.common.js                             |  2 +-
 15 files changed, 17 insertions(+), 141 deletions(-)
 create mode 100644 lib/frontend/constants.js
 rename lib/{static/app => frontend/services}/logger.js (100%)
 delete mode 100644 lib/static/app/crawler.js
 delete mode 100644 lib/static/app/storage.js
 delete mode 100644 lib/static/app/utils.js
 delete mode 100644 lib/static/index.js

diff --git a/lib/frontend/components/Input.svelte b/lib/frontend/components/Input.svelte
index ffea06d..156964f 100644
--- a/lib/frontend/components/Input.svelte
+++ b/lib/frontend/components/Input.svelte
@@ -8,11 +8,16 @@
   #form input {
     margin: 5px;
   }
+
+  input#url {
+    flex: 1;
+    font-size: 1rem;
+  }
 </style>
 
 <script>
   import { createEvent } from '../actions'
-  import logger from '../../static/app/logger'
+  import logger from '../services/logger'
 
   let value
 
diff --git a/lib/frontend/constants.js b/lib/frontend/constants.js
new file mode 100644
index 0000000..2926e14
--- /dev/null
+++ b/lib/frontend/constants.js
@@ -0,0 +1,5 @@
+export const STORAGE_KEYS = {
+  CONFIG: 'fb-to-ical-config',
+  EVENTS: 'fb-to-ical-events',
+}
+
diff --git a/lib/frontend/index.js b/lib/frontend/index.js
index e77fc75..20ffc08 100644
--- a/lib/frontend/index.js
+++ b/lib/frontend/index.js
@@ -24,4 +24,4 @@ const boot = () => {
   }
 }
 
-export default boot
+boot()
diff --git a/lib/frontend/logger-boot.js b/lib/frontend/logger-boot.js
index 22fb9fe..472f8b1 100644
--- a/lib/frontend/logger-boot.js
+++ b/lib/frontend/logger-boot.js
@@ -1,4 +1,4 @@
-import logger from '../static/app/logger'
+import logger from './services/logger'
 import { configStore } from './stores'
 
 export default () => {
diff --git a/lib/static/app/logger.js b/lib/frontend/services/logger.js
similarity index 100%
rename from lib/static/app/logger.js
rename to lib/frontend/services/logger.js
diff --git a/lib/frontend/services/storageListener.js b/lib/frontend/services/storageListener.js
index 691fff3..15d3697 100644
--- a/lib/frontend/services/storageListener.js
+++ b/lib/frontend/services/storageListener.js
@@ -1,10 +1,6 @@
+import { STORAGE_KEYS } from '../constants'
 import { configStore, eventStore } from '../stores'
 
-export const STORAGE_KEYS = {
-  CONFIG: 'fb-to-ical-config',
-  EVENTS: 'fb-to-ical-events',
-}
-
 class StorageListener {
   constructor() {
     this._storeSubscribers = new Set()
diff --git a/lib/frontend/stores/configStore.js b/lib/frontend/stores/configStore.js
index 6b6fee4..792a10b 100644
--- a/lib/frontend/stores/configStore.js
+++ b/lib/frontend/stores/configStore.js
@@ -1,6 +1,6 @@
 import { writable } from 'svelte/store'
 
-import { STORAGE_KEYS } from '../services/storageListener'
+import { STORAGE_KEYS } from '../constants'
 
 const createConfigStore = () => {
   const state = JSON.parse(localStorage.getItem(STORAGE_KEYS.CONFIG) || '{}')
diff --git a/lib/frontend/stores/eventStore.js b/lib/frontend/stores/eventStore.js
index a029e27..bd387ee 100644
--- a/lib/frontend/stores/eventStore.js
+++ b/lib/frontend/stores/eventStore.js
@@ -1,6 +1,6 @@
 import { writable } from 'svelte/store'
 
-import { STORAGE_KEYS } from '../services/storageListener'
+import { STORAGE_KEYS } from '../constants'
 import { migrateRecord, sortRecord }  from '../utils'
 
 const createEventStore = () => {
diff --git a/lib/static/app/crawler.js b/lib/static/app/crawler.js
deleted file mode 100644
index 4c1024a..0000000
--- a/lib/static/app/crawler.js
+++ /dev/null
@@ -1,20 +0,0 @@
-const crawl = async (url, { logger }) => {
-  if (logger) {
-    logger.log({
-      message: `Crawl started for url: ${url}`,
-      level: 'info',
-      service: 'parser',
-    })
-  }
-
-  return new Promise((resolve, reject) => {
-    fetch(url, {
-      method: 'GET',
-    }).then((response) => {
-      console.log(response)
-      resolve()
-    }).catch(reject)
-  })
-}
-
-export default crawl
diff --git a/lib/static/app/storage.js b/lib/static/app/storage.js
deleted file mode 100644
index 391a304..0000000
--- a/lib/static/app/storage.js
+++ /dev/null
@@ -1,27 +0,0 @@
-// TODO: this import should be removed once refactoring is finished
-import { eventStore } from '../../frontend/stores'
-
-const getConfigStorage = () => {
-  const storage = localStorage.getItem('fb-to-ical-config')
-
-  if (!storage) {
-    localStorage.setItem('fb-to-ical-config', JSON.stringify({}))
-    return "{}"
-  }
-
-  return storage
-}
-
-const getStorageContents = (storage) => {
-  return JSON.parse(storage)
-}
-
-const saveRecord = ({ id, link, createdAt, startTime, title }) => {
-  eventStore.setCalculation({ id, link, createdAt, startTime, title })
-}
-
-export {
-  getConfigStorage,
-  getStorageContents,
-  saveRecord,
-}
diff --git a/lib/static/app/utils.js b/lib/static/app/utils.js
deleted file mode 100644
index 2e150e5..0000000
--- a/lib/static/app/utils.js
+++ /dev/null
@@ -1,27 +0,0 @@
-// NOTE: Generate random IDs: https://stackoverflow.com/a/2117523/3056783
-const uuidv4 = () => {
-  return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
-    (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
-  )
-}
-
-const parseStartTimeFromiCalString = (text = '') => {
-  const [ dateStr, timeStr ] = text.split('T')
-  const rawDate = dateStr || ''
-  const rawTime = timeStr || ''
-
-  const year = Number(rawDate.slice(0, 4))
-  const month = Number(Math.max(rawDate.slice(4, 6) - 1), 0)
-  const date = Number(rawDate.slice(6, 8))
-  const hour = Number(rawTime.slice(0, 2))
-  const minutes = Number(rawTime.slice(2, 4))
-  const seconds = Number(rawTime.slice(4, 6))
-
-  const parsedDate = new Date(year, month, date, hour, minutes, seconds)
-  return parsedDate.toString()
-}
-
-export {
-  uuidv4,
-  parseStartTimeFromiCalString,
-}
diff --git a/lib/static/index.html b/lib/static/index.html
index 6b3ef82..e11572d 100644
--- a/lib/static/index.html
+++ b/lib/static/index.html
@@ -41,15 +41,6 @@
 
       </noscript>
 
-      <div id="status">
-        <div class="status-item" id="error">
-        </div>
-        <div class="status-item" id="service-worker">
-        </div>
-      </div>
-
-      <br />
-
       <div id="root"></div>
     </article>
     
diff --git a/lib/static/index.js b/lib/static/index.js
deleted file mode 100644
index 9f6698c..0000000
--- a/lib/static/index.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import { uuidv4, parseStartTimeFromiCalString } from './app/utils'
-import {
-  getConfigStorage,
-  getStorageContents,
-  saveRecord,
-} from './app/storage'
-import logger from './app/logger'
-import { extractEventDataFromHTML } from '../../lib/services/ics-retriever'
-import generateICS from '../../lib/services/ics-generator'
-
-import boot from '../frontend'
-import { requestStore } from '../frontend/stores'
-import { Request } from '../frontend/records'
-
-(() => {
-  document.addEventListener('DOMContentLoaded', boot)
-})()
diff --git a/lib/static/style.css b/lib/static/style.css
index c85f220..7217ab3 100644
--- a/lib/static/style.css
+++ b/lib/static/style.css
@@ -73,37 +73,7 @@ img#logo {
   margin: 5px;
 }
 
-input {
-  font-size: 1rem;
-}
-
 #current-download {
   display: none;
 }
 
-.row {
-  display: flex;
-  align-items: center;
-  flex-wrap: wrap;
-}
-
-input#url {
-  flex: 1;
-}
-
-.show {
-  display: block;
-}
-
-.hidden {
-  display: none;
-}
-
-.notice {
-  font-size: 0.9rem;
-}
-
-#nojs {
-  margin: 5px 0;
-}
-
diff --git a/webpack.common.js b/webpack.common.js
index f15cfcf..5847eac 100644
--- a/webpack.common.js
+++ b/webpack.common.js
@@ -16,7 +16,7 @@ if (isFirebaseEnv && hasFirebaseConfig) {
 }
 
 module.exports = {
-  entry: path.join(__dirname, 'lib', 'static', 'index.js'),
+  entry: path.join(__dirname, 'lib', 'frontend', 'index.js'),
   output: {
     filename: '[name].[hash].js',
     path: destination,