Maptio / maptio

http://www.maptio.com
Other
23 stars 5 forks source link

Barriers to self-hosting #811

Open iexos opened 1 year ago

iexos commented 1 year ago

Hi, I tried Maptio and it looks great, very much like what we need for the self-organized community I am in. I would love to integrate Maptio into our self-hosted platform consisting of FOSS tools, though there are a few issues blocking that:

  1. Depends on other proprietary cloud services (Cloudinary, Auth0, maybe more?). There is no point in self-hosting if we still rely on external services.
  2. No easy self-hosting option, i.e. missing maintained docker image. Ideally with a sample docker-compose file to set the whole stack up.

Also the documentation could use some improvement, as you have stated in the readme already :) I could have opened seperate issues for this, but I would like to use this thread to discuss if you are actually interested in making changes for easy self-hosting and supporting the development of a FOSS community around this project. I'd be happy to hear about your feedback!

rgoj commented 1 year ago

Thank you for raising the issue, @iexos ! We've had a few requests around this since going open source already, but haven't been able to prioritise making Maptio easier to self-host so far - but the more votes we get on this, the easier it will be for us to do so, so thank you!

In my mind Maptio is only partially open source now - if you can't just easily run it locally with docker / simple instructions, can't do so without relying on external proprietary cloud services (the two biggest ones are Auth0 and Intercom), there are no guidelines for contributors, etc., then we're not fully open source yet.

We're small and there's so much we want to do! (I'm the only developer working on the project right now - I'm lucky to be paid to do so, but still there's only so much time!)

Our big hope with the open sourcing has been and still is that somebody might be able to step in with the resources to refactor away our dependencies on Auth0, Intercom, etc. We'd of course love to help, but haven't been able to take this on ourselves yet. We've had some discussions with people about this and @tomnixon, Maptio's founder, is actively looking for organisations that might be interested.

The second hope is that we become self-sustainable (i.e. from revenue from the hosted version of Maptio) and so can have more space to do all of the work necessary to make Maptio really feel like an open source product too. But for that we need to focus on functionality and features.

It's a tough balancing act, in other words. Apologies I couldn't reply with anything more, but I will raise this issue in our discussions of priorities and hopefully it'll be a contribution towards us committing time to this sooner rather than later, so thank you for opening it!

samuk commented 1 year ago

+1 for a Docker.

It could probably be hosted on https://recipes.coopcloud.tech/ then.

rgoj commented 1 year ago

+1 for a Docker.

Thanks for the vote, @samuk, the first steps are already here (thanks to @piotr-sikora-v): https://github.com/Maptio/maptio/pull/820

It could probably be hosted on https://recipes.coopcloud.tech/ then.

Nice, thank you!

mohb-ellakani98 commented 1 year ago

Hi everyone, I was trying to install maptio and I was following the instructions and when I run npm start I get many warnings regarding circular dependencies such as these :

(node:25753) Warning: Accessing non-existent property 'findOne' of module exports inside circular dependency (node:25753) Warning: Accessing non-existent property 'remove' of module exports inside circular dependency (node:25753) Warning: Accessing non-existent property 'updateOne' of module exports inside circular dependency

And if I try to access this URL : http://localhost:4200 I get nothing and if I access http://localhost:3000 which is the one that I get in the terminal it tells me cannot /GET

Does anyone have an idea on how to fix this.

Thank you.

rgoj commented 1 year ago

Hi @mohb-ellakani98 , thank you for your interest in Maptio and for trying to set it up locally!

As mentioned above, sadly we just don't have the resources at the moment to spend the time on clearing the obstacles to setting Maptio up locally, to remove dependencies on Auth0, Intercom, etc. Sadly! One day hopefully we'll get to that place to be able to prioritise this. Or, hopefully, someone in the community manages to! The wonderful folks from https://ftdl.pl/ are trying to help with this, but it is a large, time-consuming task!

Meanwhile, to answer your questions directly:

  1. Re. the sad flood of warnings about circular dependencies - I need to tackle those one day, but they shouldn't prevent Maptio from working for you locally.
  2. Re. the other issues - I haven't set up Maptio completely from scratch in a very long time, so I can't say for sure. My best bet would be that you don't have the required keys for external dependencies in a .env file? (i.e. a copy of the sample file added in #824). For this you'll need to set up accounts with Auth0 and Intercom, likely others. Have you tried that?
mohb-ellakani98 commented 1 year ago

Hi @rgoj As for the circular dependencies they can be easily ignored and don't stop the execution of the code as for the .env file I have created it and created an account on Auth0 and Intercom and have added the needed keys but I still got the same error

rgoj commented 1 year ago

@mohb-ellakani98 Ah, brilliant that you've gone as far as handling the Auth0 and Intercom keys! (Though, obviously, not so brilliant that you had to do that in the first place, sorry for that...)

Perhaps you could post the full output of running npm start? Better yet, please run the server and the front-end app separately with nx serve maptio-server and nx serve maptio and post the outputs here.

Also, if you are running into a localisation issue when serving the front-end app, set localize to false in angular.json. I'll push a PR with that fix for this misconfiguration in a moment, I've been meaning to do this for a long time, so thanks for the nudge!

mohb-ellakani98 commented 1 year ago

I'll give you the outputs to all three so that you can have a better look at these problems and maybe this insight might be helpful for you.

npm start :

$ npm start

> maptio@2.0.0 start
> nx run-many --target=serve --projects=maptio,maptio-server --parallel

 >  NX   Running target serve for 2 projects:

    - maptio
    - maptio-server

 —————————————————————————————————————————————————————————

> nx run maptio:serve

> nx run maptio-server:serve

assets by path assets/templates/*.liquid 19.6 KiB
  asset assets/templates/invitation-email.liquid 19.2 KiB [emitted] [from: src/assets/templates/invitation-email.liquid] [copied]
  asset assets/templates/invitation-subject.liquid 353 bytes [emitted] [from: src/assets/templates/invitation-subject.liquid] [copied]
asset assets/templates/maps/demo.json 46.7 KiB [emitted] [from: src/assets/templates/maps/demo.json] [copied]
asset main.js 43 KiB [emitted] (name: main) 1 related asset
cacheable modules 36.4 KiB
  modules by path ./src/routes/ 23.6 KiB
    ./src/routes/datasets.js 2.78 KiB [built] [code generated]
    ./src/routes/embeddable-datasets.js 1.25 KiB [built] [code generated]
    ./src/routes/users.js 4.31 KiB [built] [code generated]
    + 8 modules
  modules by path ./src/i18n/*.ts 1.86 KiB
    ./src/i18n/get-locale-from-path.ts 427 bytes [built] [code generated]
    ./src/i18n/get-closest-supported-locale.ts 1.44 KiB [built] [code generated]
  modules by path ./src/auth/*.ts 1.06 KiB
    ./src/auth/management-client.ts 756 bytes [built] [code generated]
    ./src/auth/config.ts 327 bytes [built] [code generated]
  ./src/main.ts 9.47 KiB [built] [code generated]
  ./src/environments/environment.ts 363 bytes [built] [code generated]
+ 22 modules
webpack 5.75.0 compiled successfully in 608 ms
Debugger listening on ws://localhost:9229/7d96cfed-a3a5-4caf-aae6-7d98bcdfd687
Debugger listening on ws://localhost:9229/7d96cfed-a3a5-4caf-aae6-7d98bcdfd687
For help, see: https://nodejs.org/en/docs/inspector
Type-checking in progress...
⠋ Generating browser application bundles (phase: setup)...
 >  NX   The development server only supports localizing a single locale per build.

   Pass --verbose to see the stacktrace.

(node:68267) Warning: Accessing non-existent property 'count' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
(node:68267) Warning: Accessing non-existent property 'findOne' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'remove' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'updateOne' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'Symbol(Symbol.toStringTag)' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'length' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'config' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'utils' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'uploader' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'api' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'PreloadedFile' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'url' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'image' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'video' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'cloudinary_js_config' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'CF_SHARED_CDN' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'AKAMAI_SHARED_CDN' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'SHARED_CDN' of module exports inside circular dependency
(node:68267) Warning: Accessing non-existent property 'BLANK' of module exports inside circular dependency
==> 🌎 Listening on port 3000. Open up http://localhost:3000/ in your browser.
No errors found.

nx server maptio-server: I modified the run command to use npx

$ npx serve maptio-server
Need to install the following packages:
  serve@14.2.1
Ok to proceed? (y) y

   ┌────────────────────────────────────────────┐
   │                                            │
   │   Serving!                                 │
   │                                            │
   │   - Local:    http://localhost:3000        │
   │   - Network:  http://10.199.226.127:3000   │
   │                                            │
   │   Copied local address to clipboard!       │
   │                                            │
   └────────────────────────────────────────────┘

 HTTP  9/6/2023 3:54:49 PM ::1 GET /
 HTTP  9/6/2023 3:54:49 PM ::1 Returned 404 in 13 ms
 HTTP  9/6/2023 3:54:49 PM ::1 GET /favicon.ico
 HTTP  9/6/2023 3:54:49 PM ::1 Returned 404 in 2 ms
 HTTP  9/6/2023 3:54:51 PM ::1 GET /
 HTTP  9/6/2023 3:54:51 PM ::1 Returned 404 in 2 ms

nx server maptio: Also here I modified it to use npx

$ npx serve maptio

   ┌────────────────────────────────────────────┐
   │                                            │
   │   Serving!                                 │
   │                                            │
   │   - Local:    http://localhost:3000        │
   │   - Network:  http://10.199.226.127:3000   │
   │                                            │
   │   Copied local address to clipboard!       │
   │                                            │
   └────────────────────────────────────────────┘

 HTTP  9/6/2023 3:56:06 PM ::1 GET /
 HTTP  9/6/2023 3:56:06 PM ::1 Returned 404 in 10 ms

Hope that modifying the command to npx is not an issue and that these results can help you and me.

rgoj commented 1 year ago

Brilliant, thanks @mohb-ellakani98 ! (By the way, I took the liberty of editing your post with some markdown to make the output easier to distinguish from your words.)

So, the issue is indeed localisation-related. The hint is here in the output of npm start:

 >  NX   The development server only supports localizing a single locale per build.

Please pull from master to get the changes from #834 and try again, hopefully that should help!

Hope that modifying the command to npx is not an issue and that these results can help you and me.

Those commands do require nx rather than npx. We use Nx for monorepo scaffolding and to get some good, modern defaults for Angular development, hence the need for using the nx command. You can run it with npx nx too if you don't have it installed locally. In hindsight, that's the command I should've given you.

Still, the output of npm start was enough to diagnose the error, so thanks for that! It seems that the server is starting up correctly too, which is great. Now, let's hope the front-end app starts up too and let's see what happens when the two start communicating!

mohb-ellakani98 commented 1 year ago

Ok so I did a pull from the master branch and indeed now the website runs at least as a home page but I face 2 new problems.

1- npx nx serve maptio-server and npm start both need port 3000 to work so if you could point me to where to change one or the other.

2- npx nx server maptio --verbose

 >  NX   Cannot find configuration for task maptio:server

Error: Cannot find configuration for task maptio:server
    at ProcessTasks.createTask (/home/ellakani/Documents/maptio/node_modules/nx/src/tasks-runner/create-task-graph.js:101:19)
    at ProcessTasks.processTasks (/home/ellakani/Documents/maptio/node_modules/nx/src/tasks-runner/create-task-graph.js:21:39)
    at createTaskGraph (/home/ellakani/Documents/maptio/node_modules/nx/src/tasks-runner/create-task-graph.js:136:21)
    at /home/ellakani/Documents/maptio/node_modules/nx/src/tasks-runner/run-command.js:83:71
    at Generator.next (<anonymous>)
    at /home/ellakani/Documents/maptio/node_modules/tslib/tslib.js:117:75
    at new Promise (<anonymous>)
    at Object.__awaiter (/home/ellakani/Documents/maptio/node_modules/tslib/tslib.js:113:16)
    at /home/ellakani/Documents/maptio/node_modules/nx/src/tasks-runner/run-command.js:79:114
    at /home/ellakani/Documents/maptio/node_modules/nx/src/utils/params.js:10:26

Hope these can help and maybe my inquiries help other developers in running maptio locally

mohb-ellakani98 commented 1 year ago

Another issue I just encountered is that the page that is loaded disappears and shows for a second when refreshing but it does not remain.

mohb-ellakani98 commented 1 year ago

This is the error that gets generated :

Error: connect ECONNREFUSED 127.0.0.1:80
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1278:16)
rgoj commented 1 year ago

Ok so I did a pull from the master branch and indeed now the website runs at least

Brilliant! Well done getting to this point!

npx nx serve maptio-server and npm start both need port 3000 to work so if you could point me to where to change one or the other.

npm start is configured to run both the server and the front-end app. You can see this in the package.json file where that command is defined:

(...)
"start": "nx run-many --target=serve --projects=maptio,maptio-server --parallel", 
(...)

You can run the backend and the front-end separately, if you choose, by running npx nx serve maptio and npx nx serve maptio-server (which is sometimes useful for debugging errors, etc.) but you don't need to run all three at once. Does that help?

npx nx server maptio --verbose

The issue here is a typo - the Nx commad is serve not server, i.e. the full command should be npx nx serve maptio --verbose

If you simply run just npm start without running the other commands, does that help? What errors are you seeing then?

Hope these can help and maybe my inquiries help other developers in running maptio locally

Totally! Thank you for persevering with trying to get it running locally, we appreciate the effort that requires currently!

mohb-ellakani98 commented 1 year ago

As usual it's my bad sorry for the typo. Other than that when I run npm start I get this output. It's a little long but it's the complete output so that you can see as if you were running it from my laptop. The problems remains the same the webpage at localhost:4200 remains empty and shows a glimpse of the webpage only when refreshing.

By inspecting the webpage I found this error in the console :

ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading 'navigateByUrl')
TypeError: Cannot read properties of undefined (reading 'navigateByUrl')
    at CatchSubscriber.handleLoginError [as selector] (user.service.ts:243:17)
    at CatchSubscriber.error (catchError.js:27:31)
    at TapSubscriber._error (tap.js:56:26)
    at TapSubscriber.error (Subscriber.js:55:18)
    at MergeMapSubscriber._error (Subscriber.js:75:26)
    at MergeMapSubscriber.error (Subscriber.js:55:18)
    at WithLatestFromSubscriber._error (Subscriber.js:75:26)
    at WithLatestFromSubscriber.error (Subscriber.js:55:18)
    at MergeMapSubscriber.notifyError (innerSubscribe.js:45:26)
    at SimpleInnerSubscriber._error (innerSubscribe.js:13:21)
    at resolvePromise (zone.js:1211:31)
    at resolvePromise (zone.js:1165:17)
    at zone.js:1278:17
    at _ZoneDelegate.invokeTask (zone.js:406:31)
    at core.mjs:23999:55
    at AsyncStackTaggingZoneSpec.onInvokeTask (core.mjs:23999:36)
    at _ZoneDelegate.invokeTask (zone.js:405:60)
    at Object.onInvokeTask (core.mjs:24300:33)
    at _ZoneDelegate.invokeTask (zone.js:405:60)
    at Zone.runTask (zone.js:178:47) 

This is the output from running npm start

> maptio@2.0.0 start
> nx run-many --target=serve --projects=maptio,maptio-server --parallel

 >  NX   Running target serve for 2 projects:

    - maptio
    - maptio-server

 ———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

> nx run maptio:serve

> nx run maptio-server:serve

⠋ Generating browser application bundles (phase: setup)...assets by path assets/templates/*.liquid 19.6 KiB
  asset assets/templates/invitation-email.liquid 19.2 KiB [emitted] [from: src/assets/templates/invitation-email.liquid] [copied]
  asset assets/templates/invitation-subject.liquid 353 bytes [emitted] [from: src/assets/templates/invitation-subject.liquid] [copied]
asset assets/templates/maps/demo.json 46.7 KiB [emitted] [from: src/assets/templates/maps/demo.json] [copied]
asset main.js 43 KiB [emitted] (name: main) 1 related asset
cacheable modules 36.4 KiB
  modules by path ./src/routes/ 23.6 KiB
    ./src/routes/datasets.js 2.78 KiB [built] [code generated]
    ./src/routes/embeddable-datasets.js 1.25 KiB [built] [code generated]
    ./src/routes/users.js 4.31 KiB [built] [code generated]
    + 8 modules
  modules by path ./src/i18n/*.ts 1.86 KiB
    ./src/i18n/get-locale-from-path.ts 427 bytes [built] [code generated]
    ./src/i18n/get-closest-supported-locale.ts 1.44 KiB [built] [code generated]
  modules by path ./src/auth/*.ts 1.06 KiB
    ./src/auth/management-client.ts 756 bytes [built] [code generated]
    ./src/auth/config.ts 327 bytes [built] [code generated]
  ./src/main.ts 9.47 KiB [built] [code generated]
  ./src/environments/environment.ts 363 bytes [built] [code generated]
+ 22 modules
webpack 5.75.0 compiled successfully in 596 ms
Debugger listening on ws://localhost:9229/dbf0a7e5-16d2-4290-a327-6f38cdaa5377
Debugger listening on ws://localhost:9229/dbf0a7e5-16d2-4290-a327-6f38cdaa5377
For help, see: https://nodejs.org/en/docs/inspector
Type-checking in progress...
⠙ Generating browser application bundles (phase: setup)...(node:79968) Warning: Accessing non-existent property 'count' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
(node:79968) Warning: Accessing non-existent property 'findOne' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'remove' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'updateOne' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'Symbol(Symbol.toStringTag)' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'length' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'config' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'utils' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'uploader' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'api' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'PreloadedFile' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'url' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'image' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'video' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'cloudinary_js_config' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'CF_SHARED_CDN' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'AKAMAI_SHARED_CDN' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'SHARED_CDN' of module exports inside circular dependency
(node:79968) Warning: Accessing non-existent property 'BLANK' of module exports inside circular dependency
==> 🌎 Listening on port 3000. Open up http://localhost:3000/ in your browser.
No errors found.
✔ Browser application bundle generation complete.

Initial Chunk Files                                                                                     | Names                              |   Raw Size
vendor.js                                                                                               | vendor                             |    8.35 MB | 
polyfills.js                                                                                            | polyfills                          |  646.61 kB | 
main.js                                                                                                 | main                               |  574.79 kB | 
styles.css, styles.js                                                                                   | styles                             |  568.58 kB | 
scripts.js                                                                                              | scripts                            |  364.57 kB | 
runtime.js                                                                                              | runtime                            |   13.84 kB | 

                                                                                                        | Initial Total                      |   10.47 MB

Lazy Chunk Files                                                                                        | Names                              |   Raw Size
apps_maptio_src_app_modules_workspace_workspace_module_ts.js                                            | modules-workspace-workspace-module |    1.66 MB | 
default-apps_maptio_src_app_modules_circle-map_circle-map_module_ts.js                                  | modules-workspace-workspace-module | 1000.89 kB | 
apps_maptio_src_app_modules_team_team_module_ts.js                                                      | modules-team-team-module           |  233.59 kB | 
default-apps_maptio_src_app_shared_create-map_module_ts-apps_maptio_src_app_shared_create-tea-65c747.js | modules-home-home-module           |  108.81 kB | 
apps_maptio_src_app_modules_home_home_module_ts.js                                                      | modules-home-home-module           |   73.42 kB | 
default-apps_maptio_src_app_modules_payment_payment_module_ts.js                                        | modules-team-team-module           |   53.19 kB | 
default-node_modules_lodash-es_cloneDeep_js.js                                                          | modules-home-home-module           |   50.08 kB | 
apps_maptio_src_app_modules_embed_embed_module_ts.js                                                    | modules-embed-embed-module         |   19.31 kB | 
apps_maptio_src_app_modules_help_help_module_ts.js                                                      | modules-help-help-module           |   11.96 kB | 
apps_maptio_src_app_modules_legal_legal_module_ts.js                                                    | modules-legal-legal-module         |    96m7.27 kB | 
common.js                                                                                               | common                             |    1.87 kB | 

Build at: 2023-09-06T14:48:43.416Z - Hash: ad729e6c3226007a - Time: 10489ms

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/modules/workspace/services/ui.service.ts depends on 'screenfull'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/shared/components/cards/map/map-card.component.ts depends on 'file-saver'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/shared/components/onboarding/onboarding.component.ts depends on 'lodash'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/shared/image.module.ts depends on 'cloudinary-core'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/shared/model/initiative.data.ts depends on 'slug'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/shared/services/user/user.service.ts depends on 'angular2-uuid/index'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/node_modules/@circlon/angular-tree-component/fesm2015/circlon-angular-tree-component.js depends on 'mobx'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/ellakani/Documents/maptio/node_modules/@openreplay/tracker/lib/modules/exception.js depends on 'error-stack-parser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

✔ Compiled successfully.
✔ Browser application bundle generation complete.

Initial Chunk Files | Names   | Raw Size
runtime.js          | runtime | 13.84 kB | 

16 unchanged chunks

Build at: 2023-09-06T14:48:46.152Z - Hash: 64f4b5c5b53c3bd7 - Time: 2427ms

Warning: /home/ellakani/Documents/maptio/apps/maptio/src/app/shared/model/user.data.ts depends on 'slug'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

✔ Compiled successfully.
Error: connect ECONNREFUSED 127.0.0.1:80
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1278:16)
Error: connect ECONNREFUSED 127.0.0.1:80
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1278:16)
rgoj commented 12 months ago

~Hmm, I can't seem to figure out what could be going wrong, sadly! It does seem to be related to login errors, suggesting a possible Auth0 misconfiguration... but I have a very low degree of confidence in that guess! The content of the browser console error (this.router not being defined in user.service) is odd. Is that the only error in the console? That call to this.router is preceded by console.error(error) in the handleLoginError method, so I'd have expected another error to be in the console before the call this.router failed). And I'm not sure why that could would even be running in the first place since you haven't had the chance to attempt to log in via the app.~

~Certainly there's some failure of communication - the ECONNREFUSED error - but where exactly, I don't have any good ideas yet.~

~I'd suggest we jump on a call (booking link in reply to your support request), I'm not that good at async debugging and on a call we can try a lot of things a lot more quickly!~

Right. As I was writing all of the above (still worth reading, so keeping it here), I found a way to at least reproduce the Cannot read properties of undefined (reading 'navigateByUrl') error and so fixed that one at least (see #835). Please pull from master and try again. You should still see an error in the browser, but this time it should be clearer what the real error is. Hopefully. I still think it'd be faster to try debugging on a call (and then posting results here, obviously) - I suspect we'll need to look at what's in your .env exactly eventually, which it's probably best not to post here - but I'm happy to at least try to continue this way and see how far we get. In any case, thanks for your efforts, it's helping identify and fix problems others will be / are running into!

mohb-ellakani98 commented 12 months ago

Hi @rgoj ,

Thank you so much I made a pull request and indeed this fixed the page from not showing any content but as always with development new errors have emerged now when I try to login with Google or with my email and password or create a new account so simply try and login to use the software locally I get a login error page that says this :

A login error occurred
Despite our best efforts, things will sometimes break, but we are always happy to help get you back on track.
Chat with us or email us at support@maptio.com if the issue persists.

In the console I get this error :

GET http://localhost:4200/api/v1/user/google-oauth2%7C110520379052413084757 500 (Internal Server Error)

And in the terminal I get this error :

Error: connect ECONNREFUSED 127.0.0.1:80
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1278:16)

I don't have any problem in jumping in a meeting but during the week I am not free to do so, so if in the weekend you are free I would be more than happy to jump in a meeting with you and try and solve this issue.

rgoj commented 12 months ago

Brilliant that we're getting to the real errors now! (And not just stumbling on the bugs I wrote!)

Hmm. Thinking out loud here. That GET request to Maptio's API is for information about your user based on your Google OAuth ID. You seem to be getting a 500 response from the server to this request, I'm assuming that's due to the ECONNREFUSED error happening server-side.

Hmm. Will be interesting to find out what's causing this!

The one thing that comes to mind at this point that we haven't looked at yet would be - are you seeing successful connections to your local MongoDB instance? That request to http://localhost:4200/api/v1/user/... should trigger a query from the server to the DB, so, if everything is going alright, you should be able to see that happening if you're also looking at MongoDB logs. Can you see anything helpful there? Any errors even before you try to log in? Then, as you start the login process, can you see any new log entries? If so, anything interesting in those entries? If not, that tells us that the server can't communicate with the database (or, alternatively, is not even reaching that point, though it does appear to be trying to communicate with something judging by the ECONNREFUSED errors!).

Another thing that you could try is to debug the server-side code - just console.log your way into more information about what might be happening in this (I think) bit of code: https://github.com/Maptio/maptio/blob/master/apps/maptio-server/src/routes/users.js#L67

I don't have any problem in jumping in a meeting but during the week I am not free to do so, so if in the weekend you are free I would be more than happy to jump in a meeting with you and try and solve this issue.

Cool, that makes sense. I've added some availability to that calendly link I sent you via the support channel on Sunday afternoon - if you can't make any of those times, let me know what might work better for you and I'll see if I can't make that!

rgoj commented 12 months ago

Thanks for the call earlier today, @mohb-ellakani98 !

I'll write up where we got to for anyone who might be reading this and also for my future self. TL;DR: The problem is not yet fixed, but we've gone through a few more steps, so it's worthing noting these!

  1. Firstly, when you set up an Auth0 account, it's worth going through the Auth0 documentation to get everything set up in Maptio: https://auth0.com/docs/quickstart/spa/angular/01-login (the instructions for Maptio will be slightly different, we need to write those up, but this can give you a sense of what's needed)
  2. You will need to create two applications for your Auth0 tenant - one for the front-end code and one for the backend code. The latter will be an API application.
  3. The front-end application needs to be of the "Single Page Application" type.
  4. You will need to change auth.domain as well as clientId inside of environment.ts to the values you find in the settings for your front-end Auth0 application.
  5. You will also need to set the following (in those same settings):
    
    Allowed Callback URLs
    http://localhost:4200/login, http://localhost:3000/login

Allowed Logout URLs http://localhost:4200/logout, http://localhost:3000/logout

Allowed Web Origin http://localhost:4200, http://localhost:3000


6. In the API application for Auth0, you will need to set the identifier to `http://localhost:4200/api/v1`
7. Then, you will need to add an `api` permission in the Permissions tab.

We need a more comprehensive write-up, I think. And, of course, ideally, a way to run the app locally without Auth0 - or with an already set up instance of an open source solution via Docker. For now, I hope this helps, or, possibly serves as a good starting point for others.

With all of the above, we got to Auth0 working correctly... but when you're returned to the application, we still saw 500 errors on login, so still need to dig in deeper beyond what we've got to here!
rgoj commented 11 months ago

@mohb-ellakani98 I want to follow up on that last message.

The takeaway was that we need to write up on our end how to set up Auth0. Tom and I have discussed this and we concluded that we won't be able to do it just now. At this stage the plan is that once we ship the current piece of work - a refreshed outliner - which we should do very soon, the next 2-3 weeks, I hope - then I might take some time to write this up.

Meanwhile, I've also created a new "Maptio Community" Slack channel for easier sync conversations when needed (although github issues / discussions are probably still the best place for most conversations as everything is then easier to find for others) - @mohb-ellakani98 I'll invite you there (and also everyone else reading this is welcome too!). We don't have big ambitions for this yet (we'd love to support a vibrant community, but don't have the resources to facilitate that at this stage), so I imagine it'll be quiet for the most part, but it's there as a comms tool if needed!

VincentSC commented 7 months ago

I think I can get this working with Keycloak, so that removes auth0-dependency.

One thing I find difficult is what exactly in the .env must be filled.

Where does this error come from? Error: ENOENT: no such file or directory, open '/app/dist/apps/maptio-server/assets/id_rsa' I just created SSH-keys in apps/maptio-server/src/assets without password, and did a mv id_rsa.pub rsa.pub to comply with the naming convention used in the app. It seems to work...

Where exactly is intercom used for? Only for pushing messages to apps? Can this functionality easily be turned off?

rgoj commented 7 months ago

I think I can get this working with Keycloak, so that removes auth0-dependency.

That would be so cool, thank you! 🤩

One thing I find difficult is what exactly in the .env must be filled.

Yes... I'm just working on an update to the README that should be out by Wednesday. Mainly to allow people to set up their own Auth0 tenant (might be relevant for you too if you'd like to go down the route of first setting everything up with Auth0 & Intercom).

Where does this error come from? Error: ENOENT: no such file or directory, open '/app/dist/apps/maptio-server/assets/id_rsa' I just created SSH-keys in apps/maptio-server/src/assets without password, and did a mv id_rsa.pub rsa.pub to comply with the naming convention used in the app. It seems to work...

Good point, I'm pretty sure we can remove all the code around this - one of the many tech debty things I never get the chance to do! It's basically old auth code we don't rely on anymore (unless I'm mistaken, will be certain when I trace everything and get the app working without the code).

Where exactly is intercom used for? Only for pushing messages to apps? Can this functionality easily be turned off?

Sadly, we do store information about organisation accounts in Intercom... part of the initial design of Maptio - to use external services to get to a working prototype as fast as possible. Something that worked well initially, but we're working on refactoring now. The relevant issue is here for a bit more context: #615 There's no easy switch to just turn this off, but this should be easier than all the auth work to remove the Auth0 dependency.

Thanks again for giving Maptio a spin, hugely appreciated!

(Sorry for editing your post - went in there to copy your text for replies and enthusiastically started editing that instead of pasting into a new post. Definitely excited about any interest in Maptio obviously! 😅)

VincentSC commented 7 months ago

Thanks for the quick reply!

Auth0 has a rather clean implementation of oAuth2, so I seriously think it's not a big thing to do. If Keycloak works, then any oAuth2-provider will work.

And if Intercom removal (and thus rewriting all the code to use the DB) is easier than then Auth0-dependency, w'll have it all going by February :)

But... my guess it's really better for me to wait for issue 615 to finish, before moving further. I want to focus on things I know....

Another dependency is on Slack, and this can be replaced by Mattermost. This is not so difficult to do, and hopefully triggers others to support other popular chat-systems.

rgoj commented 7 months ago

Auth0 has a rather clean implementation of oAuth2, so I seriously think it's not a big thing to do. If Keycloak works, then any oAuth2-provider will work.

And if Intercom removal (and thus rewriting all the code to use the DB) is easier than then Auth0-dependency, w'll have it all going by February :)

But... my guess it's really better for me to wait for issue 615 to finish, before moving further. I want to focus on things I know....

I think Tom already got in touch about scheduling a call, it'd be cool to talk this through. We've not currently scheduled the intercom work, but knowing someone's up for creating a branch with an open source auth solution would definitely help us move priorities up.

Another dependency is on Slack, and this can be replaced by Mattermost. This is not so difficult to do, and hopefully triggers others to support other popular chat-systems.

We don't actually depend on Slack in any way, that's old code hanging around from old functionality we offered years ago, before my time - now removed from master - thanks for the prompts to do a bit of cleaning up!

rgoj commented 7 months ago

A small update on our side, we've just added some instructions for setting up an Auth0 tenant (see changes in #867), with configs that can be imported using the Auth0 CLI tooling and a bit of documentation in the README. Very far from perfect, but, hopefully, a small step forward!