Use same paths for production and development

.gitignore

@@ -1,24 +1,18 @@
 bower_components
-node_modules
+node_modules/
 .pulp-cache
-output
+output/
 generated-docs
 .psc-package
 .psc*
 .purs*
 .psa*
 .pulp_cache
 .vscode
-src/Client/media/upload/
-configuration.json
-old/
-fix
 output-es/
-distcopy/
 todo
-dce-output/
 .cache/
 .spago/
-dist/
-parcel*.log
+file/bundle/
+file/upload
 spago.log

build-production.sh

@@ -1,10 +1,7 @@
 #!/bin/bash
 
-dist_folder="dist/production"
-bundle_folder="bundle"
-
 npm install &&
-rm -rf dist/production &&
+rm -rf file/bundle &&
 rm -rf output-es &&
 spago -x production.dhall build &&
 npx webpack --progress --config webpack.production.config.js &&

src/Server/Configuration.purs

@@ -18,9 +18,9 @@ readConfiguration ∷ Effect Configuration
 readConfiguration =
       if production then do
             port ← parsePort <$> NP.lookupEnv "PORT"
-            variables ← DT.traverse getVariable [ "CAPTCHA_SECRET", "TOKEN_SECRET", "SALT", "EMAIL_USER", "EMAIL_HOST", "EMAIL_PASSWORD", "DATABASE_HOST", "STORAGE_APPLICATION_ID", "STORAGE_APPLICATION_KEY", "ADMIN_SECRET" ]
+            variables ← DT.traverse getVariable [ "CAPTCHA_SECRET", "TOKEN_SECRET", "SALT", "EMAIL_USER", "EMAIL_HOST", "EMAIL_PASSWORD", "DATABASE_HOST", "ADMIN_SECRET" ]
             case variables of
-                  [ captchaSecret, tokenSecret, salt, emailUser, emailHost, emailPassword, host, storageApplicationKeyId, storageApplicationKey, adminSecret ] →
+                  [ captchaSecret, tokenSecret, salt, emailUser, emailHost, emailPassword, host, adminSecret ] →
                         pure $
                               { port
                               , databaseHost: Just host
@@ -30,8 +30,6 @@ readConfiguration =
                               , emailUser
                               , emailHost
                               , emailPassword
-                              , storageApplicationKeyId
-                              , storageApplicationKey
                               , adminSecret
                               }
                   _ → EE.throw "Wrong number of environment variables"
@@ -44,8 +42,6 @@ readConfiguration =
                   , tokenSecret: "so nice, so nice, I got you"
                   , salt: "put it back together"
                   , emailUser: ""
-                  , storageApplicationKey: ""
-                  , storageApplicationKeyId: ""
                   , adminSecret: ""
                   , emailHost: ""
                   , emailPassword: ""

src/Server/Effect.purs

@@ -19,8 +19,6 @@ type Configuration =
       { port ∷ Int
       , captchaSecret ∷ String
       , adminSecret ∷ String
-      , storageApplicationKey ∷ String
-      , storageApplicationKeyId ∷ String
       , tokenSecret ∷ String
       , salt ∷ String
       , databaseHost ∷ Maybe String

src/Server/File.js

@@ -1,15 +1,6 @@
-import b2 from 'b2-js';
 import imageType from 'image-type';
 
-let b, bucket;
-
-export async function init_(applicationKeyId, applicationKey) {
-    b = await b2.default.authorize({ applicationKeyId, applicationKey });
-    bucket = await b.bucket('ourmelon');
-}
-
 export async function upload_(fileName, buffer) {
-    await bucket.upload('upload/' + fileName, buffer);
 }
 
 export function realFileExtension_(buffer) {

src/Server/File.purs

@@ -28,7 +28,6 @@ import Shared.Unsafe as SU
 import Control.Promise (Promise)
 import Control.Promise as CP
 
-foreign import init_ ∷ EffectFn2 String String Unit
 foreign import upload_ ∷ EffectFn2 String Buffer Unit
 
 foreign import realFileExtension_ ∷ Buffer → Effect (Promise String)
@@ -39,9 +38,6 @@ realFileExtension buffer = CP.toAffE $ realFileExtension_ buffer
 upload ∷ String → Buffer → Effect Unit
 upload = EU.runEffectFn2 upload_
 
-init ∷ String → String → Effect Unit
-init = EU.runEffectFn2 init_
-
 invalidImageMessage ∷ String
 invalidImageMessage = "Invalid image"
 

src/Server/Handler.purs

@@ -7,6 +7,7 @@ import Data.Either (Either(..))
 import Data.List (List(..))
 import Data.List as DL
 import Data.String as DS
+import Debug (spy)
 import Effect.Aff (Aff)
 import Effect.Aff as EA
 import Effect.Class (liftEffect)
@@ -20,6 +21,8 @@ import Run.Except as RE
 import Run.Reader as RR
 import Server.Admin.Handler as SHA
 import Server.Backer.Handler as SBH
+import Server.Banned.Handler as SBNH
+import Server.Elsewhere.Handler as SESH
 import Server.Experiments.Handler as SEH
 import Server.Feedback.Handler as SFH
 import Server.Fortune.Handler as SFTH
@@ -28,8 +31,6 @@ import Server.Im.Handler as SIH
 import Server.InternalBacker.Handler as SIBH
 import Server.InternalError.Handler as SIEH
 import Server.InternalHelp.Handler as SIHH
-import Server.Elsewhere.Handler as SESH
-import Server.Banned.Handler as SBNH
 import Server.KarmaPrivileges.Handler as SLBH
 import Server.Landing.Handler as SLH
 import Server.Login.Handler as SLGH
@@ -40,6 +41,7 @@ import Server.Profile.Handler as SPH
 import Server.Recover.Handler as SRH
 import Server.Settings.Handler as SSH
 import Server.Unsubscribe.Handler as SUH
+import Shared.Resource (developmentBasePath)
 import Shared.ResponseError (ResponseError(..))
 import Shared.Routes (routes)
 
@@ -141,13 +143,6 @@ runJson reading handler =
 developmentFiles ∷ { params ∷ { path ∷ List String } } → Aff File
 developmentFiles { params: { path } } = PSH.file fullPath {}
       where
-      clientBaseFolder = "src/Client/"
-      distBaseFolder = "dist/development/"
       fullPath = case path of
-            Cons "media" (Cons file Nil) → clientBaseFolder <> "media/" <> file
-            Cons "media" (Cons "upload" (Cons file Nil)) → clientBaseFolder <> "media/upload/" <> file
-            --js files are expected to be named like module.bundle.js
-            -- they are served from webpack output
-            Cons "javascript" (Cons file Nil) → distBaseFolder <> file
-            Cons folder (Cons file Nil) → clientBaseFolder <> folder <> "/" <> file
-            _ → distBaseFolder <> DS.joinWith "/" (DL.toUnfoldable path)
+            Cons folder (Cons file Nil) → developmentBasePath <> folder <> "/" <> file
+            _ → "notfound"

src/Server/Main.purs

@@ -8,12 +8,10 @@ import Effect.Aff as EA
 import Effect.Console as EC
 import Effect.Ref as ER
 import Effect.Timer as ET
-import Environment (production)
 import Payload.Server (defaultOpts)
 import Payload.Server as PS
 import Server.Configuration as CF
 import Server.Database as SD
-import Server.File as SF
 import Server.Guard (guards)
 import Server.Handler as SH
 import Server.Effect (Configuration)
@@ -26,8 +24,7 @@ import Shared.Spec (spec)
 
 main ∷ Effect Unit
 main = do
-      configuration@{ storageApplicationKeyId, storageApplicationKey } ← CF.readConfiguration
-      when production $ SF.init storageApplicationKeyId storageApplicationKey
+      configuration ← CF.readConfiguration
       startWebSocketServer configuration
       startHttpServer configuration
 

src/Shared/Resource.purs

@@ -25,7 +25,7 @@ productionBasePath ∷ String
 productionBasePath = "https://static.mero.chat/file/"
 
 developmentBasePath ∷ String
-developmentBasePath = "/file/"
+developmentBasePath = "file/"
 
 uploadFolder ∷ String
 uploadFolder = "upload/"

src/Shared/Spec.purs

@@ -292,7 +292,7 @@ spec ∷
                                                 }
                                   }
                     , developmentFiles ∷
-                            GET "/client/<..path>"
+                            GET "/file/<..path>"
                                   { params ∷ { path ∷ List String }
                                   , response ∷ File
                                   }

webpack.development.config.js

@@ -2,6 +2,9 @@
 
 import path from 'path';
 import webpack from 'webpack';
+import MiniCssExtractPlugin from 'mini-css-extract-plugin';
+
+
 const isWatch = process.argv.some(a => a === '--watch');
 
 export default {
@@ -10,42 +13,45 @@ export default {
 
       entry: {
             im: {
-                  import: ['./loader/development/im.bundle.js'],
+                  import: ['./loader/development/im.bundle.js', './src/Client/css/im.css'],
                   dependOn: 'emoji'
             },
-            landing: ['./loader/development/landing.bundle.js'],
+            landing: ['./loader/development/landing.bundle.js', './src/Client/css/landing.css'],
             login: './loader/development/login.bundle.js',
             profile: {
-                  import: ['./loader/development/profile.bundle.js'],
+                  import: ['./loader/development/profile.bundle.js', './src/Client/css/profile.css'],
                   dependOn: 'im'
             },
             karmaPrivileges: {
-                  import: ['./loader/development/karmaPrivileges.bundle.js'],
+                  import: ['./loader/development/karmaPrivileges.bundle.js', './src/Client/css/karmaPrivileges.css'],
                   dependOn: 'im'
             },
-            help: ['./loader/development/help.bundle.js'],
+            help: ['./loader/development/help.bundle.js', './src/Client/css/help.css'],
             internalHelp: {
                   import: ['./loader/development/internalHelp.bundle.js'],
                   dependOn: 'im'
             },
             settings: {
-                  import: ['./loader/development/settings.bundle.js'],
+                  import: ['./loader/development/settings.bundle.js', './src/Client/css/settings.css'],
                   dependOn: 'im'
             },
             experiments: {
-                  import: ['./loader/development/experiments.bundle.js'],
+                  import: ['./loader/development/experiments.bundle.js', './src/Client/css/experiments.css'],
                   dependOn: 'im'
             },
             feedback: {
-                  import: ['./loader/development/feedback.bundle.js'],
+                  import: ['./loader/development/feedback.bundle.js',  './src/Client/css/feedback.css'],
                   dependOn: 'im'
             },
             recover: './loader/development/recover.bundle.js',
-            emoji: './output/Shared.Im.Emoji/index.js'
+            emoji: './output/Shared.Im.Emoji/index.js',
+            base: './src/Client/css/base.css',
+            external: './src/Client/css/external.css',
+            backer: './src/Client/css/backer.css'
       },
 
       output: {
-            path: path.resolve(".", './dist/development'),
+            path: path.resolve(".", './file/bundle'),
             filename: '[name].bundle.js'
       },
 
@@ -61,7 +67,19 @@ export default {
                               pscIde: true
                         }
                   }]
-            }]
+            },
+            {
+                  test: /\.css$/,
+                  use: [
+                      MiniCssExtractPlugin.loader,
+                      {
+                          loader: 'css-loader',
+                          options: {
+                              url: false,
+                          }
+                      }
+                  ]
+              }]
       },
 
       resolve: {
@@ -78,6 +96,9 @@ export default {
             minimize: false
       },
       plugins: [
+            new MiniCssExtractPlugin({
+                  filename: '[name].css',
+            }),
             new webpack.LoaderOptionsPlugin({
                   debug: true
             })

webpack.landing.config.js

@@ -15,7 +15,7 @@ export default {
         style: ['./src/Client/css/base.css', './src/Client/css/external.css', './src/Client/css/landing.css']
     },
     output: {
-        path: path.resolve('.', 'dist/production'),
+        path: path.resolve('.', 'file/bundle'),
         filename: '[name].[contenthash].bundle.js'
     },
     plugins: [
@@ -25,8 +25,8 @@ export default {
         new webpack.DefinePlugin({
             'process.env.PRODUCTION': true
         }),
-        new ReplaceHashPlugin({ files: [{ dir: 'dist/production', prefix: 'common' }, 'output-es/Shared.Resource/index.js'] }),
-        new InlineStylePlugin({ files: [{styleFile: 'dist/production/style.css', htmlFile: 'output-es/Server.Landing.Template/index.js'} ]})
+        new ReplaceHashPlugin({ files: [{ dir: 'file/bundle', prefix: 'common' }, 'output-es/Shared.Resource/index.js'] }),
+        new InlineStylePlugin({ files: [{styleFile: 'file/bundle/style.css', htmlFile: 'output-es/Server.Landing.Template/index.js'} ]})
     ],
     module: {
         rules: [

webpack.production.config.js

@@ -45,7 +45,7 @@ export default {
         backer: './src/Client/css/backer.css'
     },
     output: {
-        path: path.resolve(".", 'dist/production'),
+        path: path.resolve(".", 'file/bundle'),
         filename: '[name].[contenthash].bundle.js'
     },
     plugins: [
@@ -55,7 +55,7 @@ export default {
         new webpack.DefinePlugin({
             'process.env.PRODUCTION': true
         }),
-        new ReplaceHashPlugin({ files: [{ dir: 'dist/production', prefix: 'common' }, 'output-es/Shared.Resource/index.js'] }),
+        new ReplaceHashPlugin({ files: [{ dir: 'file/bundle', prefix: 'common' }, 'output-es/Shared.Resource/index.js'] }),
     ],
     module: {
         rules: [