verji · JohnSimonsen · May 21, 2024 · May 21, 2024 · May 21, 2024 · May 21, 2024
diff --git a/.eslintignore b/.eslintignore
@@ -7,3 +7,4 @@ test/end-to-end-tests/lib/
 src/component-index.js
 # Auto-generated file
 src/modules.ts
+src/components/structures/scripts/freshworks.js
diff --git a/.github/workflows/static_analysis.yaml b/.github/workflows/static_analysis.yaml
@@ -1,5 +1,7 @@
+## VERJI WE MUST REVISIT THIS FILE MANUALLY IN PIPELINE / UNSURE WHAT IS NECESSARY TO KEEP
 name: Static Analysis
 on:
+    workflow_dispatch:
     pull_request: {}
     push:
         branches: [develop, master]
@@ -24,7 +26,6 @@ jobs:
         runs-on: ubuntu-24.04
         steps:
             - uses: actions/checkout@v4
-
             - uses: actions/setup-node@v4
               with:
                   cache: "yarn"
@@ -38,6 +39,8 @@ jobs:
 
     i18n_lint:
         name: "i18n Check"
+        # VERJI skip i18n by setting false
+        if: ${{false}}
         uses: matrix-org/matrix-web-i18n/.github/workflows/i18n_check.yml@main
         permissions:
             pull-requests: read
@@ -53,6 +56,8 @@ jobs:
                 welcome_to_element
 
     rethemendex_lint:
+        # VERJI skip Rethemendex check by setting false
+        if: ${{false}}
         name: "Rethemendex Check"
         runs-on: ubuntu-24.04
         steps:

diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml
@@ -1,3 +1,4 @@
+## VERJI NEEDS TO MANUALLY CHECK THIS ALONG WITH RUNNING ACTION
 name: Tests
 on:
     pull_request: {}

diff --git a/.github/workflows/verji-release-drafter.yml b/.github/workflows/verji-release-drafter.yml
@@ -0,0 +1,9 @@
+name: Verji Release Drafter
+on:
+    push:
+        branches: [verji-staging]
+    workflow_dispatch: {}
+concurrency: ${{ github.workflow }}
+jobs:
+    draft:
+        uses: verji/matrix-js-sdk/.github/workflows/release-drafter-workflow.yml@verji-develop
diff --git a/build_config.verji.yaml b/build_config.verji.yaml
@@ -0,0 +1,35 @@
+# A sample build_config.yaml to supply to Element Web's build pipeline,
+# enabling custom functionality at compile time. Copy this file to
+# `build_config.yaml` in the same directory to use, as you would with
+# `config.json`.
+#
+# Note: The vast majority of users DO NOT need this. If you are looking
+# to build your own Element Web as seen on app.element.io or similar then
+# this is not required.
+#
+# This config file does become required if you are looking to add runtime
+# functionality to Element Web, such as customisation endpoints and modules.
+#
+# Over time we might expand this config to better support some use cases.
+# Watch the release notes for features which might impact this config.
+
+#
+# false => installer will perform checks to try to ensure correct versions of dependencies
+# true => installer will skip dependency version checks.
+# Enable skipping at your own peril, and manually ensure all modules reference/load the correct version
+# of the extension module
+#
+# This may be useful during development due to limitations/incompatilibilities in "npm list ..."
+#
+skip_module_dependency_version_check: true
+
+# The modules to install. See ./docs/modules.md for more information on
+# what modules are.
+#
+# The values of this are provided to `yarn add` for inclusion.
+modules:
+    - "@verji/verji-cryptosetup-module"
+    - "@verji/verji-usermenu-module"
+    - "@verji/verji-onboarding-module"
+    - "@verji/verji-usersearch-module"
+    - "@verji/verji-news-module"
diff --git a/jest.config.ts b/jest.config.ts
@@ -19,6 +19,7 @@ const config: Config = {
     globalSetup: "<rootDir>/test/globalSetup.ts",
     setupFiles: ["jest-canvas-mock", "web-streams-polyfill/polyfill"],
     setupFilesAfterEnv: ["<rootDir>/test/setupTests.ts"],
+    moduleFileExtensions: ["js", "jsx", "json", "ts", "tsx"],
     moduleNameMapper: {
         "\\.(css|scss|pcss)$": "<rootDir>/__mocks__/cssMock.js",
         "\\.(gif|png|ttf|woff2)$": "<rootDir>/__mocks__/imageMock.js",

diff --git a/module_system/BuildConfig.ts b/module_system/BuildConfig.ts
@@ -12,6 +12,9 @@ export type BuildConfig = {
     // Dev note: make everything here optional for user safety. Invalid
     // configs are very possible.
 
+    // VERJI: Allow config to skip dependency version check
+    skip_module_dependency_version_check?: boolean;
+
     // The module references to include in the build.
     modules?: string[];
 };

diff --git a/module_system/installer.ts b/module_system/installer.ts
@@ -57,25 +57,27 @@ export function installer(config: BuildConfig): void {
         const pkgJsonStr = fs.readFileSync("./package.json", "utf-8");
         const optionalDepNames = getOptionalDepNames(pkgJsonStr);
         const installedModules = optionalDepNames.filter((d) => !currentOptDeps.includes(d));
-
-        // Ensure all the modules are compatible. We check them all and report at the end to
-        // try and save the user some time debugging this sort of failure.
-        const ourApiVersion = getTopLevelDependencyVersion(moduleApiDepName);
-        const incompatibleNames: string[] = [];
-        for (const moduleName of installedModules) {
-            const modApiVersion = getModuleApiVersionFor(moduleName);
-            if (!isModuleVersionCompatible(ourApiVersion, modApiVersion)) {
-                incompatibleNames.push(moduleName);
+        // Verji - this flag is something we have implemented
+        if(!config.skip_module_dependency_version_check){
+            // Ensure all the modules are compatible. We check them all and report at the end to
+            // try and save the user some time debugging this sort of failure.
+            const ourApiVersion = getTopLevelDependencyVersion(moduleApiDepName);
+            const incompatibleNames: string[] = [];
+            for (const moduleName of installedModules) {
+                const modApiVersion = getModuleApiVersionFor(moduleName);
+                if (!isModuleVersionCompatible(ourApiVersion, modApiVersion)) {
+                    incompatibleNames.push(moduleName);
+                }
+            }
+            if (incompatibleNames.length > 0) {
+                console.error(
+                    "The following modules are not compatible with this version of element-web. Please update the module " +
+                        "references and try again.",
+                    JSON.stringify(incompatibleNames, null, 4), // stringify to get prettier/complete output
+                );
+                exitCode = 1;
+                return; // hit the finally{} block before exiting
             }
-        }
-        if (incompatibleNames.length > 0) {
-            console.error(
-                "The following modules are not compatible with this version of element-web. Please update the module " +
-                    "references and try again.",
-                JSON.stringify(incompatibleNames, null, 4), // stringify to get prettier/complete output
-            );
-            exitCode = 1;
-            return; // hit the finally{} block before exiting
         }
 
         // If we reach here, everything seems fine. Write modules.ts and log some output

diff --git a/package.json b/package.json
@@ -88,7 +88,7 @@
         "@matrix-org/spec": "^1.7.0",
         "@sentry/browser": "^8.0.0",
         "@vector-im/compound-design-tokens": "^2.0.1",
-        "@vector-im/compound-web": "^7.5.0",
+        "@vector-im/compound-web": "^7.6.2",
         "@vector-im/matrix-wysiwyg": "2.37.13",
         "@zxcvbn-ts/core": "^3.0.4",
         "@zxcvbn-ts/language-common": "^3.0.4",
@@ -142,8 +142,10 @@
         "react-focus-lock": "^2.5.1",
         "react-transition-group": "^4.4.1",
         "rfc4648": "^1.4.0",
+        "rss-parser": "^3.12.0",
         "sanitize-filename": "^1.6.3",
         "sanitize-html": "2.13.1",
+        "stream-http": "^3.2.0",
         "tar-js": "^0.3.0",
         "temporal-polyfill": "^0.2.5",
         "ua-parser-js": "^1.0.2",
@@ -182,6 +184,7 @@
         "@testing-library/react": "^16.0.0",
         "@testing-library/user-event": "^14.5.2",
         "@types/commonmark": "^0.27.4",
+        "@types/content-type": "^1.1.8",
         "@types/counterpart": "^0.18.1",
         "@types/css-tree": "^2.3.8",
         "@types/diff-match-patch": "^1.0.32",
@@ -205,9 +208,11 @@
         "@types/react-beautiful-dnd": "^13.0.0",
         "@types/react-dom": "18.3.1",
         "@types/react-transition-group": "^4.4.0",
-        "@types/sanitize-html": "2.13.0",
+        "@types/sanitize-html": "2.11.0",
+        "@types/sdp-transform": "^2.4.6",
+        "@types/seedrandom": "3.0.4",
         "@types/semver": "^7.5.8",
-        "@types/tar-js": "^0.3.5",
+        "@types/tar-js": "^0.3.2",
         "@types/ua-parser-js": "^0.7.36",
         "@types/uuid": "^10.0.0",
         "@typescript-eslint/eslint-plugin": "^8.0.0",
@@ -272,9 +277,7 @@
         "prettier": "3.4.2",
         "process": "^0.11.10",
         "raw-loader": "^4.0.2",
-        "rimraf": "^6.0.0",
-        "semver": "^7.5.2",
-        "source-map-loader": "^5.0.0",
+        "rimraf": "^5.0.0",
         "stylelint": "^16.1.0",
         "stylelint-config-standard": "^36.0.0",
         "stylelint-scss": "^6.0.0",

diff --git a/res/css/_components.pcss b/res/css/_components.pcss
@@ -1,4 +1,10 @@
 /* autogenerated by rethemendex.sh */
+
+/* ----- Verji start ----- */
+@import "./views/dialogs/_InviteNewMembersDialog.scss";
+@import "./views/dialogs/_ConfirmInviteExternalUsersDialog.scss";
+/* ----- Verji end ----- */
+
 @import "./_animations.pcss";
 @import "./_common.pcss";
 @import "./_font-sizes.pcss";

diff --git a/res/css/structures/_HomePage.pcss b/res/css/structures/_HomePage.pcss
@@ -13,6 +13,7 @@ Please see LICENSE files in the repository root for full details.
     height: 100%;
     margin-left: auto;
     margin-right: auto;
+    max-height: 100%;
 }
 
 .mx_HomePage_default {

diff --git a/res/css/structures/_LeftPanel.pcss b/res/css/structures/_LeftPanel.pcss
@@ -140,6 +140,39 @@ Please see LICENSE files in the repository root for full details.
                 }
             }
 
+            .mx_LeftPanel_omButton,
+            .mx_LeftPanel_newsButton {
+                width: 32px;
+                height: 32px;
+                border-radius: 8px;
+                background-color: $panel-actions;
+                position: relative;
+                margin-left: 8px;
+                margin-top: 2px;
+                margin-bottom: 2px;
+
+                &::before {
+                    content: "";
+                    position: absolute;
+                    top: 8px;
+                    left: 8px;
+                    width: 16px;
+                    height: 16px;
+                    mask-position: center;
+                    mask-size: contain;
+                    mask-repeat: no-repeat;
+                    background-color: $secondary-content;
+                }
+
+                &:hover {
+                    background-color: $tertiary-content;
+
+                    &::before {
+                        background-color: $background;
+                    }
+                }
+            }
+
             .mx_LeftPanel_exploreButton,
             .mx_LeftPanel_recentsButton {
                 width: 32px;
@@ -171,6 +204,15 @@ Please see LICENSE files in the repository root for full details.
                 }
             }
 
+            //Verji start
+            .mx_LeftPanel_newsButton::before {
+                mask-image: url("$(res)/img/verji/news.svg");
+            }
+            .mx_LeftPanel_omButton::before {
+                mask-image: url("$(res)/img/verji/shield.svg");
+            }
+            //Verji end
+
             .mx_LeftPanel_exploreButton::before {
                 mask-image: url("$(res)/img/element-icons/roomlist/explore.svg");
             }

diff --git a/res/css/structures/_MiscHeader.scss b/res/css/structures/_MiscHeader.scss
@@ -0,0 +1,61 @@
+/*
+    ROSBERG FILE
+*/
+
+.mx_MiscHeaderButtons {
+    display: flex;
+    &::before {
+        content: unset;
+    }
+}
+
+.mx_MiscHeaderButtons::before {
+    content: "";
+    //background-color: $header-divider-color;
+    opacity: 0.5;
+    margin: 6px 8px;
+    border-radius: 1px;
+    width: 1px;
+}
+
+.mx_MiscHeader_miscButton {
+    cursor: pointer;
+    flex: 0 0 auto;
+    margin-left: 1px;
+    margin-right: 1px;
+    height: 32px;
+    width: 32px;
+    position: relative;
+    border-radius: 100%;
+
+    &::before {
+        content: "";
+        position: absolute;
+        top: 4px; // center with parent of 32px
+        left: 4px; // center with parent of 32px
+        height: 24px;
+        width: 24px;
+        background-color: $icon-button-color;
+        mask-repeat: no-repeat;
+        mask-size: contain;
+    }
+
+    &:hover {
+        //background: rgba($accent-color, 0.1);
+
+        &::before {
+            //background-color: $accent-color;
+        }
+    }
+}
+
+.mx_MiscHeader_miscButton_highlight {
+    &::before {
+        //background-color: $accent-color !important;
+    }
+}
+
+.mx_MiscHeader_roomSupportButton::before {
+    mask-image: url("$(res)/img/element-icons/settings/help.svg");
+    mask-position: center;
+}
diff --git a/res/css/structures/_RightPanel.pcss b/res/css/structures/_RightPanel.pcss
@@ -39,6 +39,10 @@ Please see LICENSE files in the repository root for full details.
     mask-image: url("@vector-im/compound-design-tokens/icons/info-solid.svg");
     mask-position: center;
 }
+.mx_RightPanel_supportButton::before {
+    mask-image: url("$(res)/img/element-icons/settings/help.svg");
+    mask-position: center;
+}
 
 .mx_RightPanel_pinnedMessagesButton {
     &::before {

diff --git a/res/css/structures/_RoomView.pcss b/res/css/structures/_RoomView.pcss
@@ -154,6 +154,32 @@ Please see LICENSE files in the repository root for full details.
     margin-bottom: 80px; /* visually center the content (intentional offset) */
 }
 
+// Verji start
+@keyframes fade1 {
+    0% {
+        opacity: 0;
+    }
+    100% {
+        opacity: 1;
+    }
+}
+.mx_RoomView_News1 {
+    animation: 0.2s ease-out 0s 0.2 fade1;
+}
+
+@keyframes fade2 {
+    0% {
+        transform: translateX(70px);
+    }
+    100% {
+        transform: translateX(0);
+    }
+}
+.mx_RoomView_News2 {
+    animation: 0.2s ease 0s 0.2 fade2;
+}
+// Verji end
+
 .mx_RoomView_MessageList {
     list-style-type: none;
     padding: var(--RoomView_MessageList-padding); /* mx_ProfileResizer depends on this value */