diff --git a/config/dev.exs b/config/dev.exs index d7a28a2ac..c604f378a 100644 --- a/config/dev.exs +++ b/config/dev.exs @@ -15,13 +15,7 @@ config :mobilizon, Mobilizon.Web.Endpoint, check_origin: false, watchers: [ node: [ - "node_modules/webpack/bin/webpack.js", - "--mode", - "development", - "--watch", - "--watch-options-stdin", - "--config", - "node_modules/@vue/cli-service/webpack.config.js", + "node_modules/.bin/vite", cd: Path.expand("../js", __DIR__) ] ] diff --git a/js/package.json b/js/package.json index f372ecb51..25461948c 100644 --- a/js/package.json +++ b/js/package.json @@ -3,12 +3,13 @@ "version": "2.0.0-beta.2", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "dev": "tsc --noEmit && vite", + "serve": "vite preview", "build": "yarn run build:assets && yarn run build:pictures", "test:unit": "LANG=en_US.UTF-8 LANGUAGE=en_US:en LC_ALL=en_US.UTF-8 TZ=UTC vue-cli-service test:unit", "test:e2e": "vue-cli-service test:e2e", "lint": "vue-cli-service lint", - "build:assets": "vue-cli-service build", + "build:assets": "vite build", "build:pictures": "bash ./scripts/build/pictures.sh" }, "dependencies": { @@ -18,6 +19,7 @@ "@mdi/font": "^6.1.95", "@oruga-ui/oruga-next": "^0.4.7", "@oruga-ui/theme-bulma": "^0.1.3", + "@popperjs/core": "^2.10.2", "@tiptap/core": "^2.0.0-beta.41", "@tiptap/extension-blockquote": "^2.0.0-beta.6", "@tiptap/extension-bubble-menu": "^2.0.0-beta.9", @@ -31,13 +33,16 @@ "@tiptap/extension-underline": "^2.0.0-beta.7", "@tiptap/starter-kit": "^2.0.0-beta.37", "@tiptap/vue-3": "^2.0.0-beta.81", + "@variantjs/core": "^0.0.78", + "@variantjs/vue": "^0.0.12", "@vue-a11y/announcer": "^3.1.5", "@vue-a11y/skip-to": "^3.0.3", "@vue-leaflet/vue-leaflet": "^0.6.1", "@vue/apollo-composable": "^4.0.0-alpha.15", - "@vue/apollo-option": "^4.0.0-alpha.15", "apollo-absinthe-upload-link": "^1.5.0", "blurhash": "^1.1.3", + "body-scroll-lock": "^4.0.0-beta.0", + "bulma": "^0.9.3", "bulma-divider": "^0.2.0", "core-js": "^3.6.4", "date-fns": "^2.16.0", @@ -67,11 +72,14 @@ "vuedraggable": "^2.24.3" }, "devDependencies": { + "@originjs/vite-plugin-commonjs": "^1.0.1", + "@rollup/plugin-dynamic-import-vars": "^1.4.1", "@types/jest": "^27.0.2", "@types/leaflet": "^1.5.2", "@types/leaflet.locatecontrol": "^0.60.7", "@types/lodash": "^4.14.141", "@types/ngeohash": "^0.6.2", + "@types/node": "^16.11.7", "@types/phoenix": "^1.5.2", "@types/prosemirror-inputrules": "^1.0.2", "@types/prosemirror-model": "^1.7.2", @@ -80,18 +88,12 @@ "@types/sanitize-html": "^2.5.0", "@typescript-eslint/eslint-plugin": "^5.3.0", "@typescript-eslint/parser": "^5.3.0", - "@vue/cli-plugin-babel": "~5.0.0-rc.1", - "@vue/cli-plugin-e2e-cypress": "~5.0.0-rc.1", - "@vue/cli-plugin-eslint": "~5.0.0-rc.1", - "@vue/cli-plugin-pwa": "~5.0.0-rc.1", - "@vue/cli-plugin-router": "~5.0.0-rc.1", - "@vue/cli-plugin-typescript": "~5.0.0-rc.1", - "@vue/cli-plugin-unit-jest": "~5.0.0-rc.1", - "@vue/cli-service": "~5.0.0-rc.1", + "@vitejs/plugin-vue": "^1.9.4", "@vue/compiler-sfc": "^3.1.0", "@vue/eslint-config-typescript": "^9.0.0", "@vue/test-utils": "^2.0.0-rc.16", "@vue/vue3-jest": "^27.0.0-alpha.3", + "autoprefixer": "^10.4.0", "babel-core": "^7.0.0-bridge.0", "cypress": "^8.3.0", "eslint": "^8.2.0", @@ -104,12 +106,17 @@ "jest": "^27.1.0", "jest-junit": "^13.0.0", "mock-apollo-client": "^1.1.0", + "postcss": "^8.3.11", "prettier": "^2.2.1", "prettier-eslint": "^13.0.0", - "sass": "^1.34.1", + "sass": "^1.43.4", "sass-loader": "^12.0.0", + "tailwindcss": "^2.2.19", "ts-jest": "27", - "typescript": "~4.4.3", + "typescript": "^4.5.2", + "vite": "^2.6.14", + "vite-plugin-html": "^2.1.1", + "vite-plugin-pwa": "^0.11.5", "vue-i18n-extract": "^2.0.4", "webpack-cli": "^4.7.0" } diff --git a/js/postcss.config.js b/js/postcss.config.js new file mode 100644 index 000000000..33ad091d2 --- /dev/null +++ b/js/postcss.config.js @@ -0,0 +1,6 @@ +module.exports = { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +} diff --git a/js/public/img/pics/error-1024w.jpg b/js/public/img/pics/error-1024w.jpg new file mode 100644 index 000000000..7bd18d727 Binary files /dev/null and b/js/public/img/pics/error-1024w.jpg differ diff --git a/js/public/img/pics/error-1024w.webp b/js/public/img/pics/error-1024w.webp new file mode 100644 index 000000000..73e1c81af Binary files /dev/null and b/js/public/img/pics/error-1024w.webp differ diff --git a/js/public/img/pics/error-480w.jpg b/js/public/img/pics/error-480w.jpg new file mode 100644 index 000000000..e9bd361e3 Binary files /dev/null and b/js/public/img/pics/error-480w.jpg differ diff --git a/js/public/img/pics/error-480w.webp b/js/public/img/pics/error-480w.webp new file mode 100644 index 000000000..96c65c3af Binary files /dev/null and b/js/public/img/pics/error-480w.webp differ diff --git a/js/public/index.html b/js/public/index.html index 083951877..300221b58 100644 --- a/js/public/index.html +++ b/js/public/index.html @@ -1,22 +1,25 @@ - - - - - - - - - +
+ + + + \ No newline at end of file diff --git a/js/src/App.vue b/js/src/App.vue index 8ac0af5b1..dbc8fb4a3 100644 --- a/js/src/App.vue +++ b/js/src/App.vue @@ -26,7 +26,7 @@
- +
@@ -53,7 +53,12 @@ import { ICurrentUser } from "./types/current-user.model"; import jwt_decode, { JwtPayload } from "jwt-decode"; import { refreshAccessToken } from "./apollo/utils"; import { defineComponent, ref } from "vue"; -import { useMutation, useQuery, useResult } from "@vue/apollo-composable"; +import { + useApolloClient, + useMutation, + useQuery, + useResult, +} from "@vue/apollo-composable"; import { RouterView } from "vue-router"; import { useAnnouncer } from "@vue-a11y/announcer"; import { useMeta } from "vue-meta"; @@ -76,6 +81,8 @@ export default defineComponent({ useMeta({ titleTemplate: "%s | Mobilizon" }); + const { resolveClient } = useApolloClient(); + return { config, currentUser, @@ -83,6 +90,7 @@ export default defineComponent({ online: false, interval, routerView, + resolveClient, }; }, components: { @@ -91,11 +99,6 @@ export default defineComponent({ import(/* webpackChunkName: "editor" */ "./components/Error.vue"), "mobilizon-footer": Footer, }, - async created(): Promise { - if (await this.initializeCurrentUser()) { - await initializeCurrentActor(this.$apollo.provider.defaultClient); - } - }, methods: { async initializeCurrentUser(): Promise { const userId = localStorage.getItem(AUTH_USER_ID); @@ -145,7 +148,10 @@ export default defineComponent({ return document.title; }, }, - mounted(): void { + async mounted(): Promise { + if (await this.initializeCurrentUser()) { + await initializeCurrentActor(this.resolveClient()); + } this.online = window.navigator.onLine; window.addEventListener("offline", () => { this.online = false; @@ -192,7 +198,7 @@ export default defineComponent({ token?.exp !== undefined && new Date(token.exp * 1000 - 60000) < new Date() ) { - refreshAccessToken(this.$apollo.getClient()); + refreshAccessToken(this.resolveClient()); } } }, 60000); @@ -237,7 +243,7 @@ export default defineComponent({ /* Icons */ $mdi-font-path: "~@mdi/font/fonts"; -@import "~@mdi/font/scss/materialdesignicons"; +@import "../node_modules/@mdi/font/scss/materialdesignicons"; @import "common"; #mobilizon { diff --git a/js/src/common.scss b/js/src/common.scss index 65301b01b..378399596 100644 --- a/js/src/common.scss +++ b/js/src/common.scss @@ -1,9 +1,9 @@ @use "@/styles/_mixins" as *; @import "variables.scss"; -@import "~bulma"; -@import "~bulma-divider"; -@import "~buefy/src/scss/buefy"; +// @import "../node_modules/bulma/bulma.sass"; +// @import "../node_modules/bulma-divider/dist/css/bulma-divider.sass"; +// @import "~buefy/src/scss/buefy"; @import "styles/vue-announcer.scss"; @import "styles/vue-skip-to.scss"; diff --git a/js/src/components/About/InstanceContactLink.vue b/js/src/components/About/InstanceContactLink.vue index 429e7fb67..7fce88fd8 100644 --- a/js/src/components/About/InstanceContactLink.vue +++ b/js/src/components/About/InstanceContactLink.vue @@ -8,9 +8,8 @@

diff --git a/js/src/components/NavBar.vue b/js/src/components/NavBar.vue index ed0857b43..2ad361b33 100644 --- a/js/src/components/NavBar.vue +++ b/js/src/components/NavBar.vue @@ -1,185 +1,426 @@ - +
+
+ +
+ +
+
+ +
+ + + +
+
+ + + + +
+
+ + Dashboard + + Team + + Projects + + Calendar +
+
+ diff --git a/js/src/views/Admin/AdminProfile.vue b/js/src/views/Admin/AdminProfile.vue index bc2dbe7fd..676663b68 100644 --- a/js/src/views/Admin/AdminProfile.vue +++ b/js/src/views/Admin/AdminProfile.vue @@ -97,7 +97,7 @@ {{ props.row.title }} -