Convert Figma logo to code with AI

element-hq logoelement-desktop

A glossy Matrix collaboration client for desktop.

1,128
257
1,128
388

Top Related Projects

Matrix SDK for React Javascript

A glossy Matrix collaboration client for the web.

A glossy Matrix collaboration client for desktop.

Using Mockito with Kotlin

Matrix Client-Server SDK for JavaScript

Quick Overview

The element-hq/element-desktop repository contains the source code for the desktop version of the Element messaging app, a secure and decentralized communication platform built on the Matrix protocol. Element Desktop is a cross-platform application that provides a user-friendly interface for accessing the Matrix network.

Pros

  • Secure and Private Communication: Element is built on the Matrix protocol, which provides end-to-end encryption and decentralized data storage, ensuring the privacy and security of user communications.
  • Cross-Platform Availability: Element Desktop is available for Windows, macOS, and Linux, making it accessible to a wide range of users.
  • Active Development and Community: The project has an active development team and a growing community of contributors, ensuring ongoing improvements and support.
  • Customization and Extensibility: Element Desktop allows users to customize their experience and install additional plugins and integrations to enhance its functionality.

Cons

  • Learning Curve: The Matrix protocol and the Element ecosystem may have a steeper learning curve compared to more mainstream messaging platforms, which could be a barrier for some users.
  • Resource Consumption: As a desktop application, Element Desktop may consume more system resources than web-based or mobile messaging apps, which could be a concern for users with older or less powerful devices.
  • Limited Feature Parity: While Element Desktop aims to provide a comprehensive set of features, it may not have feature parity with the web or mobile versions of the app, or with other popular messaging platforms.
  • Adoption and Network Effects: As a relatively new and niche platform, Element may struggle to achieve the same level of widespread adoption and network effects as more established messaging apps, which could limit its usefulness for some users.

Getting Started

To get started with Element Desktop, follow these steps:

  1. Visit the Element Desktop releases page and download the appropriate installer for your operating system.
  2. Run the installer and follow the on-screen instructions to complete the installation process.
  3. Once installed, launch the Element Desktop application.
  4. If you don't have an existing Matrix account, you can create a new one by clicking the "Sign Up" button and following the registration process.
  5. Once you've signed in, you can start using Element Desktop to chat with other Matrix users, join public rooms, and customize your settings and preferences.

For more detailed instructions and information on advanced features, please refer to the Element Desktop documentation.

Competitor Comparisons

Matrix SDK for React Javascript

Pros of Matrix React SDK

  • Extensive Documentation: The Matrix React SDK has comprehensive documentation, making it easier for developers to understand and use the library.
  • Active Community: The Matrix project has a large and active community, providing support and contributing to the development of the SDK.
  • Flexibility: The Matrix React SDK is designed to be flexible and customizable, allowing developers to build a wide range of applications on top of the Matrix protocol.

Cons of Matrix React SDK

  • Complexity: The Matrix React SDK can be complex to set up and configure, especially for developers new to the Matrix ecosystem.
  • Performance: Depending on the size and complexity of the application, the Matrix React SDK may have performance issues, particularly in terms of rendering and data synchronization.

Code Comparison

Here's a brief code comparison between the Matrix React SDK and the Element Desktop repository:

Matrix React SDK

import React from 'react';
import { MatrixClientProvider, useMatrixClient } from '@matrix-org/react-sdk';

const App = () => {
  const matrixClient = useMatrixClient();

  // Use the Matrix client to interact with the Matrix protocol
  return (
    <div>
      <h1>My Matrix App</h1>
      {/* Your app components */}
    </div>
  );
};

const Root = () => (
  <MatrixClientProvider>
    <App />
  </MatrixClientProvider>
);

export default Root;

Element Desktop

const { app, BrowserWindow } = require('electron');
const path = require('path');

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js'),
    },
  });

  win.loadURL('https://app.element.io');
}

app.whenReady().then(createWindow);

A glossy Matrix collaboration client for the web.

Pros of element-web

  • Lightweight and accessible through any modern web browser
  • Easier to deploy and maintain in web-based environments
  • More suitable for organizations preferring web-based solutions

Cons of element-web

  • Limited access to system-level features and notifications
  • May have reduced performance compared to native desktop applications
  • Requires constant internet connection for full functionality

Code Comparison

element-web (web-based approach):

import React from 'react';
import ReactDOM from 'react-dom';
import { MatrixClient } from 'matrix-js-sdk';

const App = () => {
  // Web-specific implementation
};

element-desktop (Electron-based approach):

const { app, BrowserWindow } = require('electron');
const path = require('path');

function createWindow() {
  const win = new BrowserWindow({
    // Desktop-specific configuration
  });
}

The code snippets highlight the fundamental differences in approach. element-web uses React for the web interface, while element-desktop utilizes Electron to create a native desktop application. This difference affects how the application interacts with the operating system and handles features like notifications and system tray integration.

Both repositories share the core Matrix protocol implementation, but element-desktop adds an extra layer for desktop integration, providing a more native experience at the cost of increased complexity and resource usage.

A glossy Matrix collaboration client for desktop.

Pros of element-desktop

  • Identical codebase and features
  • Same development team and support
  • Consistent user experience across platforms

Cons of element-desktop

  • No distinguishing features or improvements
  • Lack of unique selling points
  • Potential confusion for users due to identical repositories

Code Comparison

Both repositories contain identical code, as they are the same project. Here's a sample from the package.json file in both repositories:

{
  "name": "element-desktop",
  "productName": "Element",
  "main": "src/electron-main.js",
  "version": "1.11.30",
  "description": "A feature-rich client for Matrix.org",
  "author": "Element",
  "repository": "https://github.com/element-hq/element-desktop"
}

As the repositories are identical, there are no code differences to highlight. The comparison reveals that element-desktop and element-desktop are the same project, maintained by the same team, with no distinguishing features or improvements between them. This situation may lead to confusion for users and developers, as there's no apparent reason for maintaining two separate repositories with identical content.

Using Mockito with Kotlin

Pros of Mockito-Kotlin

  • Concise Syntax: Mockito-Kotlin provides a more concise and readable syntax for writing Mockito-based tests, reducing boilerplate code.
  • Improved Type Safety: The Kotlin-specific extensions in Mockito-Kotlin help ensure type safety, reducing the risk of runtime errors.
  • Seamless Integration: Mockito-Kotlin integrates well with the Kotlin ecosystem, making it a natural choice for Kotlin-based projects.

Cons of Mockito-Kotlin

  • Limited Ecosystem: While Mockito-Kotlin is a popular choice for Kotlin projects, the overall ecosystem and community support may not be as extensive as the Java-based Mockito library.
  • Dependency Management: Using Mockito-Kotlin introduces an additional dependency, which may be a concern for some projects that aim to minimize their dependencies.

Code Comparison

Element Desktop:

fun main() {
    val app = App()
    app.start()
}

class App {
    fun start() {
        // Start the application
    }
}

Mockito-Kotlin:

@Test
fun `should return expected value`() {
    val mock = mock<MyClass> {
        on { myMethod() } doReturn "expected"
    }
    assertEquals("expected", mock.myMethod())
}

Matrix Client-Server SDK for JavaScript

Pros of Matrix JS SDK

  • Comprehensive API: The Matrix JS SDK provides a comprehensive set of APIs for interacting with the Matrix protocol, making it easier to build Matrix-based applications.
  • Cross-platform compatibility: The SDK is designed to work across multiple platforms, including web, mobile, and server-side environments.
  • Active development and community: The Matrix project has a large and active community, with regular updates and improvements to the SDK.

Cons of Matrix JS SDK

  • Complexity: The Matrix protocol and the SDK can be complex, with a steep learning curve for developers new to the ecosystem.
  • Performance: Depending on the use case, the SDK may not always provide the best performance, especially for large-scale applications.

Code Comparison

Here's a brief code comparison between the Matrix JS SDK and the Element Desktop repository:

Matrix JS SDK (creating a client):

const sdk = require("matrix-js-sdk");
const client = sdk.createClient({
  baseUrl: "https://matrix.org",
  accessToken: "your_access_token"
});

Element Desktop (creating a window):

const { BrowserWindow } = require('electron');
const win = new BrowserWindow({
  width: 800,
  height: 600,
  webPreferences: {
    nodeIntegration: true
  }
});

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Build Static Analysis Localazy Quality Gate Status Vulnerabilities Bugs

Element Desktop

Element Desktop is a Matrix client for desktop platforms with Element Web at its core.

First Steps

Before you do anything else, fetch the dependencies:

yarn install

Fetching Element

Since this package is just the Electron wrapper for Element Web, it doesn't contain any of the Element Web code, so the first step is to get a working copy of Element Web. There are a few ways of doing this:

# Fetch the prebuilt release Element package from the element-web GitHub releases page. The version
# fetched will be the same as the local element-desktop package.
# We're explicitly asking for no config, so the packaged Element will have no config.json.
yarn run fetch --noverify --cfgdir ""

...or if you'd like to use GPG to verify the downloaded package:

# Fetch the Element public key from the element.io web server over a secure connection and import
# it into your local GPG keychain (you'll need GPG installed). You only need to to do this
# once.
yarn run fetch --importkey
# Fetch the package and verify the signature
yarn run fetch --cfgdir ""

...or either of the above, but fetching a specific version of Element:

# Fetch the prebuilt release Element package from the element-web GitHub releases page. The version
# fetched will be the same as the local element-desktop package.
yarn run fetch --noverify --cfgdir "" v1.5.6

If you only want to run the app locally and don't need to build packages, you can provide the webapp directory directly:

# Assuming you've checked out and built a copy of element-web in ../element-web
ln -s ../element-web/webapp ./

[TODO: add support for fetching develop builds, arbitrary URLs and arbitrary paths]

Building

Native Build

TODO: List native pre-requisites

Optionally, build the native modules, which include support for searching in encrypted rooms and secure storage. Skipping this step is fine, you just won't have those features.

Then, run

yarn run build

This will do a couple of things:

  • Run the setversion script to set the local package version to match whatever version of Element you installed above.
  • Run electron-builder to build a package. The package built will match the operating system you're running the build process on.

Docker

Alternatively, you can also build using docker, which will always produce the linux package:

# Run this once to make the docker image
yarn run docker:setup

yarn run docker:install
# if you want to build the native modules (this will take a while)
yarn run docker:build:native
yarn run docker:build

After running, the packages should be in dist/.

Starting

If you'd just like to run the electron app locally for development:

# Install electron - we don't normally need electron itself as it's provided
# by electron-builder when building packages
yarn add electron
yarn start

Config

If you'd like the packaged Element to have a configuration file, you can create a config directory and place config.json in there, then specify this directory with the --cfgdir option to yarn run fetch, eg:

mkdir myconfig
cp /path/to/my/config.json myconfig/
yarn run fetch --cfgdir myconfig

The config dir for the official Element app is in element.io. If you use this, your app will auto-update itself using builds from element.io.

Profiles

To run multiple instances of the desktop app for different accounts, you can launch the executable with the --profile argument followed by a unique identifier, e.g element-desktop --profile Work for it to run a separate profile and not interfere with the default one.

Alternatively, a custom location for the profile data can be specified using the --profile-dir flag followed by the desired path.

User-specified config.json

  • %APPDATA%\$NAME\config.json on Windows
  • $XDG_CONFIG_HOME/$NAME/config.json or ~/.config/$NAME/config.json on Linux
  • ~/Library/Application Support/$NAME/config.json on macOS

In the paths above, $NAME is typically Element, unless you use --profile $PROFILE in which case it becomes Element-$PROFILE, or it is using one of the above created by a pre-1.7 install, in which case it will be Riot or Riot-$PROFILE.

Translations

To add a new translation, head to the translating doc.

For a developer guide, see the translating dev doc.

Report bugs & give feedback

If you run into any bugs or have feedback you'd like to share, please let us know on GitHub.

To help avoid duplicate issues, please view existing issues first (and add a +1) or create a new issue if you can't find it. Please note that this issue tracker is associated with the element-web repo, but is also applied to the code in this repo as well.