fix admin elixir

up vars
config tweaks to allow rss feeds
2022-10-12 15:23:22 +02:00 · 2022-09-20 10:27:49 +02:00 · 2022-06-28 15:33:44 +02:00 · 2022-06-28 14:49:11 +02:00 · 2022-06-28 14:41:41 +02:00 · 2022-06-02 11:42:19 +02:00
607 changed files with 97363 additions and 44289 deletions
--- a/.devcontainer/Dockerfile
+++ b/.devcontainer/Dockerfile
@ -0,0 +1,66 @@
+# Update the VARIANT arg in docker-compose.yml to pick an Elixir version: 1.9, 1.10, 1.10.4
+ARG VARIANT="1.12.3"
+FROM elixir:${VARIANT}
+
+# This Dockerfile adds a non-root user with sudo access. Update the “remoteUser” property in
+# devcontainer.json to use it. More info: https://aka.ms/vscode-remote/containers/non-root-user.
+ARG USERNAME=vscode
+ARG USER_UID=1000
+ARG USER_GID=$USER_UID
+
+# Options for common package install script
+ARG INSTALL_ZSH="true"
+ARG UPGRADE_PACKAGES="true"
+ARG COMMON_SCRIPT_SOURCE="https://raw.githubusercontent.com/microsoft/vscode-dev-containers/v0.209.6/script-library/common-debian.sh"
+ARG COMMON_SCRIPT_SHA="d35dd1711454156c9a59cc41ebe04fbff681ca0bd304f10fd5b13285d0de13b2"
+
+# Optional Settings for Phoenix
+ARG PHOENIX_VERSION="1.6.2"
+
+# [Optional] Setup nodejs
+ARG NODE_SCRIPT_SOURCE="https://raw.githubusercontent.com/microsoft/vscode-dev-containers/main/script-library/node-debian.sh"
+ARG NODE_SCRIPT_SHA="dev-mode"
+ARG NODE_VERSION="none"
+ENV NVM_DIR=/usr/local/share/nvm
+ENV NVM_SYMLINK_CURRENT=true
+ENV PATH=${NVM_DIR}/current/bin:${PATH}
+
+# [Optional, Choice] Node.js version: none, lts/*, 16, 14, 12, 10
+ARG NODE_VERSION="none"
+
+# Install needed packages and setup non-root user. Use a separate RUN statement to add your own dependencies.
+RUN apt-get update \
+  && export DEBIAN_FRONTEND=noninteractive \
+  && apt-get -y install --no-install-recommends curl ca-certificates 2>&1 \
+  && curl -sSL ${COMMON_SCRIPT_SOURCE} -o /tmp/common-setup.sh \
+  && ([ "${COMMON_SCRIPT_SHA}" = "dev-mode" ] || (echo "${COMMON_SCRIPT_SHA} */tmp/common-setup.sh" | sha256sum -c -)) \
+  && /bin/bash /tmp/common-setup.sh "${INSTALL_ZSH}" "${USERNAME}" "${USER_UID}" "${USER_GID}" "${UPGRADE_PACKAGES}" \
+  #
+  # [Optional] Install Node.js for use with web applications
+  && if [ "$NODE_VERSION" != "none" ]; then \
+  curl -sSL ${NODE_SCRIPT_SOURCE} -o /tmp/node-setup.sh \
+  && ([ "${NODE_SCRIPT_SHA}" = "dev-mode" ] || (echo "${NODE_SCRIPT_SHA} */tmp/node-setup.sh" | sha256sum -c -)) \
+  && /bin/bash /tmp/node-setup.sh "${NVM_DIR}" "${NODE_VERSION}" "${USERNAME}"; \
+  fi \
+  #
+  # Install dependencies
+  && apt-get install -y build-essential \
+  #
+  # Clean up
+  && apt-get autoremove -y \
+  && apt-get clean -y \
+  && rm -rf /var/lib/apt/lists/* /tmp/common-setup.sh /tmp/node-setup.sh
+
+RUN su ${USERNAME} -c "mix local.hex --force \
+  && mix local.rebar --force \
+  && mix archive.install --force hex phx_new ${PHOENIX_VERSION}"
+
+RUN apt-get update \
+  && export DEBIAN_FRONTEND=noninteractive \
+  && apt-get -y install --no-install-recommends cmake webp bash libncurses6 git python3 inotify-tools \
+  && apt-get autoremove -y \
+  && apt-get clean -y \
+  && rm -rf /var/lib/apt/lists/*
+
+# [Optional] Uncomment this line to install additional package.
+# RUN  mix ...
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@ -0,0 +1,44 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
+// https://github.com/microsoft/vscode-dev-containers/tree/v0.209.6/containers/elixir-phoenix-postgres
+{
+	"name": "Elixir, Phoenix, Node.js & PostgresSQL (Community)",
+	"dockerComposeFile": "docker-compose.yml",
+	"service": "elixir",
+	"workspaceFolder": "/workspace",
+
+	// Set *default* container specific settings.json values on container create.
+	"settings": {
+		"sqltools.connections": [{
+			"name": "Container database",
+			"driver": "PostgreSQL",
+			"previewLimit": 50,
+			"server": "localhost",
+			"port": 5432,
+			"database": "postgres",
+			"username": "postgres",
+			"password": "postgres"
+		}]
+	},
+
+	// Add the IDs of extensions you want installed when the container is created.
+	"extensions": [
+		"jakebecker.elixir-ls",
+		"mtxr.sqltools",
+		"mtxr.sqltools-driver-pg"
+	],
+
+	// Use 'forwardPorts' to make a list of ports inside the container available locally.
+	"forwardPorts": [4000, 4001, 5432],
+
+	// Use 'postCreateCommand' to run commands after the container is created.
+	// "postCreateCommand": "mix deps.get",
+	// "runArgs": ["--userns=keep-id", "--privileged"],
+	// "containerUser": "vscode",
+	// "containerEnv": {
+	// 	"HOME": "/home/vscode",
+	// },
+	// "workspaceMount": "source=${localWorkspaceFolder},target=/workspace,type=bind,Z",
+
+	// Uncomment to connect as a non-root user. See https://aka.ms/vscode-remote/containers/non-root.
+	"remoteUser": "vscode"
+}
--- a/.devcontainer/docker-compose.yml
+++ b/.devcontainer/docker-compose.yml
@ -0,0 +1,46 @@
+version: "3.8"
+
+services:
+  elixir:
+    build:
+      context: .
+      dockerfile: Dockerfile
+      args:
+        # Elixir Version: 1.9, 1.10, 1.10.4, ...
+        VARIANT: "1.13.1"
+        # Phoenix Version: 1.4.17, 1.5.4, ...
+        PHOENIX_VERSION: "1.6.6"
+        # Node Version: 10, 11, ...
+        NODE_VERSION: "16"
+
+    volumes:
+      - ..:/workspace:z
+    # Runs app on the same network as the database container, allows "forwardPorts" in devcontainer.json function.
+    network_mode: service:db
+
+    # Overrides default command so things don't shut down after the process ends.
+    command: sleep infinity
+    environment:
+      MOBILIZON_INSTANCE_NAME: My Mobilizon Instance
+      MOBILIZON_INSTANCE_HOST: localhost
+      MOBILIZON_INSTANCE_HOST_PORT: 4000
+      MOBILIZON_INSTANCE_PORT: 4000
+      MOBILIZON_INSTANCE_EMAIL: noreply@mobilizon.me
+      MOBILIZON_INSTANCE_REGISTRATIONS_OPEN: "true"
+      MOBILIZON_DATABASE_PASSWORD: postgres
+      MOBILIZON_DATABASE_USERNAME: postgres
+      MOBILIZON_DATABASE_DBNAME: mobilizon
+      MOBILIZON_DATABASE_HOST: db
+
+  db:
+    image: postgis/postgis:latest
+    restart: unless-stopped
+    volumes:
+      - postgres-data:/var/lib/postgresql/data
+    environment:
+      POSTGRES_USER: postgres
+      POSTGRES_PASSWORD: postgres
+      POSTGRES_DB: app
+
+volumes:
+  postgres-data: null
--- a/.env.template
+++ b/.env.template
@ -19,7 +19,6 @@ MOBILIZON_REPLY_EMAIL=contact@mobilizon.lan
 # Email settings
 MOBILIZON_SMTP_SERVER=localhost
 MOBILIZON_SMTP_PORT=25
-MOBILIZON_SMTP_HOSTNAME=localhost
 MOBILIZON_SMTP_USERNAME=noreply@mobilizon.lan
 MOBILIZON_SMTP_PASSWORD=password
 MOBILIZON_SMTP_SSL=false
--- a/.formatter.exs
+++ b/.formatter.exs
@ -1,3 +1,4 @@
 [
-  inputs: ["{mix,.formatter}.exs", "{config,lib,test,priv}/**/*.{ex,exs}"]
+  plugins: [Phoenix.LiveView.HTMLFormatter],
+  inputs: ["{mix,.formatter}.exs", "{config,lib,test,priv}/**/*.{ex,exs,heex}"]
 ]
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@ -59,8 +59,11 @@ lint-elixir:
    - mix deps.get
  script:
    - export EXITVALUE=0
+    - git fetch origin ${CI_DEFAULT_BRANCH}
+    - TARGET_SHA1=$(git show-ref -s ${CI_DEFAULT_BRANCH})
+    - echo "$TARGET_SHA1"
    - mix format --check-formatted --dry-run || export EXITVALUE=1
-    - mix credo --strict -a || export EXITVALUE=1
+    - mix credo diff --from-git-merge-base $TARGET_SHA1 --strict -a || export EXITVALUE=1
    - mix sobelow --config || export EXITVALUE=1
    - exit $EXITVALUE

@ -107,7 +110,7 @@ deps:
 exunit:
  stage: test
  services:
-    - name: postgis/postgis:13-3.1
+    - name: postgis/postgis:14-3.2
      alias: postgres
  variables:
    MIX_ENV: test
@ -180,7 +183,7 @@ pages:

 .docker: &docker
  stage: docker
-  image: docker:stable
+  image: docker:20.10.12
  variables:
    DOCKER_TLS_CERTDIR: "/certs"
    DOCKER_HOST: tcp://docker:2376
@ -188,13 +191,13 @@ pages:
    DOCKER_CERT_PATH: "$DOCKER_TLS_CERTDIR/client"
    DOCKER_DRIVER: overlay2
  services:
-    - docker:stable-dind
+    - docker:20.10.12-dind
  cache: {}
  before_script:
    # Install buildx
-    - wget https://github.com/docker/buildx/releases/download/v0.6.3/buildx-v0.6.3.linux-amd64
+    - wget https://github.com/docker/buildx/releases/download/v0.8.1/buildx-v0.8.1.linux-amd64
    - mkdir -p ~/.docker/cli-plugins/
-    - mv buildx-v0.6.3.linux-amd64 ~/.docker/cli-plugins/docker-buildx
+    - mv buildx-v0.8.1.linux-amd64 ~/.docker/cli-plugins/docker-buildx
    - chmod a+x ~/.docker/cli-plugins/docker-buildx
    # Create env
    - docker context create tls-environment
@ -205,16 +208,8 @@ pages:
    # Login to DockerHub
    - mkdir -p ~/.docker
    - echo "{\"auths\":{\"$CI_REGISTRY\":{\"auth\":\"$CI_REGISTRY_AUTH\",\"email\":\"$CI_REGISTRY_EMAIL\"}}}" > ~/.docker/config.json
-  script:
-    - >
-      docker buildx build
-      --push
-      --platform linux/amd64,linux/arm64,linux/arm
-      -t $DOCKER_IMAGE_NAME
-      -f docker/production/Dockerfile .
  tags:
    - "privileged"
-  timeout: 3 hours

 build-docker-main:
  <<: *docker
@ -222,8 +217,8 @@ build-docker-main:
    - if: '$CI_PROJECT_NAMESPACE != "framasoft"'
      when: never
    - if: '$CI_PIPELINE_SOURCE == "schedule"'
-  variables:
-    DOCKER_IMAGE_NAME: framasoft/mobilizon:main
+  script:
+    - docker buildx build --push --platform linux/amd64 -t framasoft/mobilizon:main -f docker/production/Dockerfile .

 build-docker-tag:
  <<: *docker
@ -231,14 +226,25 @@ build-docker-tag:
    - if: '$CI_PROJECT_NAMESPACE != "framasoft"'
      when: never
    - if: $CI_COMMIT_TAG
-  variables:
-    DOCKER_IMAGE_NAME: framasoft/mobilizon:$CI_COMMIT_TAG
+  timeout: 3 hours
+  script:
+    - >
+      docker buildx build
+      --push
+      --platform linux/amd64,linux/arm64,linux/arm
+      -t framasoft/mobilizon:$CI_COMMIT_TAG
+      -t framasoft/mobilizon:latest
+      -f docker/production/Dockerfile .

 # Packaging app for amd64
 package-app:
+  image: mobilizon/buildpack:1.13.4-erlang-24.3.3-debian-buster
  stage: package
  variables: &release-variables
    MIX_ENV: "prod"
+    DEBIAN_FRONTEND: noninteractive
+    TZ: Etc/UTC
+    APP_ASSET: "${CI_PROJECT_NAME}_${CI_COMMIT_REF_NAME}_${ARCH}.tar.gz"
  script: &release-script
    - mix local.hex --force
    - mix local.rebar --force
@ -254,7 +260,7 @@ package-app:
  only:
    - tags@framasoft/mobilizon
  artifacts:
-    expire_in: 30 days
+    expire_in: 2 days
    paths:
      - ${APP_ASSET}

@ -272,7 +278,7 @@ package-app-dev:
 # Packaging app for multi-arch
 multi-arch-release:
  stage: package
-  image: docker:stable
+  image: docker:20.10.12
  variables:
    DOCKER_TLS_CERTDIR: "/certs"
    DOCKER_HOST: tcp://docker:2376
@ -280,14 +286,15 @@ multi-arch-release:
    DOCKER_CERT_PATH: "$DOCKER_TLS_CERTDIR/client"
    DOCKER_DRIVER: overlay2
    APP_ASSET: "${CI_PROJECT_NAME}_${CI_COMMIT_REF_NAME}_${ARCH}.tar.gz"
+    OS: debian-buster
  services:
-    - docker:stable-dind
+    - docker:20.10.12-dind
  cache: {}
  before_script:
    # Install buildx
-    - wget https://github.com/docker/buildx/releases/download/v0.6.3/buildx-v0.6.3.linux-amd64
+    - wget https://github.com/docker/buildx/releases/download/v0.8.1/buildx-v0.8.1.linux-amd64
    - mkdir -p ~/.docker/cli-plugins/
-    - mv buildx-v0.6.3.linux-amd64 ~/.docker/cli-plugins/docker-buildx
+    - mv buildx-v0.8.1.linux-amd64 ~/.docker/cli-plugins/docker-buildx
    - chmod a+x ~/.docker/cli-plugins/docker-buildx
    # Create env
    - docker context create tls-environment
@ -303,7 +310,7 @@ multi-arch-release:
  tags:
    - "privileged"
  artifacts:
-    expire_in: 30 days
+    expire_in: 2 days
    paths:
      - ${APP_ASSET}
  parallel:
@ -319,7 +326,7 @@ multi-arch-release:
 # Release
 release-upload:
  stage: upload
-  image: framasoft/yakforms-assets-deploy:latest
+  image: framasoft/upload-packages:latest
  variables:
    APP_ASSET: "${CI_PROJECT_NAME}_${CI_COMMIT_REF_NAME}_${ARCH}.tar.gz"
  rules: *tag-rules
--- a/.ncignore
+++ b/.ncignore
@ -0,0 +1 @@
+deps
--- a/.sobelow-conf
+++ b/.sobelow-conf
@ -8,5 +8,5 @@
  out: "",
  threshold: "medium",
  ignore: ["Config.HTTPS", "Config.CSP"],
-  ignore_files: ["config/dev.1.secret.exs", "config/dev.2.secret.exs", "config/dev.3.secret.exs", "config/dev.secret.exs", "config/e2e.secret.exs", "config/prod.secret.exs", "config/test.secret.exs", "config/runtime.1.secret.exs", "config/runtime.2.secret.exs", "config/runtime.3.secret.exs", "config/runtime.exs"]
+  ignore_files: ["config/runtime.exs"]
 ]
--- a/.sobelow-skips
+++ b/.sobelow-skips
@ -1,12 +1,16 @@

-5048AE33D6269B15E21CF28C6F545AB6
-
-752C0E897CA81ACD81F4BB215FA5F8E4
-23412CF16549E4E88366DC9DECF39071
-81C1F600C5809C7029EE32DE4818CD7D
+02CE4963DFD1B0D6D5C567357CAFFE97
 155A1FB53DE39EC8EFCFD7FB94EA823D
-73B351E4CB3AF715AD450A085F5E6304
-BBACD7F0BACD4A6D3010C26604671692
-6D4D4A4821B93BCFAC9CDBB367B34C4B
-5674F0D127852889ED0132DC2F442AAB
-1600B7206E47F630D94AB54C360906F0
+2262742E5C8944D5BF6698EC61F5DE50
+25BEE162A99754480967216281E9EF33
+2A6F71CD6F1246F0B152C2376E2E398A
+30552A09D485A6AA73401C1D54F63C21
+52900CE4EE3598F6F178A651FB256770
+6151F44368FC19F2394274F513C29151
+765526195D4C6D770EAF4DC944A8CBF4
+B2FF1A12F13B873507C85091688C1D6D
+B9AF8A342CD7FF39E10CC10A408C28E1
+C042E87389F7BDCFF4E076E95731AE69
+C42BFAEF7100F57BED75998B217C857A
+D11958E86F1B6D37EF656B63405CA8A4
+F16F054F2628609A726B9FF2F089D484
--- a/.tool-versions
+++ b/.tool-versions
@ -0,0 +1,2 @@
+elixir 1.13.4-otp-24
+erlang 24.3.3
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,9 +1,514 @@
 # Changelog
+
 All notable changes to this project will be documented in this file.

 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

+## 2.1.0 - 2022-05-16
+
+### Added
+
+- Added an event category field. Administrators can extend the pre-configured list of categories through configuration.
+- Added possibility for administrators to have analytics (Matomo, Plausible supported) and error handling (Sentry supported) on front-end.
+- Redesigned federation admin section with dedicated instance pages
+- Allow to filter moderation reports by domain
+- Added a button to go to past events of a group if it has no upcoming events
+- Add Überauth CAS Strategy
+- Add a CLI command to delete actors
+
+### Changed
+
+- Changed mailer library from Bamboo to Swoosh, should fix emails being considered spam. **Some configuration changes are required, see below.**
+- Expose some fields to ActivityStreams event representation: `isOnline`, `remainingAttendeeCapacity` and `participantCount`
+- Expose a new field to ActivityStreams group representation: `memberCount`
+- Improve group creation errors feedback
+- Only display locality in event card
+- Stale groups are now excluded from group search
+- Event default visibility is now set according to group privacy setting
+- Remove Koena Connect button
+- Hide the whole metadata block if group has no description
+- Increase task timeout in Refresher to 60 seconds
+- Allow webfinger to be fetched over http (not https) in dev mode
+- Improve reactions when approving/rejecting an instance follow
+- Improve instance admin view for mobile
+- Allow to reject instance following
+- Allow instance to have non-standard ports
+- Add pagination to the instances list
+- Eventually fetch actors in mentions
+- Improve IdentityPicker, JoinGroupWithAccount and ActorInline components
+- Various group and posts improvements
+- Update schema.graphql file
+- Add "Accept-Language" header to sentry request metadata
+- Hide address blocks when address has no real data
+- Remove obsolete attribute type="text/css" from <style> tags
+- Improve actor cards integration
+- Use upstream dependencies for Ueberauth providers
+- Include ongoing events in search
+- Send push notification into own task
+- Add appropriate timeouts for Repo.transactions
+- Add a proper error message when adding an instance follow that doesn't respond
+- Allow the instance to be followed from Mastodon (through relays)
+- Remove unused fragment from FETCH_PERSON GraphQL query
+
+### Fixed
+
+- Fixed actor refreshment being impossible
+- Fixed ical export for undefined datetimes
+- Fixed parsing links with hashtag characters
+- Fixed fetching link details from Twitter
+- Fixed Thunderbird accessing ICS feed endpoint with special `Accept` HTTP header
+- Make sure every ICS/Feed caches are emptied when modifying entities
+- Fixed time issues with DST changes
+- Fixed group preview card not truncating description
+- Fixed redirection after login
+- Fixed user admin section showing button to confirm user when the user is already confirmed
+- Fixed creating event from group view not always setting the group as organizer
+- Fixed invalid addresses blocking event metadata preview rendering
+- Fixed group deletion with comments that caused foreign key issues
+- Fixed incoming Accept activities from participations we don't already have
+- Fixed resources that didn't have metadata size limits
+- Properly fallback to UTC when sending notifications and the user doesn't have a timezone setting set
+- Fix posts creation
+- Fix rejecting instance follow
+- Fix pagination of group events
+- Add proper fallback for when a TZ isn't registered
+- Hide side of report modal on low width screens
+- Fix Telegram Logo being replaced with Mastodon logo in ShareGroupModal
+- Change URL for Mastodon Share Manager
+- Fix receiving Flag activities on federated events
+- Fix activity notifications by preloading user.activity_settings
+- Fix text overflow on group card description
+- Exclude tags with more than 40 characters from being extracted
+- Avoid duplicate tags with different casing
+- Fix invalid HTML (<div> inside <label>)
+- Fix latest group not refreshing in admin section
+- Add missing "relay@" part of federated address to follow
+- Fix Ueberauth use of CSRF with session
+- Fix being an administrator when using 3rd-party auth provider
+- Make sure activity recipient can't be nil
+- Make sure users can't create profiles or groups with non-valid patterns
+- Add description field to address representation
+- Make sure prompt show the correct message and not just "Continue?" in mix mode
+- Make sure activity notification recaps can't be sent multiple times
+- Fix group notification of new event being sent multiple times
+- Fix links to group page in group membership emails and participation
+- Fix clicking on map crashing the app
+
+### Translations
+
+- Arabic
+- Basque
+- Belarusian
+- Bengali
+- Catalan
+- Chinese (Traditional)
+- Croatian
+- Czech
+- Danish
+- Dutch
+- Esperanto
+- Finnish
+- French
+- Gaelic
+- Galician
+- German
+- Hebrew
+- Hungarian
+- Indonesian
+- Italian
+- Japanese
+- Kabyle
+- Kannada
+- Norwegian Nynorsk
+- Occitan
+- Persian
+- Polish
+- Portuguese
+- Portuguese (Brazil)
+- Russian
+- Slovenian
+- Spanish
+- Swedish
+- Welsh
+
+## 2.1.0-rc.6 - 2022-05-11
+
+Changes since rc.5:
+
+- Allow the instance to be followed from Mastodon (through relays)
+- Make sure activity recipient can't be nil
+- Make sure users can't create profiles or groups with non-valid patterns
+- Add description field to address representation
+- Make sure prompt show the correct message and not just "Continue?" in mix mode
+- Add a CLI command to delete actors
+- Make sure activity notification recaps can't be sent multiple times
+- Fix group notification of new event being sent multiple times
+- Fix links to group page in group membership emails and participation
+- Fix clicking on map crashing the app
+- Remove unused fragment from FETCH_PERSON GraphQL query
+
+## 2.1.0-rc.5 - 2022-05-06
+
+Changes since rc.4:
+
+- Add appropriate timeouts for Repo.transactions
+- Remove OS-specific packages
+- Remove refresh instance triggers
+- Add a proper error message when adding an instance follow that doesn't respond
+
+## 2.1.0-rc.4 - 2022-05-03
+
+Changes since rc.3:
+
+- Use upstream dependencies for Ueberauth providers
+- Fix Ueberauth use of CSRF with session
+- Fix being an administrator when using 3rd-party auth provider
+- Include ongoing events in search
+- Send push notification into own task
+- Add Überauth CAS Strategy
+
+## 2.1.0-rc.3 - 2022-04-24
+
+Changes since rc.2:
+
+- Fix activity notifications by preloading user.activity_settings
+- Add "Accept-Language" header to sentry request metadata
+- Hide address blocks when address has no real data
+- Fix text overflow on group card description
+- Exclude tags with more than 40 characters from being extracted
+- Avoid duplicate tags with different casing
+- Fix invalid HTML (<div> inside <label>)
+- Remove attribute type="text/css" from <style> tags
+- Improve actor cards integration
+- Fix latest group not refreshing in admin section
+- Add missing "relay@" part of federated address to follow
+
+## 2.1.0-rc.2 - 2022-04-20
+
+Changes since rc.1:
+
+- Hide the whole metadata block if group has no description
+- Increase task timeout in Refresher to 60 seconds
+- Allow webfinger to be fetched over http (not https) in dev mode
+- Fix rejecting instance follow
+- Allow instance to have non-standard ports
+- Improve reactions when approving/rejecting an instance follow
+- Improve instance admin view for mobile
+- Allow to reject instance following
+- Fix pagination of group events
+- Add pagination to the instances list
+- Upgrade deps
+- Eventually fetch actors in mentions
+- Add proper fallback for when a TZ isn't registered
+- Improve IdentityPicker
+- Hide side of report modal on low width screens
+- Improve JoinGroupWithAccount component
+- Various group and posts improvements
+- Fix Telegram Logo being replaced with Mastodon logo in ShareGroupModal
+- Change URL to Mastodon Share Manager
+- Improve ActorInline component
+- Avoid assuming we're on Debian-based in release build
+- Fix receiving Flag activities on federated events
+- Update schema.graphql file
+
+## 2.1.0-rc.1 - 2022-04-18
+
+Changes since beta.3:
+
+- Fix posts creation
+- Fix some typespecs
+- Remove Koena Connect button
+- Update dependencies
+
+## 2.1.0-beta.3 - 2022-04-09
+
+Changes since beta.2:
+
+- Add Fedora and Alpine builds
+
+## 2.1.0-beta.2 - 2022-04-08
+
+Changes since beta.1 :
+
+- Build release packages for several distributions (Debian Bullseye, Debian Buster, Ubuntu Focal, Ubuntu Bionic) because of libc version changes
+
+## 2.1.0-beta.1 - 2022-04-07
+
+### Added
+
+- Added an event category field. Administrators can extend the pre-configured list of categories through configuration.
+- Added possibility for administrators to have analytics (Matomo, Plausible supported) and error handling (Sentry supported) on front-end.
+- Redesigned federation admin section with dedicated instance pages
+- Allow to filter moderation reports by domain
+- Added a button to go to past events of a group if it has no upcoming events
+
+### Changed
+
+- Changed mailer library from Bamboo to Swoosh, should fix emails being considered spam. **Some configuration changes are required, see below.**
+- Expose some fields to ActivityStreams event representation: `isOnline`, `remainingAttendeeCapacity` and `participantCount`
+- Expose a new field to ActivityStreams group representation: `memberCount`
+- Improve group creation errors feedback
+- Only display locality in event card
+- Stale groups are now excluded from group search
+- Event default visibility is now set according to group privacy setting
+
+### Fixed
+
+- Fixed actor refreshment being impossible
+- Fixed ical export for undefined datetimes
+- Fixed parsing links with hashtag characters
+- Fixed fetching link details from Twitter
+- Fixed Thunderbird accessing ICS feed endpoint with special `Accept` HTTP header
+- Make sure every ICS/Feed caches are emptied when modifying entities
+- Fixed time issues with DST changes
+- Fixed group preview card not truncating description
+- Fixed redirection after login
+- Fixed user admin section showing button to confirm user when the user is already confirmed
+- Fixed creating event from group view not always setting the group as organizer
+- Fixed invalid addresses blocking event metadata preview rendering
+- Fixed group deletion with comments that caused foreign key issues
+- Fixed incoming Accept activities from participations we don't already have
+- Fixed resources that didn't have metadata size limits
+- Properly fallback to UTC when sending notifications and the user doesn't have a timezone setting set
+
+### Translations
+
+- Arabic
+- Basque
+- Belarusian
+- Bengali
+- Catalan
+- Chinese (Traditional)
+- Croatian
+- Czech
+- Danish
+- Dutch
+- Esperanto
+- Finnish
+- French
+- Gaelic
+- Galician
+- German
+- Hebrew
+- Hungarian
+- Indonesian
+- Italian
+- Japanese
+- Kabyle
+- Kannada
+- Norwegian Nynorsk
+- Occitan
+- Persian
+- Polish
+- Portuguese
+- Portuguese (Brazil)
+- Russian
+- Slovenian
+- Spanish
+- Swedish
+- Welsh
+
+## 2.0.2 - 2021-12-22
+
+### Changed
+
+- Improved handling of media file deletion
+- Releases and Docker image are now using Elixir 1.13
+
+### Fixed
+
+- Fixed position of tentative tag on event cards
+- Fixed text overflow when a link is too long in event mobile view
+- Fixed filtering user own memberships and group members in event organizer & contacts picker
+- Fixed first day of week not depending on locale in the datetime picker
+- Fixed the admin page when a group/profile/user was not found
+- Fixed group members pagination on admin group profile view
+- Fixed admin edition of the instance's language
+
+### Translations
+
+- Croatian
+- Czech
+- Esperanto
+- German
+- Hebrew
+- Occitan
+- Persian
+- Russian
+- Spanish
+
+## 2.0.1 - 2021-11-26
+
+### Changed
+
+- Remove litepub context
+
+### Fixed
+
+- Make sure my group upcoming events are ordered by their start date
+- Fix event participants pagination
+- Always focus the search field after results have been fetched
+- Don't sign fetches to instance actor when refreshing their keys
+- Fix reject of already following instances
+- Added missing timezone data to the Docker image
+- Replace @tiptap/starter-kit with indidual extensions, removing unneeded extensions that caused issues on old Firefox versions
+- Better handling of Friendica Update activities without actor information
+- Always show pending/cancelled status on event cards
+- Fixed nightly docker build
+- Refresh loggeduser information before the final step of onboarding, avoiding loop when finishing onboarding
+- Handle tz_world data being absent
+
+### Translations
+
+- Croatian (New !)
+- Czech
+- Gaelic
+- Hungarian
+- Indonesian
+- Welsh (New !)
+
+## 2.0.0 - 2021-11-23
+
+Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/main/UPGRADE.md#upgrading-from-13-to-20) file as well.
+
+### Added
+
+- Added possibility to follow groups and be notified from new upcoming events
+- Export list of participants to CSV, `PDF` and `ODS`
+- Allow to set timezone for an event. The timezone is automatically defined from the address if one is defined. If the event timezone is different than the user's current one, a toggle is shown to switch between the two.
+- Added initial support for Right To Left languages (such as arabic) and [BiDi](https://en.wikipedia.org/wiki/Bidirectional_text)
+- Group followers and members get an notification email by default when a group publishes a new event (subject to activity notification settings)
+- Group admins can now approve or deny new memberships
+- Build releases in `arm` and `arm64` format in addition to `amd64`
+- Build Docker images in `arm` and `arm64` format in addition to `amd64`
+- Added possibility to indicate the event is fully online
+- Added possibility to search only for online events
+- Added possibility to search only in past events
+- Detect event, comments and posts languages automatically. Allows setting language
+- Allow to change an user's password through the users.modify mix task
+- Add instance setting so that only the admin can create groups
+- Add instance setting so that only groups can create events
+- Added JSON-LD metadata about the event in emails
+- Added a quick link to email notification settings at the bottom of emails
+- Allow to access Mobilizon with a specific language directly by using `https://instance.tld/lang` where `lang` is a language supported by Mobilizon
+- Added organizer actor name (profile or group) in the icalendar export
+- Add initial support for federation with Gancio
+
+### Changed
+
+- Multiple UI improvements, including post, event and participation cards, discussions and emails. The « My Events » page was also redesigned to allow showing events from your groups.
+- Various accessibility improvements
+- Event update notification is send to participants ~30 minutes after the event update, so that successive edits are throttled.
+- Event, post and comments titles and content now have expose their detected language in HTML, for improved screen reader experience
+- Delete current actor ID as well from local storage when unlogging
+- Show a default text for instance contact in default terms text when no instance contact is set
+- Only show locatecontrol button in leaflet map when we can do geolocation
+- Disable push column in notification settings when push is not available
+- Show actual language instead of language code in Users admin view
+- Empty old & new passwords fields when successful password change
+- Don't link to the group page from admin when actor is suspended
+- Warn participants when the event organizer is suspended (and therefore the event cancelled)
+- Improve metadata on public page
+- Make sure some event action pages (participate remotely or without an account) don't get indexed by search engines
+- Only send `Tombstone` element in `Delete` activities, not the whole previous deleted element.
+- Make sure `Delete` activity are send correctly to everyone
+- Only add address and tags to event icalendar export if they exist
+- `master` branch has been renamed to `main`
+- Mention following groups on the registration page
+- Add missing group name to activity notifications
+- Warn while registering and logging when the email contains uppercase characters
+- Improve json-ld metadata on event live streams
+- Add "eventAttendanceMode" to JSON-ld schema.org event representation
+- Improve sending pending participation notifications
+- Add "formerType" and "delete" attributes on Tombstones ActivityPub objects representation
+- Improve MyEvents page description text
+
+### Removed
+
+- Support for Elixir < 1.12 and OTP < 22
+
+### Fixed
+
+- Fix tags autocomplete
+- Fix config onboarding after LDAP initial connexion
+- Fix events pagination on tags page
+- Fixed deduplicated files from orphan media being deleted as well
+- Fix deleting own account
+- Fix search returning user profiles instead of only groups
+- Fix federating geo coordinates
+- Fix an issue with group activity items when moving resources
+- Fix an issue with Identity Picker
+- Fix an issue with TagInput
+- Fix an issue when leaving a group
+- Fix admin settings edition
+- Fix an issue when showing public page of suspended group
+- Removed non existing page (`/about/mobilizon`) from sitemap
+- Fix action logs containing group suspension events
+- Fixed group physical address not exposed to ActivityPub
+- Release front-end files are no longer in duplicate
+- Only show datetime timezone toggle on event if the timezone offset is different from our own
+- Fix error when determining audience for Discussion when deleting a comment
+- Fix a couple of accessibility issues
+- Limit to acceptable tags when pasting raw HTML into comment fields on front-end
+- Fixed group map display
+- Fixed updating group physical address
+- Allow group members to access group drafts
+- Improve group refreshment workflow
+- Fixed date signature generation for federation
+- Fixed an issue when duplicating a group event from another profile
+- Fixed event metadata not saved on eventcreation
+- Use a different pagination parameter for searched events and featured events on search page
+- Fixed creating group activities when creating events with some fields
+- Move release package at correct path for CI upload
+- Fixed event contacts that were not exposed and fetched over federation
+- Don't sign fetch when fetching actor for a given signature
+- Some various HTTP signatures issues
+- Fixed actor AP representation of avatar
+- Handle errors when fetching actor pictures
+- Fixed sending group events to followers on Mastodon
+- Fixed actors avatars and banners being deleted if the same file was also an orphan media
+- Fix spacing in organizer picker
+- Increase number of close events and follow group events
+- Fix accessing user profile in admin section
+- Set initial values for some EventMetadata elements, fixing submitting them right away with no value
+- Avoid giving an error page if the apollo futureParticipations query is undefined
+- Fixed path to exports in production
+- Fixed padding below truncated title of event cards
+- Fixed exports that weren't enabled in Docker
+- Fixed error page when event end date is null
+- Fixed event language not being allowed to be null
+
+### Security
+
+- Fixed private messages sent as event replies from Mastodon that were shown publically as public comments. They are now discarded.
+
+### Translations
+
+- Czech
+- Gaelic
+- German
+- Hungarian
+- Indonesian
+- Norwegian Nynorsk
+- Occitan
+- Persian
+- Portuguese (Brazil)
+- Russian
+- Slovenian
+- Spanish
+
+## 2.0.0-rc.3 - 2021-11-22
+
+This lists changes since 2.0.0-rc.3. Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/main/UPGRADE.md#upgrading-from-13-to-20) file as well.
+
+### Fixed
+
+- Fixed path to exports in production
+- Fixed padding below truncated title of event cards
+- Fixed exports that weren't enabled in Docker
+- Fixed error page when event end date is null
+
 ## 2.0.0-rc.2 - 2021-11-22

 This lists changes since 2.0.0-rc.1. Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/main/UPGRADE.md#upgrading-from-13-to-20) file as well.
@ -13,11 +518,13 @@ This lists changes since 2.0.0-rc.1. Please read the [UPGRADE.md](https://framag
 - Improve MyEvents page description text

 ### Fixed
+
 - Fix spacing in organizer picker
 - Increase number of close events and follow group events
 - Fix accessing user profile in admin section
 - Set initial values for some EventMetadata elements, fixing submitting them right away with no value
 - Avoid giving an error page if the apollo futureParticipations query is undefined
+
 ### Translations

 - German
@ -38,6 +545,7 @@ This lists changes since 2.0.0-beta.2. Please read the [UPGRADE.md](https://fram
 - Add "formerType" and "delete" attributes on Tombstones ActivityPub objects representation

 ### Fixed
+
 - Fixed creating group activities when creating events with some fields
 - Move release package at correct path for CI upload
 - Fixed event contacts that were not exposed and fetched over federation
@ -56,6 +564,7 @@ This lists changes since 2.0.0-beta.2. Please read the [UPGRADE.md](https://fram
 ## 2.0.0-beta.2 - 2021-11-15

 This lists changes since 2.0.0-beta.1. Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/main/UPGRADE.md#upgrading-from-13-to-20) file as well.
+
 ### Added

 - Group followers and members get an notification email by default when a group publishes a new event (subject to activity notification settings)
@ -92,6 +601,7 @@ This lists changes since 2.0.0-beta.1. Please read the [UPGRADE.md](https://fram
 ## 2.0.0-beta.1 - 2021-11-09

 Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/main/UPGRADE.md#upgrading-from-13-to-20) file as well.
+
 ### Added

 - Added possibility to follow groups and be notified from new upcoming events
@ -156,6 +666,7 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 ### Security

 - Fixed private messages sent as event replies from Mastodon that were shown publically as public comments. They are now discarded.
+
 ### Translations

 - Czech
@ -223,7 +734,7 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 ### Fixed

 - Fixed links contained in event & post description that didn't open in new tabs
- Add back missing RSS/ical links on public group pages 
+- Add back missing RSS/ical links on public group pages
 - Fixed links to Framacolibri forum
 - Fixed drafts and restricted visibility events & posts listed on group page
 - Fixed notification page on Safari
@ -245,7 +756,6 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 - Fixed token refreshment issues
 - Fixed search from 404 page

-
 ### Translations

 - Catalan
@ -271,9 +781,10 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 - Fixed group discussions with deleted comments

 ## 1.2.2 - 2021-07-01
+
 ### Changed

- Improved UI for participations when message is too long 
+- Improved UI for participations when message is too long

 ### Fixed

@ -281,7 +792,7 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 - Fixed crash when trying to notify activities not from groups
 - Fixed imagemagick missing from Dockerfile
 - Fixed push notifications for group, members & post activities
- Fixed ellipsis in DiscussionListView 
+- Fixed ellipsis in DiscussionListView
 - Fixed submission button for posts not visible on mobile
 - Fixed remote profile suspension

@ -297,6 +808,7 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 - Fixed compatibility check in Notification section for service workers

 ## 1.2.0 - 2021-06-29
+
 ### Added

 - **Notifications for various group and event activity, both by email and browser push notifications. Daily and weekly digests are also available.**
@ -311,7 +823,7 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 - **Various improvements to mobile views**
 - Make JWT access tokens short-lived
 - Disabled Cldr warning that the `Cldr.Plug.AcceptLanguage` plug didn't many any known locale
- Replaced GraphiQL web interface with graphql-playground 
+- Replaced GraphiQL web interface with graphql-playground

 ### Removed

@ -471,7 +983,7 @@ Please read the [UPGRADE.md](https://framagit.org/framasoft/mobilizon/-/blob/mai
 ### Changed

 - Added an unique index on the addresses url
- Added org.opencontainers.image.source annotation to the Docker image 
+- Added org.opencontainers.image.source annotation to the Docker image
 - Improved the moderation action logs interface

 ### Fixes
@ -592,7 +1104,7 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 - Fixed getting metadata from tweets when creating a resource
 - Fixed bad handling of duplicate usernames
 - Fixed handling of bad URIs to proxify
- Fixed creating discussion with title containing only spaces 
+- Fixed creating discussion with title containing only spaces
 - Fixed registering new user account with same email as unconfirmed
 - Fixed handling changing default actor unlogged
 - Fixed handling getting organized events from an actor when not authorized
@ -664,6 +1176,7 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 - Hungarian
 - Russian
 - Spanish
+
 ## 1.1.0-rc.1 - 2021-03-29

 ### Added
@ -689,7 +1202,7 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 - Fixed getting metadata from tweets when creating a resource
 - Fixed bad handling of duplicate usernames
 - Fixed handling of bad URIs to proxify
- Fixed creating discussion with title containing only spaces 
+- Fixed creating discussion with title containing only spaces
 - Fixed registering new user account with same email as unconfirmed
 - Fixed handling changing default actor unlogged
 - Fixed handling getting organized events from an actor when not authorized
@ -711,11 +1224,13 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 ## 1.1.0-beta.6 - 2021-03-17

 ### Fixed
+
 - Fixed a typo in range/radius showing the wrong radius for close events on homepage

 ## 1.1.0-beta.5 - 2021-03-17

 ### Fixed
+
 - Fixed a typo in range/radius preventing close events from showing up

 ## 1.1.0-beta.4 - 2021-03-17
@ -729,15 +1244,18 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 ## 1.1.0-beta.3 - 2021-03-16

 ### Fixed
+
 - Handle ActivityPub Fetcher returning text that's not JSON
 - Fix accessing a group profile when not a member

 ## 1.1.0-beta.2 - 2021-03-16

 ### Fixed
+
 - Fixed geospatial configuration only being evaluated at compile-time, not at runtime

 ### Translations
+
 - Slovenian

 ## 1.1.0-beta.1 - 2021-03-10
@ -879,23 +1397,23 @@ This version introduces a new way to install and host Mobilizon : Elixir releas

 ### Special operations

-* **Reattach media files to their entity.**
+- **Reattach media files to their entity.**
  When media files were uploaded and added in events and posts bodies, they were only attached to the profile that uploaded them, not to the event or post. This task attaches them back to their entity so that the command to clean orphan media files doesn't remove them.

-  * Source install
+  - Source install
    `MIX_ENV=prod mix mobilizon.maintenance.fix_unattached_media_in_body`
-  * Docker
+  - Docker
    `docker-compose exec mobilizon mobilizon_ctl maintenance.fix_unattached_media_in_body`

-* **Refresh remote profiles to save avatars locally**
+- **Refresh remote profiles to save avatars locally**
  Profile avatars and banners were previously only proxified and cached. Now we save them locally. Refreshing all remote actors will save profile media locally instead.

-  * Source install
+  - Source install
    `MIX_ENV=prod mix mobilizon.actors.refresh --all`
-  * Docker
+  - Docker
    `docker-compose exec mobilizon mobilizon_ctl actors.refresh --all`

-* **imagemagick and webp are now a required dependency** to build Mobilizon.
+- **imagemagick and webp are now a required dependency** to build Mobilizon.
  Optimized versions of Mobilizon's pictures are now produced during front-end build.
  See [the documentation](https://docs.joinmobilizon.org/administration/dependencies/#misc) to make sure these dependencies are installed.

@ -938,7 +1456,7 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 - Fixed error message not showing up when you are already an anonymous participant for an event
 - Fixed error message not showing up when you pick an username already in user for a new profile or a group
 - Fixed translations not fallbacking properly to english when not found
- 
+-

 ### Security

@ -947,6 +1465,7 @@ This version introduces a new way to install and host Mobilizon : Elixir releas
 ### Translations

 Updated translations:
+
 - Catalan
 - Dutch
 - English
@ -1119,20 +1638,21 @@ Updated translations:

 ### Special operations

-* We added `application/ld+json` as acceptable MIME type for ActivityPub requests, so you'll need to recompile the `mime` library we use before recompiling Mobilizon:
-    ```
-    MIX_ENV=prod mix deps.clean mime --build
-    ```
+- We added `application/ld+json` as acceptable MIME type for ActivityPub requests, so you'll need to recompile the `mime` library we use before recompiling Mobilizon:

-* The [nginx configuration](https://framagit.org/framasoft/mobilizon/-/blob/main/support/nginx/mobilizon.conf) has been changed with improvements and support for custom error pages.
+  ```
+  MIX_ENV=prod mix deps.clean mime --build
+  ```

-* The cmake dependency has been added (see [our documentation](https://docs.joinmobilizon.org/administration/dependencies/#basic-tools))
+- The [nginx configuration](https://framagit.org/framasoft/mobilizon/-/blob/main/support/nginx/mobilizon.conf) has been changed with improvements and support for custom error pages.
+
+- The cmake dependency has been added (see [our documentation](https://docs.joinmobilizon.org/administration/dependencies/#basic-tools))

 ### Added

 - Possibility to login using LDAP
 - Possibility to login using OAuth providers
- Enabled group features in production mode 
+- Enabled group features in production mode
  - including posts (that can be public, unlisted, or restricted to your group members)
  - resources (collections of links, with folders, accessible to your group members)
  - discussions (group private and organized chats)
@ -1156,11 +1676,12 @@ Updated translations:
 ### Security

 - Fix group settings being accessible and editable by non-group-admins (thx @pigpig for reporting this responsibly)
- Fix events being editable by profiles without permissions (thx @pigpig for reporting this responsibly) 
+- Fix events being editable by profiles without permissions (thx @pigpig for reporting this responsibly)

 ## [1.0.0-beta.3] - 2020-06-24

 ### Special operations
+
 Config has moved from `.env` files to a more traditional way to handle things in the Elixir world, with `.exs` files.

 To migrate existing configuration, you can simply run `mix mobilizon.instance gen` and fill in the adequate values previously in `.env` files (you don't need to perform the operations to create the database).
@ -1170,6 +1691,7 @@ A minimal file template [is available](https://framagit.org/framasoft/mobilizon/
 Also make sure to remove the `EnvironmentFile=` line from the systemd service and set `Environment=MIX_ENV=prod` instead. See [the updated file](https://framagit.org/framasoft/mobilizon/blob/main/support/systemd/mobilizon.service).

 ### Added
+
 - Possibility to participate to an event without an account (confirmation through email required)
 - Possibility to participate to a remote event (being redirected by providing federated identity)
 - Possibility to add a note as a participant when event participation is manually validated (required when participating without an account)
@ -1186,6 +1708,7 @@ Also make sure to remove the `EnvironmentFile=` line from the systemd service an
 - Allow user to change language

 ### Changed
+
 - Configuration handling (see above)
 - Improved a bit color theme
 - Signature validation also now checks if `Date` header has acceptable values
@ -1196,6 +1719,7 @@ Also make sure to remove the `EnvironmentFile=` line from the systemd service an
 - Improved public event page

 ### Fixed
+
 - Fixed URL search
 - Fixed content accessed through URL search being public
 - Fix event links in some emails
@ -1203,17 +1727,21 @@ Also make sure to remove the `EnvironmentFile=` line from the systemd service an
 ## [1.0.0-beta.2] - 2019-12-18

 ### Special operations
+
 These two operations couldn't be handled during migrations.
 They are optional, but you won't be able to search or get participant stats on existing events if they are not executed.
 These commands will be removed in Mobilizon 1.0.0-beta.3.

 In order to populate search index for existing events, you need to run the following command (with prod environment):
-* `mix mobilizon.setup_search`
+
+- `mix mobilizon.setup_search`

 In order to move participant stats to the event table for existing events, you need to run the following command (with prod environment):
-* `mix mobilizon.move_participant_stats`
+
+- `mix mobilizon.move_participant_stats`

 ### Added
+
 - Federation is active
 - Added an interface for admins to view and manage instance followers and followings
 - Ability to comment below events
@ -1238,6 +1766,7 @@ In order to move participant stats to the event table for existing events, you n
 - Upgraded frontend and backend dependencies

 ### Changed
+
 - Move participant stats to event table **(read special instructions above)**
 - Limit length (20 characters) and number (10) of tags allowed
 - Added some backend changes and validation for field length
@ -1251,6 +1780,7 @@ In order to move participant stats to the event table for existing events, you n
 - Also consider the PeerTube `CommentsEnabled` property to know if you can reply to an event

 ### Fixed
+
 - Fix event URL validation and check if hostname is correct before showing it
 - Fix participations stats on the MyEvents page
 - Fix event description lists margin
@ -1280,8 +1810,11 @@ In order to move participant stats to the event table for existing events, you n
 - Fixed event HTML representation when `GET` request has no `Accept` header

 ### Security
+
 - Sanitize event title to avoid XSS

 ## [1.0.0-beta.1] - 2019-10-15
+
 ### Added
+
 - Initial release
--- a/README.md
+++ b/README.md
@ -20,7 +20,7 @@ Mobilizon is your federated organization and mobilization platform. Gather peopl

 Mobilizon is a tool designed to create platforms for managing communities and events. Its purpose is to help as many people as possible to free themselves from Facebook groups and events, from Meetup, etc.

-The Mobilizon software is under a Free licence, so anyone can host a Mobilizon server, called an instance. These instances may federate with each other, so any person with an account on *ExampleMeet* will be able to register to an event created on *SpecimenEvent*.
+The Mobilizon software is under a Free licence, so anyone can host a Mobilizon server, called an instance. These instances may federate with each other, so any person with an account on _ExampleMeet_ will be able to register to an event created on _SpecimenEvent_.

 ## ✨ Features

@ -33,7 +33,7 @@ You will have the power to create multiple identities from the same account, lik

 ### 📅 Events and groups

-Create your events and make sure they will appeal to everybody. 
+Create your events and make sure they will appeal to everybody.
 Privacy settings and participants roles are supported.
 There's no lock-in, you can interact with the event without registration.

@ -46,23 +46,26 @@ We appreciate any contribution to Mobilizon. Check our [CONTRIBUTING](CONTRIBUTI
 ## Links

 ### Learn more
-  * 🌐 Official website: [https://joinmobilizon.org](https://joinmobilizon.org)
-  * 🔢 Pick an instance [https://mobilizon.org](https://mobilizon.org)
-  * 💻 Source: [https://framagit.org/framasoft/mobilizon](https://framagit.org/framasoft/mobilizon)
-  * 📜 Documentation [https://docs.joinmobilizon.org](https://docs.joinmobilizon.org)
-  
+
+- 🌐 Official website: [https://joinmobilizon.org](https://joinmobilizon.org)
+- 🔢 Pick an instance [https://mobilizon.org](https://mobilizon.org)
+- 💻 Source: [https://framagit.org/framasoft/mobilizon](https://framagit.org/framasoft/mobilizon)
+- 📜 Documentation [https://docs.joinmobilizon.org](https://docs.joinmobilizon.org)
+
 ### Discuss
-  * 💬 Element/Matrix: [https://matrix.to/#/#Mobilizon:matrix.org](https://matrix.to/#/#Mobilizon:matrix.org)
-  * 🗣️ Forum: [https://framacolibri.org/c/mobilizon](https://framacolibri.org/c/mobilizon)
+
+- 💬 Element/Matrix: [https://matrix.to/#/#Mobilizon:matrix.org](https://matrix.to/#/#Mobilizon:matrix.org)
+- 🗣️ Forum: [https://framacolibri.org/c/mobilizon](https://framacolibri.org/c/mobilizon)

 ### Follow
-  * 🐘 Mastodon: [https://framapiaf.org/@mobilizon](https://framapiaf.org/@mobilizon)
-  * 🐦 Twitter [https://twitter.com/@joinmobilizon](https://twitter.com/@joinmobilizon)
-  
+
+- 🐘 Mastodon: [https://framapiaf.org/@mobilizon](https://framapiaf.org/@mobilizon)
+- 🐦 Twitter [https://twitter.com/@joinmobilizon](https://twitter.com/@joinmobilizon)
+
 Note: Most federation code comes from [Pleroma](https://pleroma.social), which is `Copyright © 2017-2018 Pleroma Authors - AGPL-3.0`.

-
 ## ❤️ Supports of our crowdfunding
+
 ---

 We have run [a crowdfunding campaign](https://framablog.org/2019/05/14/mobilizon-lets-finance-a-software-to-free-our-events-from-facebook/) to pave the road to the version 1.0.0 of Mobilizon. Thanks to everyone who pitched in and shared the news around! The list of [everyone who donated is available here](https://joinmobilizon.org/hall-of-fame).
--- a/SECURITY.md
+++ b/SECURITY.md
@ -5,15 +5,15 @@ Framasoft, the Mobilizon maintainer team and community take all security bugs in

 ### Goals

-* Mobilizon users can understand the distinctions between public data and private data/metadata on Mobilizon.
+- Mobilizon users can understand the distinctions between public data and private data/metadata on Mobilizon.

-* Users always know where their private data/metadata resides, who has access to it, and are able to access, export, and delete it.
+- Users always know where their private data/metadata resides, who has access to it, and are able to access, export, and delete it.

-* Protect private user data/metadata, not just from hackers but also (as much as is possible) from other users, instance admins, community moderators, and external applications.
+- Protect private user data/metadata, not just from hackers but also (as much as is possible) from other users, instance admins, community moderators, and external applications.

-* Secure from malicious creation, alteration or deletion of public data.
+- Secure from malicious creation, alteration or deletion of public data.

-* GDPR compliance.
+- GDPR compliance.

 Framasoft is both a developer of open-source/free/libre self-hosted software, and a service provider with users in the European Union. As a result, we are putting user privacy, data sovereignty, and GDPR compliance into our security plans, including asking both the Framasoft community and outside hackers to review our approaches and implementations.

@ -21,11 +21,11 @@ Framasoft is both a developer of open-source/free/libre self-hosted software, an

 [Mobilizon](https://joinmobilizon.org) will be challenging to keep secure, as it is:

-* open source, both back-end and front-end
+- open source, both back-end and front-end

-* self-hosted by diverse organisations and individuals
+- self-hosted by diverse organisations and individuals

-* federated (data is transmitted between different hosted instances)
+- federated (data is transmitted between different hosted instances)

 This means there are more attack surfaces compared to typical proprietary, centralised platforms, but also means that hackers and even users can review every part of Mobilizon and make sure that it works as expected. This should result in more secure software, and higher trust in the application and its ecosystem.

@ -33,14 +33,14 @@ This means there are more attack surfaces compared to typical proprietary, centr

 We are committed to working with security researchers to verify, reproduce, and respond to legitimate reported vulnerabilities. You can help us by following these simple guidelines:

-* Alert us about the vulnerability as soon as you become aware of it by emailing the lead maintainer at tcit+mobilizon@framasoft.org.
-* Provide details needed to reproduce and validate the vulnerability and a Proof of Concept (PoC) as soon as possible
-* Act in good faith to avoid privacy violations, destruction of data, and interruption or degradation of services
-* Do not access or modify users’ private data, without explicit permission of the owner. Only interact with your own accounts or test accounts for security research purposes;
-* Contact Framasoft or a maintainer of the Mobilizon project (or the instance admin) immediately if you do inadvertently encounter user data. Do not view, alter, save, store, transfer, or otherwise access the data, and immediately purge any local information upon reporting the vulnerability;
-* The lead maintainer will acknowledge your email within 48 hours, and will send a more detailed response within 48 hours indicating the next steps in handling your report. After the initial reply to your report, the security team will endeavor to keep you informed of the progress towards a fix and full announcement, and may ask for additional information or guidance.
-* Give us time to confirm, determine the affected versions and prepare fixes to correct the issue before disclosing it to other parties (if after waiting a reasonable amount of time, we are clearly unable or unwilling to do anything about it, please do hold us accountable!)
-* Please test against a local instance of the software, and refrain from running any Denial of Service or automated testing tools against Framasoft's (and our partners') infrastructure
+- Alert us about the vulnerability as soon as you become aware of it by emailing the lead maintainer at tcit+mobilizon@framasoft.org.
+- Provide details needed to reproduce and validate the vulnerability and a Proof of Concept (PoC) as soon as possible
+- Act in good faith to avoid privacy violations, destruction of data, and interruption or degradation of services
+- Do not access or modify users’ private data, without explicit permission of the owner. Only interact with your own accounts or test accounts for security research purposes;
+- Contact Framasoft or a maintainer of the Mobilizon project (or the instance admin) immediately if you do inadvertently encounter user data. Do not view, alter, save, store, transfer, or otherwise access the data, and immediately purge any local information upon reporting the vulnerability;
+- The lead maintainer will acknowledge your email within 48 hours, and will send a more detailed response within 48 hours indicating the next steps in handling your report. After the initial reply to your report, the security team will endeavor to keep you informed of the progress towards a fix and full announcement, and may ask for additional information or guidance.
+- Give us time to confirm, determine the affected versions and prepare fixes to correct the issue before disclosing it to other parties (if after waiting a reasonable amount of time, we are clearly unable or unwilling to do anything about it, please do hold us accountable!)
+- Please test against a local instance of the software, and refrain from running any Denial of Service or automated testing tools against Framasoft's (and our partners') infrastructure

 Note : Please report security bugs in third-party modules to the person or team maintaining the module.

--- a/UPGRADE.md
+++ b/UPGRADE.md
@ -1,14 +1,56 @@
+# Upgrading from 2.0 to 2.1
+
+## Mailer library change
+
+### Docker
+
+The change is already applied. You may remove the `MOBILIZON_SMTP_HOSTNAME` environment key which is not used anymore.
+
+### Release and source mode
+
+In your configuration file under `config :mobilizon, Mobilizon.Web.Email.Mailer`,
+
+- Change `Bamboo.SMTPAdapter` to `Swoosh.Adapters.SMTP`,
+- rename the `server` key to `relay`
+- remove the `hostname` key,
+- the default value of the username and password fields is an empty string and no longer `nil`.
+
+```diff
+ config :mobilizon, Mobilizon.Web.Email.Mailer,
+-   adapter: Bamboo.SMTPAdapter,
+   adapter: Swoosh.Adapters.SMTP,
+-   server: "localhost",
+   relay: "localhost",
+-   hostname: "localhost",
+   # usually 25, 465 or 587
+   port: 25,
+-   username: nil,
+   username: "",
+-   password: nil,
+   password: "",
+   # can be `:always` or `:never`
+   tls: :if_available,
+   allowed_tls_versions: [:tlsv1, :"tlsv1.1", :"tlsv1.2"],
+   retries: 1,
+   # can be `true`
+   no_mx_lookups: false,
+   # can be `:always`. If your smtp relay requires authentication set it to `:always`.
+   auth: :if_available
+```
+
 # Upgrading from 1.3 to 2.0

 Requirements dependencies depend on the way Mobilizon is installed.
+
 ## New Elixir version requirement
+
 ### Docker and Release install

 You are already using latest Elixir version in the release tarball and Docker images.

 ### Source install

-**Elixir 1.12 and Erlang OTP 22 are now required**. If your distribution doesn't provide these versions (which is likely), you must uninstall them and install [Elixir](https://github.com/asdf-vm/asdf-elixir) through the [ASDF tool](https://asdf-vm.com/).
+**Elixir 1.12 and Erlang OTP 22 are now required**. If your distribution or the repositories from Erlang Solutions don't provide these versions, you need to uninstall the current versions and install [Elixir](https://github.com/asdf-vm/asdf-elixir) through the [ASDF tool](https://asdf-vm.com/).

 ## Geographic timezone data

@ -17,24 +59,27 @@ Mobilizon 2.0 uses data based on [timezone-boundary-builder](https://github.com/
 ### Docker install

 The geographic timezone data is already bundled into the image, you have nothing to do.
+
 ### Release install

 In order to keep the release tarballs light, the geographic timezone data is not bundled directly. You need to download the data :
-* either raw from Github, but **requires an extra ~1Gio of memory** to process the data
+
+- either raw from Github, but **requires an extra ~1Gio of memory** to process the data

  ```sh
  sudo -u mobilizon mkdir /var/lib/mobilizon/timezones
  sudo -u mobilizon ./bin/mobilizon_ctl tz_world.update
  ```

-* either already processed from our own distribution server
+- either already processed from our own distribution server

  ```sh
  sudo -u mobilizon mkdir /var/lib/mobilizon/timezones
  sudo -u mobilizon curl -L 'https://packages.joinmobilizon.org/tz_world/timezones-geodata.dets' -o /var/lib/mobilizon/timezones/timezones-geodata.dets
  ```

-In both cases, ~700Mio of disk will be used. You may use the following configuration to specify where the data is expected:
+In both cases, ~700Mio of disk will be used. You may use the following configuration to specify where the data is expected if you decide to change it from the default location (`/var/lib/mobilizon/timezones`) :
+
 ```elixir
 config :tz_world, data_dir: "/some/place"
 ```
@ -42,14 +87,15 @@ config :tz_world, data_dir: "/some/place"
 ### Source install

 You need to download the data :
-* either raw from Github, but **requires an extra ~1Gio of memory** to process the data
+
+- either raw from Github, but **requires an extra ~1Gio of memory** to process the data

  ```sh
  sudo -u mobilizon mkdir /var/lib/mobilizon/timezones
  sudo -u mobilizon mix mobilizon.tz_world.update
  ```

-* either already processed from our own distribution server
+- either already processed from our own distribution server

  ```sh
  sudo -u mobilizon mkdir /var/lib/mobilizon/timezones
@ -57,58 +103,80 @@ You need to download the data :
  ```

 In both cases, ~700Mio of disk will be used. You may use the following configuration to specify where the data is expected:
+
 ```elixir
 config :tz_world, data_dir: "/some/place"
 ```

+## Exports folder
+
+Create the folder for default CSV export:
+
+```sh
+sudo -u mobilizon mkdir -p /var/lib/mobilizon/uploads/exports/csv
+```
+
+This path can be configured, see [the dedicated docs page about this](https://docs.joinmobilizon.org/administration/configure/exports/).
+Files in this folder are temporary and are cleaned once an hour.
+
 ## New optional dependencies

 These are optional, installing them will allow Mobilizon to export to PDF and ODS as well. Mobilizon 2.0 allows to export the participant list, but more is planned.
+
 ### Docker
+
 Everything is included in our Docker image.
+
 ### Release and source install

 New optional Python dependencies:
-* `Python` >= 3.6
-* `weasyprint` for PDF export (with [a few extra dependencies](https://doc.courtbouillon.org/weasyprint/stable/first_steps.html))
-* `pyexcel-ods3` for ODS export (no extra dependencies)

-Both can be installed through pip. You need to enable exports for PDF and ODS in the configuration afterwards. Read [the dedicated docs page about this]() (*upcoming*).
+- `Python` >= 3.6
+- `weasyprint` for PDF export (with [a few extra dependencies](https://doc.courtbouillon.org/weasyprint/stable/first_steps.html))
+- `pyexcel-ods3` for ODS export (no extra dependencies)
+
+Both can be installed through pip. You need to enable and configure exports for PDF and ODS in the configuration afterwards. Read [the dedicated docs page about this](https://docs.joinmobilizon.org/administration/configure/exports/).

 # Upgrading from 1.0 to 1.1

 The 1.1 version of Mobilizon brings Elixir releases support. An Elixir release is a self-contained directory that contains all of Mobilizon's code (front-end and backend), it's dependencies, as well as the Erlang Virtual Machine and runtime (only the parts you need). As long as the release has been assembled on the same OS and architecture, it can be deploy and run straight away. [Read more about releases](https://elixir-lang.org/getting-started/mix-otp/config-and-releases.html#releases).

 ## Comparison
+
 Migrating to releases means:
-* You only get a precompiled binary, so you avoid compilation times when updating
-* No need to have Elixir/NodeJS installed on the system
-* Code/data/config location is more common (/opt, /var/lib, /etc)
-* More efficient, as only what you need from the Elixir/Erlang standard libraries is included and all of the code is directly preloaded
-* You can't hardcode modifications in Mobilizon's code
+
+- You only get a precompiled binary, so you avoid compilation times when updating
+- No need to have Elixir/NodeJS installed on the system
+- Code/data/config location is more common (/opt, /var/lib, /etc)
+- More efficient, as only what you need from the Elixir/Erlang standard libraries is included and all of the code is directly preloaded
+- You can't hardcode modifications in Mobilizon's code

 Staying on source releases means:
-* You need to recompile everything with each update
-* Compiling frontend and backend has higher system requirements than just running Mobilizon
-* You can change things in Mobilizon's code and recompile right away to test changes
+
+- You need to recompile everything with each update
+- Compiling frontend and backend has higher system requirements than just running Mobilizon
+- You can change things in Mobilizon's code and recompile right away to test changes

 ## Releases
+
 If you want to migrate to releases, [we provide a full guide](https://docs.joinmobilizon.org/administration/upgrading/source_to_release/). You may do this at any time.

 ## Source install
+
 To stay on a source release, you just need to check the following things:
-* Rename your configuration file `config/prod.secret.exs` to `config/runtime.exs`.
-* If your config file includes `server: true` under `Mobilizon.Web.Endpoint`, remove it.
-    ```diff
-    config :mobilizon, Mobilizon.Web.Endpoint,
-    - server: true,
-    ```
-* The uploads default directory is now `/var/lib/mobilizon/uploads`. To keep it in the previous `uploads/` directory, just add the following line to `config/runtime.exs`:
+
+- Rename your configuration file `config/prod.secret.exs` to `config/runtime.exs`.
+- If your config file includes `server: true` under `Mobilizon.Web.Endpoint`, remove it.
+  ```diff
+  config :mobilizon, Mobilizon.Web.Endpoint,
+  - server: true,
+  ```
+- The uploads default directory is now `/var/lib/mobilizon/uploads`. To keep it in the previous `uploads/` directory, just add the following line to `config/runtime.exs`:
  ```elixir
  config :mobilizon, Mobilizon.Web.Upload.Uploader.Local, uploads: "uploads"
  ```
  Or you may use any other directory where the `mobilizon` user has write permissions.
-* The GeoIP database default directory is now `/var/lib/mobilizon/geo/GeoLite2-City.mmdb`. To keep it in the previous `priv/data/GeoLite2-City.mmdb` directory, just add the following line to `config/runtime.exs`:
+- The GeoIP database default directory is now `/var/lib/mobilizon/geo/GeoLite2-City.mmdb`. To keep it in the previous `priv/data/GeoLite2-City.mmdb` directory, just add the following line to `config/runtime.exs`:
  ```elixir
  config :geolix, databases: [
    %{
@ -118,4 +186,4 @@ To stay on a source release, you just need to check the following things:
    }
  ]
  ```
-  Or you may use any other directory where the `mobilizon` user has read permissions.
+  Or you may use any other directory where the `mobilizon` user has read permissions.
--- a/config/config.exs
+++ b/config/config.exs
@ -13,14 +13,14 @@ config :mobilizon,
 config :mobilizon, Mobilizon.Storage.Repo, types: Mobilizon.Storage.PostgresTypes

 config :mobilizon, :instance,
-  name: "My Mobilizon Instance",
-  description: "Change this to a proper description of your instance",
+  name: "Mobilizon du Chapril",
+  description: "Instance du Chapril",
  hostname: "localhost",
-  registrations_open: false,
+  registrations_open: true,
  registration_email_allowlist: [],
  registration_email_denylist: [],
  languages: [],
-  default_language: "en",
+  default_language: "fr",
  demo: false,
  repository: Mix.Project.config()[:source_url],
  allow_relay: true,
@ -35,9 +35,9 @@ config :mobilizon, :instance,
  unconfirmed_user_grace_period_hours: 48,
  activity_expire_days: 365,
  activity_keep_number: 100,
-  enable_instance_feeds: false,
-  email_from: "noreply@localhost",
-  email_reply_to: "noreply@localhost"
+  enable_instance_feeds: true,
+  email_from: "noreply@mobilizon.chapril.org",
+  email_reply_to: "noreply@mobilizon.chapril.org"

 config :mobilizon, :groups, enabled: true
 config :mobilizon, :events, creation: true
@ -90,7 +90,7 @@ config :mobilizon, Mobilizon.Web.Upload.Uploader.Local, uploads: "/var/lib/mobil

 config :tz_world, data_dir: "/var/lib/mobilizon/timezones"

-config :mobilizon, Timex.Gettext, default_locale: "en"
+config :mobilizon, Timex.Gettext, default_locale: "fr"

 config :mobilizon, :media_proxy,
  enabled: true,
@ -106,13 +106,16 @@ config :mobilizon, :media_proxy,
  ]

 config :mobilizon, Mobilizon.Web.Email.Mailer,
-  adapter: Bamboo.SMTPAdapter,
-  server: "localhost",
-  hostname: "localhost",
+  adapter: Swoosh.Adapters.SMTP,
+  relay: "localhost",
  # usually 25, 465 or 587
  port: 25,
-  username: nil,
-  password: nil,
+  username: "",
+  password: "",
+  # can be `:always` or `:never`
+  auth: :if_available,
+  # can be `true`
+  ssl: false,
  # can be `:always` or `:never`
  tls: :if_available,
  allowed_tls_versions: [:tlsv1, :"tlsv1.1", :"tlsv1.2"],
@ -185,7 +188,13 @@ config :phoenix, :filter_parameters, ["password", "token"]
 config :absinthe, schema: Mobilizon.GraphQL.Schema
 config :absinthe, Absinthe.Logger, filter_variables: ["token", "password", "secret"]

-config :mobilizon, Mobilizon.Web.Gettext, one_module_per_locale: true
+config :codepagex, :encodings, [
+  :ascii,
+  ~r[iso8859]i,
+  :"VENDORS/MICSFT/WINDOWS/CP1252"
+]
+
+config :mobilizon, Mobilizon.Web.Gettext, split_module_by: [:locale, :domain]

 config :ex_cldr,
  default_locale: "en",
@ -206,7 +215,8 @@ config :mobilizon, :activitypub,
  # One day
  actor_stale_period: 3_600 * 48,
  actor_key_rotation_delay: 3_600 * 48,
-  sign_object_fetches: true
+  sign_object_fetches: true,
+  stale_actor_search_exclusion_after: 3_600 * 24 * 7

 config :mobilizon, Mobilizon.Service.Geospatial, service: Mobilizon.Service.Geospatial.Nominatim

@ -290,6 +300,7 @@ config :mobilizon, Oban,
     crontab: [
       {"@hourly", Mobilizon.Service.Workers.BuildSiteMap, queue: :background},
       {"17 4 * * *", Mobilizon.Service.Workers.RefreshGroups, queue: :background},
+       {"36 * * * *", Mobilizon.Service.Workers.RefreshInstances, queue: :background},
       {"@hourly", Mobilizon.Service.Workers.CleanOrphanMediaWorker, queue: :background},
       {"@hourly", Mobilizon.Service.Workers.CleanUnconfirmedUsersWorker, queue: :background},
       {"@hourly", Mobilizon.Service.Workers.ExportCleanerWorker, queue: :background},
@ -329,10 +340,15 @@ config :mobilizon, Mobilizon.Service.Notifier.Email, enabled: true
 config :mobilizon, Mobilizon.Service.Notifier.Push, enabled: true

 config :mobilizon, :exports,
+  path: "/var/lib/mobilizon/uploads/exports",
  formats: [
-    Mobilizon.Service.Export.Participants.CSV
+    Mobilizon.Service.Export.Participants.CSV,
+    Mobilizon.Service.Export.Participants.PDF,
+    Mobilizon.Service.Export.Participants.ODS
  ]

+config :mobilizon, :analytics, providers: []
+
 # Import environment specific config. This must remain at the bottom
 # of this file so it overrides the configuration defined above.
 import_config "#{config_env()}.exs"
--- a/config/dev.exs
+++ b/config/dev.exs
@ -67,7 +67,7 @@ config :phoenix, :stacktrace_depth, 20
 # Initialize plugs at runtime for faster development compilation
 config :phoenix, :plug_init_mode, :runtime

-config :mobilizon, Mobilizon.Web.Email.Mailer, adapter: Bamboo.LocalAdapter
+config :mobilizon, Mobilizon.Web.Email.Mailer, adapter: Swoosh.Adapters.Local

 # Configure your database
 config :mobilizon, Mobilizon.Storage.Repo,
@ -94,6 +94,8 @@ config :mobilizon, Mobilizon.Web.Auth.Guardian,

 config :mobilizon, Mobilizon.Web.Upload.Uploader.Local, uploads: "uploads"

+config :mobilizon, :exports, path: "uploads/exports"
+
 config :tz_world, data_dir: "_build/dev/lib/tz_world/priv"

 config :mobilizon, :anonymous,
--- a/config/docker.exs
+++ b/config/docker.exs
@ -43,9 +43,8 @@ config :mobilizon, Mobilizon.Storage.Repo,
  pool_size: 10

 config :mobilizon, Mobilizon.Web.Email.Mailer,
-  adapter: Bamboo.SMTPAdapter,
-  server: System.get_env("MOBILIZON_SMTP_SERVER", "localhost"),
-  hostname: System.get_env("MOBILIZON_SMTP_HOSTNAME", "localhost"),
+  adapter: Swoosh.Adapters.SMTP,
+  relay: System.get_env("MOBILIZON_SMTP_SERVER", "localhost"),
  port: System.get_env("MOBILIZON_SMTP_PORT", "25"),
  username: System.get_env("MOBILIZON_SMTP_USERNAME", nil),
  password: System.get_env("MOBILIZON_SMTP_PASSWORD", nil),
@ -68,5 +67,13 @@ config :geolix,
 config :mobilizon, Mobilizon.Web.Upload.Uploader.Local,
  uploads: System.get_env("MOBILIZON_UPLOADS", "/var/lib/mobilizon/uploads")

+config :mobilizon, :exports,
+  path: System.get_env("MOBILIZON_UPLOADS_EXPORTS", "/var/lib/mobilizon/uploads/exports"),
+  formats: [
+    Mobilizon.Service.Export.Participants.CSV,
+    Mobilizon.Service.Export.Participants.PDF,
+    Mobilizon.Service.Export.Participants.ODS
+  ]
+
 config :tz_world,
  data_dir: System.get_env("MOBILIZON_TIMEZONES_DIR", "/var/lib/mobilizon/timezones")
--- a/config/prod.exs
+++ b/config/prod.exs
@ -16,24 +16,29 @@ config :logger, level: :info
 # Load all locales in production
 config :mobilizon, :cldr,
  locales: [
-    "ar",
-    "be",
-    "ca",
-    "cs",
-    "de",
+#    "ar",
+#    "be",
+#    "bn",
+#    "ca",
+#    "cs",
+#    "cy",
+#    "de",
    "en",
-    "es",
-    "fi",
+#    "es",
+#    "fa",
+#    "fi",
    "fr",
-    "gl",
-    "hu",
-    "it",
-    "ja",
-    "nl",
-    "nn",
-    "oc",
-    "pl",
-    "pt",
-    "ru",
-    "sv"
+#    "gd",
+#    "gl",
+#    "hu",
+#    "id",
+#    "it",
+#    "ja",
+#    "nl",
+#    "nn",
+#    "pl",
+#    "pt",
+#    "ru",
+#    "sv",
+#    "zh_Hant"
  ]
--- a/config/test.exs
+++ b/config/test.exs
@ -54,12 +54,14 @@ config :mobilizon, :ldap,
  bind_uid: System.get_env("LDAP_BIND_UID"),
  bind_password: System.get_env("LDAP_BIND_PASSWORD")

-config :mobilizon, Mobilizon.Web.Email.Mailer, adapter: Bamboo.TestAdapter
+config :mobilizon, Mobilizon.Web.Email.Mailer, adapter: Swoosh.Adapters.Test

 config :mobilizon, Mobilizon.Web.Upload, filters: [], link_name: false

 config :mobilizon, Mobilizon.Web.Upload.Uploader.Local, uploads: "test/uploads"

+config :mobilizon, :exports, path: "test/uploads/exports"
+
 config :tz_world, data_dir: "_build/test/lib/tz_world/priv"

 config :tesla, Mobilizon.Service.HTTP.ActivityPub,
--- a/docker/production/Dockerfile
+++ b/docker/production/Dockerfile
@ -12,7 +12,7 @@ RUN yarn install --network-timeout 100000 \
    && yarn run build

 # Then, build the application binary
-FROM elixir:1.12-alpine AS builder
+FROM elixir:1.13-alpine AS builder

 RUN apk add --no-cache build-base git cmake

@ -49,11 +49,14 @@ LABEL org.opencontainers.image.title="mobilizon" \
    org.opencontainers.image.revision=$VCS_REF \
    org.opencontainers.image.created=$BUILD_DATE

-RUN apk add --no-cache openssl ca-certificates ncurses-libs file postgresql-client libgcc libstdc++ imagemagick python3 py3-pip py3-pillow py3-cffi py3-brotli gcc musl-dev python3-dev pango libxslt-dev
+RUN apk add --no-cache curl openssl ca-certificates ncurses-libs file postgresql-client libgcc libstdc++ imagemagick python3 py3-pip py3-pillow py3-cffi py3-brotli gcc g++ musl-dev python3-dev pango libxslt-dev ttf-cantarell
 RUN pip install weasyprint pyexcel-ods3

 RUN mkdir -p /var/lib/mobilizon/uploads && chown nobody:nobody /var/lib/mobilizon/uploads
-RUN mkdir -p /var/lib/mobilizon/timezones && chown nobody:nobody /var/lib/mobilizon/timezones
+RUN mkdir -p /var/lib/mobilizon/uploads/exports/{csv,pdf,ods} && chown -R nobody:nobody /var/lib/mobilizon/uploads/exports
+RUN mkdir -p /var/lib/mobilizon/timezones
+RUN curl -L 'https://packages.joinmobilizon.org/tz_world/timezones-geodata.dets' -o /var/lib/mobilizon/timezones/timezones-geodata.dets
+RUN chown nobody:nobody /var/lib/mobilizon/timezones
 RUN mkdir -p /etc/mobilizon && chown nobody:nobody /etc/mobilizon

 USER nobody
--- a/docker/tests/Dockerfile
+++ b/docker/tests/Dockerfile
@ -1,15 +1,11 @@
 FROM elixir:latest
 LABEL maintainer="Thomas Citharel <tcit@tcit.fr>"

-ENV REFRESHED_AT=2021-10-04
+ENV REFRESHED_AT=2022-04-06
 RUN apt-get update -yq && apt-get install -yq build-essential inotify-tools postgresql-client git curl gnupg xvfb libgtk-3-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2 cmake exiftool python3-pip python3-setuptools
 RUN curl -sL https://deb.nodesource.com/setup_16.x | bash && apt-get install nodejs -yq
 RUN npm install -g yarn wait-on
 RUN apt-get clean && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/*
 RUN mix local.hex --force && mix local.rebar --force
-# Weasyprint 53 requires pango >= 1.44.0, which is not available in Stretch.
-# TODO: Remove the version requirement when elixir:latest is based on Bullseye
-# https://github.com/erlang/docker-erlang-otp/issues/362
-# https://github.com/Kozea/WeasyPrint/issues/1384
-RUN pip3 install -Iv weasyprint==52 pyexcel_ods3
+RUN pip3 install -Iv weasyprint pyexcel_ods3
 RUN curl https://dbip.mirror.framasoft.org/files/dbip-city-lite-latest.mmdb --output GeoLite2-City.mmdb -s && mkdir -p /usr/share/GeoIP && mv GeoLite2-City.mmdb /usr/share/GeoIP/
--- a/js/.eslintrc.js
+++ b/js/.eslintrc.js
@ -29,7 +29,6 @@ module.exports = {
      },
    ],
    "@typescript-eslint/no-explicit-any": "off",
-    "cypress/no-unnecessary-waiting": "off",
    "vue/max-len": [
      "off",
      {
--- a/js/.gitignore
+++ b/js/.gitignore
@ -23,3 +23,4 @@ yarn-error.log*
 *.njsproj
 *.sln
 *.sw?
+.yarn
--- a/js/.prettierrc.json
+++ b/js/.prettierrc.json
@ -1 +1,6 @@
-{}
+{
+  "trailingComma": "es5",
+  "semi": true,
+  "singleQuote": false,
+  "bracketSpacing": true
+}
--- a/js/.yarnrc.yml
+++ b/js/.yarnrc.yml
@ -0,0 +1,3 @@
+nodeLinker: node-modules
+
+#yarnPath: .yarn/releases/yarn-3.1.1.cjs
--- a/js/package.json
+++ b/js/package.json
@ -1,6 +1,6 @@
 {
  "name": "mobilizon",
-  "version": "2.0.0-rc.2",
+  "version": "2.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
@ -8,7 +8,7 @@
    "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": "vue-cli-service build --report",
    "build:pictures": "bash ./scripts/build/pictures.sh"
  },
  "dependencies": {
@ -16,23 +16,35 @@
    "@absinthe/socket-apollo-link": "^0.2.1",
    "@apollo/client": "^3.3.16",
    "@mdi/font": "^6.1.95",
+    "@sentry/tracing": "^6.16.1",
+    "@sentry/vue": "^6.16.1",
+    "@tailwindcss/line-clamp": "^0.4.0",
    "@tiptap/core": "^2.0.0-beta.41",
-    "@tiptap/extension-blockquote": "^2.0.0-beta.6",
+    "@tiptap/extension-blockquote": "^2.0.0-beta.25",
+    "@tiptap/extension-bold": "^2.0.0-beta.24",
    "@tiptap/extension-bubble-menu": "^2.0.0-beta.9",
-    "@tiptap/extension-character-count": "^2.0.0-beta.5",
-    "@tiptap/extension-history": "^2.0.0-beta.5",
+    "@tiptap/extension-bullet-list": "^2.0.0-beta.23",
+    "@tiptap/extension-document": "^2.0.0-beta.15",
+    "@tiptap/extension-dropcursor": "^2.0.0-beta.25",
+    "@tiptap/extension-gapcursor": "^2.0.0-beta.33",
+    "@tiptap/extension-heading": "^2.0.0-beta.23",
+    "@tiptap/extension-history": "^2.0.0-beta.21",
    "@tiptap/extension-image": "^2.0.0-beta.6",
+    "@tiptap/extension-italic": "^2.0.0-beta.24",
    "@tiptap/extension-link": "^2.0.0-beta.8",
-    "@tiptap/extension-list-item": "^2.0.0-beta.6",
+    "@tiptap/extension-list-item": "^2.0.0-beta.19",
    "@tiptap/extension-mention": "^2.0.0-beta.42",
-    "@tiptap/extension-ordered-list": "^2.0.0-beta.6",
+    "@tiptap/extension-ordered-list": "^2.0.0-beta.24",
+    "@tiptap/extension-paragraph": "^2.0.0-beta.22",
+    "@tiptap/extension-strike": "^2.0.0-beta.26",
+    "@tiptap/extension-text": "^2.0.0-beta.15",
    "@tiptap/extension-underline": "^2.0.0-beta.7",
-    "@tiptap/starter-kit": "^2.0.0-beta.37",
    "@tiptap/vue-2": "^2.0.0-beta.21",
    "@vue-a11y/announcer": "^2.1.0",
    "@vue-a11y/skip-to": "^2.1.2",
    "@vue/apollo-option": "4.0.0-alpha.11",
    "apollo-absinthe-upload-link": "^1.5.0",
+    "autoprefixer": "^10",
    "blurhash": "^1.1.3",
    "buefy": "^0.9.0",
    "bulma-divider": "^0.2.0",
@ -44,20 +56,24 @@
    "intersection-observer": "^0.12.0",
    "jwt-decode": "^3.1.2",
    "leaflet": "^1.4.0",
-    "leaflet.locatecontrol": "^0.74.0",
+    "leaflet.locatecontrol": "^0.76.0",
    "lodash": "^4.17.11",
    "ngeohash": "^0.6.3",
    "p-debounce": "^4.0.0",
    "phoenix": "^1.6",
+    "postcss": "^8",
    "register-service-worker": "^1.7.2",
    "sanitize-html": "^2.5.3",
+    "tailwindcss": "^3",
    "tippy.js": "^6.2.3",
    "unfetch": "^4.2.0",
    "v-tooltip": "^2.1.3",
    "vue": "^2.6.11",
    "vue-class-component": "^7.2.3",
    "vue-i18n": "^8.14.0",
+    "vue-matomo": "^4.1.0",
    "vue-meta": "^2.3.1",
+    "vue-plausible": "^1.3.1",
    "vue-property-decorator": "^9.0.0",
    "vue-router": "^3.1.6",
    "vue-scrollto": "^2.17.1",
@ -65,9 +81,10 @@
    "vuedraggable": "^2.24.3"
  },
  "devDependencies": {
+    "@rushstack/eslint-patch": "^1.1.0",
    "@types/jest": "^27.0.2",
    "@types/leaflet": "^1.5.2",
-    "@types/leaflet.locatecontrol": "^0.60.7",
+    "@types/leaflet.locatecontrol": "^0.74",
    "@types/lodash": "^4.14.141",
    "@types/ngeohash": "^0.6.2",
    "@types/phoenix": "^1.5.2",
@ -78,22 +95,19 @@
    "@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.0",
-    "@vue/cli-plugin-e2e-cypress": "~5.0.0-rc.0",
-    "@vue/cli-plugin-eslint": "~5.0.0-rc.0",
-    "@vue/cli-plugin-pwa": "~5.0.0-rc.0",
-    "@vue/cli-plugin-router": "~5.0.0-rc.0",
-    "@vue/cli-plugin-typescript": "~5.0.0-rc.0",
-    "@vue/cli-plugin-unit-jest": "~5.0.0-rc.0",
-    "@vue/cli-service": "~5.0.0-rc.0",
-    "@vue/eslint-config-typescript": "^9.0.0",
+    "@vue/cli-plugin-babel": "~5.0.4",
+    "@vue/cli-plugin-eslint": "~5.0.4",
+    "@vue/cli-plugin-pwa": "~5.0.4",
+    "@vue/cli-plugin-router": "~5.0.4",
+    "@vue/cli-plugin-typescript": "~5.0.4",
+    "@vue/cli-plugin-unit-jest": "~5.0.4",
+    "@vue/cli-service": "~5.0.4",
+    "@vue/eslint-config-typescript": "^10.0.0",
    "@vue/test-utils": "^1.1.0",
    "@vue/vue2-jest": "^27.0.0-alpha.3",
    "@vue/vue3-jest": "^27.0.0-alpha.1",
-    "cypress": "^8.3.0",
    "eslint": "^8.2.0",
    "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-cypress": "^2.10.3",
    "eslint-plugin-import": "^2.20.2",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-vue": "^8.0.3",
@ -102,13 +116,15 @@
    "jest-junit": "^13.0.0",
    "mock-apollo-client": "^1.1.0",
    "prettier": "^2.2.1",
-    "prettier-eslint": "^13.0.0",
+    "prettier-eslint": "^14.0.0",
    "sass": "^1.34.1",
    "sass-loader": "^12.0.0",
    "ts-jest": "27",
-    "typescript": "~4.4.3",
+    "typescript": "~4.5.5",
+    "vue-cli-plugin-tailwind": "~3.0.0",
    "vue-i18n-extract": "^2.0.4",
    "vue-template-compiler": "^2.6.11",
    "webpack-cli": "^4.7.0"
-  }
+  },
+  "packageManager": "yarn@3.1.1"
 }
--- a/js/postcss.config.js
+++ b/js/postcss.config.js
@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};
--- a/js/public/img/icons/favicon_chapril_mobilizon.png
+++ b/js/public/img/icons/favicon_chapril_mobilizon.png
--- a/js/public/img/icons/original/favicon-16x16.png
+++ b/js/public/img/icons/original/favicon-16x16.png
--- a/js/public/img/icons/original/favicon-32x32.png
+++ b/js/public/img/icons/original/favicon-32x32.png
--- a/js/public/img/long_logo_chapril_mobilizon.png
+++ b/js/public/img/long_logo_chapril_mobilizon.png
--- a/js/public/img/mobilizon_default_card.png
+++ b/js/public/img/mobilizon_default_card.png
--- a/js/public/img/mobilizon_default_card_original.png
+++ b/js/public/img/mobilizon_default_card_original.png
--- a/js/public/img/mobilizon_logo.png
+++ b/js/public/img/mobilizon_logo.png
--- a/js/public/img/mobilizon_logo.svg
+++ b/js/public/img/mobilizon_logo.svg
@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248.16 46.78">
+    <title>Mobilizon Logo</title>
+    <g data-name="header">
+        <path d="M0 45.82l3.18-40.8a29.88 29.88 0 015.07-.36 27.74 27.74 0 014.95.36l4.86 17.16a92.19 92.19 0 012.34 10.08h.36a92.19 92.19 0 012.34-10.08L28 5.02a29.23 29.23 0 015-.36 29.23 29.23 0 015 .36l3.18 40.8a13.61 13.61 0 01-3.63.42 23.41 23.41 0 01-3.63-.24l-1.2-19.92q-.36-5.52-.48-12.84h-.44l-7.32 26.51a25.62 25.62 0 01-4 .3 23.36 23.36 0 01-3.84-.3L9.36 13.24H9q-.3 8.94-.48 12.84L7.26 46a22.47 22.47 0 01-3.6.24A13.75 13.75 0 010 45.82zM74 31.06q0 8-4.26 12.3a12.21 12.21 0 01-9 3.42 12.21 12.21 0 01-9-3.42q-4.26-4.26-4.26-12.3t4.24-12.31a12.21 12.21 0 019-3.42 12.21 12.21 0 019 3.42Q74 23.02 74 31.06zM60.75 20.98q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM103.2 19.75q2.7 4.11 2.7 11.28T102 42.31a13.18 13.18 0 01-10 4.11 31.41 31.41 0 01-11.34-2V2.2l.4-.45h2.76A4 4 0 0187 2.83a5.38 5.38 0 01.93 3.57v11.94a12.08 12.08 0 017.56-2.7 8.71 8.71 0 017.71 4.11zm-9.72 2a7.28 7.28 0 00-5.58 2.82v16a15 15 0 004.08.54 5.25 5.25 0 004.68-2.67q1.68-2.67 1.68-7.59 0-9.03-4.86-9.1zM121 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014 1.62A6.27 6.27 0 01121 22z" />
+        <path d="M119.82.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z" fill="#fff" />
+        <path d="M139.08 40.42h2a10.23 10.23 0 01.6 3.18 9.24 9.24 0 01-.18 2.1 38.47 38.47 0 01-5.64.54q-6.48 0-6.48-7v-37l.36-.42h2.88a3.94 3.94 0 013.12 1.05 5.52 5.52 0 01.9 3.57v31.31q-.02 2.67 2.44 2.67zM155.94 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014.05 1.62 6.27 6.27 0 011.43 4.39z" />
+        <path d="M154.8 2.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z" fill="#fff" />
+        <path d="M163.08 39.22l8.76-11.82q1.32-1.8 4.8-5.7l-.18-.3a63.09 63.09 0 01-7.74.42H163a9.79 9.79 0 01-.24-2.34 15.8 15.8 0 01.42-3.3h20.4a16.31 16.31 0 011 4.26 4.1 4.1 0 01-.78 2.34L175 34.66a64.65 64.65 0 01-4.56 5.7l.18.24q3.12-.3 5.22-.3h2.58a15.35 15.35 0 006.12-.9 9.4 9.4 0 01.72 3.12q0 3.42-4.32 3.42h-18a14.27 14.27 0 01-.9-3.93 5.08 5.08 0 011.04-2.79zM215.88 31.06q0 8-4.26 12.3a13.63 13.63 0 01-18.06 0q-4.26-4.26-4.26-12.3t4.26-12.31a13.63 13.63 0 0118.06 0q4.26 4.27 4.26 12.31zm-13.29-10.08q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM247 25.84v13.32a11 11 0 001.2 5.64 7 7 0 01-4.41 1.56q-2.43 0-3.33-1.14a5.69 5.69 0 01-.9-3.54V27.4a7.74 7.74 0 00-.72-3.87 2.78 2.78 0 00-2.58-1.17 8.62 8.62 0 00-6.3 3v20.58a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3v-29.7l.42-.36h2.76q3.42 0 4.08 3.6 4.38-3.84 8.73-3.84t6.42 2.82a12.17 12.17 0 012.07 7.38z" />
+        <path d="M57.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84zM198.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84z" fill="#fff" />
+    </g>
+</svg>
--- a/js/public/img/mobilizon_logo_original.png
+++ b/js/public/img/mobilizon_logo_original.png
--- a/js/public/img/pics/logo_chapril_mobilizon.png
+++ b/js/public/img/pics/logo_chapril_mobilizon.png
--- a/js/src/App.vue
+++ b/js/src/App.vue
@ -203,6 +203,16 @@ export default class App extends Vue {
    this.interval = undefined;
  }

+  @Watch("config")
+  async initializeStatistics(config: IConfig) {
+    if (config) {
+      const { statistics } = (await import("./services/statistics")) as {
+        statistics: (config: IConfig, environment: Record<string, any>) => void;
+      };
+      statistics(config, { router: this.$router, version: config.version });
+    }
+  }
+
  @Watch("$route", { immediate: true })
  updateAnnouncement(route: Route): void {
    const pageTitle = this.extractPageTitleFromRoute(route);
@ -216,8 +226,12 @@ export default class App extends Vue {
    // Set the focus to the router view
    // https://marcus.io/blog/accessible-routing-vuejs
    setTimeout(() => {
-      const focusTarget = this.routerView?.$el as HTMLElement;
-      if (focusTarget) {
+      const focusTarget = (
+        this.routerView?.$refs?.componentFocusTarget !== undefined
+          ? this.routerView?.$refs?.componentFocusTarget
+          : this.routerView?.$el
+      ) as HTMLElement;
+      if (focusTarget && focusTarget instanceof Element) {
        // Make focustarget programmatically focussable
        focusTarget.setAttribute("tabindex", "-1");

--- a/js/src/apollo/utils.ts
+++ b/js/src/apollo/utils.ts
@ -70,6 +70,9 @@ export const typePolicies: TypePolicies = {
      participantStats: { merge: replaceMergePolicy },
    },
  },
+  Instance: {
+    keyFields: ["domain"],
+  },
  RootQueryType: {
    fields: {
      relayFollowers: paginatedLimitPagination<IFollower>(),
--- a/js/src/assets/chapril_mobilizon_logo_long.xcf
+++ b/js/src/assets/chapril_mobilizon_logo_long.xcf
--- a/js/src/assets/logo.svg
+++ b/js/src/assets/logo.svg
@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60">
+    <path style="opacity:0;fill:#fea72b;fill-opacity:1;stroke:none;stroke-opacity:0" d="M-5.801-6.164h72.69v72.871h-72.69z" />
+    <g data-name="Calque 2">
+        <g data-name="header">
+            <path d="M26.58 27.06q0 8-4.26 12.3a12.21 12.21 0 0 1-9 3.42 12.21 12.21 0 0 1-9-3.42Q0 35.1 0 27.06q0-8.04 4.26-12.3a12.21 12.21 0 0 1 9-3.42 12.21 12.21 0 0 1 9 3.42q4.32 4.24 4.32 12.3zM13.29 17q-5.67 0-5.67 10.06t5.67 10.08q5.71 0 5.71-10.08T13.29 17z" style="fill:#3a384c;fill-opacity:1" transform="translate(14.627 5.256) scale(1.15671)" />
+            <path d="M9 6.78a7.37 7.37 0 0 1-.6-3 7.37 7.37 0 0 1 .6-3A8.09 8.09 0 0 1 12.83 0a7.05 7.05 0 0 1 3.69.84 7.37 7.37 0 0 1 .6 3 7.37 7.37 0 0 1-.6 3 7.46 7.46 0 0 1-3.87.84A6.49 6.49 0 0 1 9 6.78z" style="fill:#fff" transform="translate(14.627 5.256) scale(1.15671)" />
+        </g>
+    </g>
+</svg>
--- a/js/src/assets/logo_chapril_mobilizon.png
+++ b/js/src/assets/logo_chapril_mobilizon.png
--- a/js/src/assets/long_logo_chapril_mobilizon.png
+++ b/js/src/assets/long_logo_chapril_mobilizon.png
--- a/js/src/assets/mobilizon_logo_original.svg
+++ b/js/src/assets/mobilizon_logo_original.svg
@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248.16 46.78">
+    <title>Mobilizon Logo</title>
+    <g data-name="header">
+        <path d="M0 45.82l3.18-40.8a29.88 29.88 0 015.07-.36 27.74 27.74 0 014.95.36l4.86 17.16a92.19 92.19 0 012.34 10.08h.36a92.19 92.19 0 012.34-10.08L28 5.02a29.23 29.23 0 015-.36 29.23 29.23 0 015 .36l3.18 40.8a13.61 13.61 0 01-3.63.42 23.41 23.41 0 01-3.63-.24l-1.2-19.92q-.36-5.52-.48-12.84h-.44l-7.32 26.51a25.62 25.62 0 01-4 .3 23.36 23.36 0 01-3.84-.3L9.36 13.24H9q-.3 8.94-.48 12.84L7.26 46a22.47 22.47 0 01-3.6.24A13.75 13.75 0 010 45.82zM74 31.06q0 8-4.26 12.3a12.21 12.21 0 01-9 3.42 12.21 12.21 0 01-9-3.42q-4.26-4.26-4.26-12.3t4.24-12.31a12.21 12.21 0 019-3.42 12.21 12.21 0 019 3.42Q74 23.02 74 31.06zM60.75 20.98q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM103.2 19.75q2.7 4.11 2.7 11.28T102 42.31a13.18 13.18 0 01-10 4.11 31.41 31.41 0 01-11.34-2V2.2l.4-.45h2.76A4 4 0 0187 2.83a5.38 5.38 0 01.93 3.57v11.94a12.08 12.08 0 017.56-2.7 8.71 8.71 0 017.71 4.11zm-9.72 2a7.28 7.28 0 00-5.58 2.82v16a15 15 0 004.08.54 5.25 5.25 0 004.68-2.67q1.68-2.67 1.68-7.59 0-9.03-4.86-9.1zM121 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014 1.62A6.27 6.27 0 01121 22z" />
+        <path d="M119.82.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z" fill="#fff" />
+        <path d="M139.08 40.42h2a10.23 10.23 0 01.6 3.18 9.24 9.24 0 01-.18 2.1 38.47 38.47 0 01-5.64.54q-6.48 0-6.48-7v-37l.36-.42h2.88a3.94 3.94 0 013.12 1.05 5.52 5.52 0 01.9 3.57v31.31q-.02 2.67 2.44 2.67zM155.94 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014.05 1.62 6.27 6.27 0 011.43 4.39z" />
+        <path d="M154.8 2.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z" fill="#fff" />
+        <path d="M163.08 39.22l8.76-11.82q1.32-1.8 4.8-5.7l-.18-.3a63.09 63.09 0 01-7.74.42H163a9.79 9.79 0 01-.24-2.34 15.8 15.8 0 01.42-3.3h20.4a16.31 16.31 0 011 4.26 4.1 4.1 0 01-.78 2.34L175 34.66a64.65 64.65 0 01-4.56 5.7l.18.24q3.12-.3 5.22-.3h2.58a15.35 15.35 0 006.12-.9 9.4 9.4 0 01.72 3.12q0 3.42-4.32 3.42h-18a14.27 14.27 0 01-.9-3.93 5.08 5.08 0 011.04-2.79zM215.88 31.06q0 8-4.26 12.3a13.63 13.63 0 01-18.06 0q-4.26-4.26-4.26-12.3t4.26-12.31a13.63 13.63 0 0118.06 0q4.26 4.27 4.26 12.31zm-13.29-10.08q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM247 25.84v13.32a11 11 0 001.2 5.64 7 7 0 01-4.41 1.56q-2.43 0-3.33-1.14a5.69 5.69 0 01-.9-3.54V27.4a7.74 7.74 0 00-.72-3.87 2.78 2.78 0 00-2.58-1.17 8.62 8.62 0 00-6.3 3v20.58a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3v-29.7l.42-.36h2.76q3.42 0 4.08 3.6 4.38-3.84 8.73-3.84t6.42 2.82a12.17 12.17 0 012.07 7.38z" />
+        <path d="M57.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84zM198.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84z" fill="#fff" />
+    </g>
+</svg>
--- a/js/src/assets/tailwind.css
+++ b/js/src/assets/tailwind.css
@ -0,0 +1,5 @@
+@tailwind base;
+
+@tailwind components;
+
+@tailwind utilities;
--- a/js/src/common.scss
+++ b/js/src/common.scss
@ -7,10 +7,6 @@
@import "styles/vue-announcer.scss";
@import "styles/vue-skip-to.scss";

-// a {
-//   color: $violet-2;
-// }
-
 a.out,
 .content a,
 .ProseMirror a {
@ -19,18 +15,10 @@ a.out,
  text-decoration-thickness: 2px;
 }

-// input.input {
-//   border-color: $input-border-color !important;
-// }
-
 .section {
  padding: 1rem 1% 4rem;
 }

-figure img.is-rounded {
-  border: 1px solid #cdcaea;
-}
-
 $color-black: #000;

 .mention {
--- a/js/src/components/Account/ActorAutoComplete.vue
+++ b/js/src/components/Account/ActorAutoComplete.vue
@ -1,118 +0,0 @@
-<template>
-  <b-autocomplete
-    :data="baseData"
-    :placeholder="$t('Actor')"
-    v-model="name"
-    field="preferredUsername"
-    :loading="$apollo.loading"
-    check-infinite-scroll
-    @typing="getAsyncData"
-    @select="handleSelect"
-    @infinite-scroll="getAsyncData"
-  >
-    <template #default="props">
-      <div class="media">
-        <div class="media-left">
-          <img
-            width="32"
-            :src="props.option.avatar.url"
-            v-if="props.option.avatar"
-            alt=""
-          />
-          <b-icon v-else icon="account-circle" />
-        </div>
-        <div class="media-content">
-          <span v-if="props.option.name">
-            {{ props.option.name }}
-            <br />
-            <small>{{ `@${props.option.preferredUsername}` }}</small>
-            <small v-if="props.option.domain">{{
-              `@${props.option.domain}`
-            }}</small>
-          </span>
-          <span v-else>
-            {{ `@${props.option.preferredUsername}` }}
-          </span>
-        </div>
-      </div>
-    </template>
-    <template slot="footer">
-      <span class="has-text-grey" v-show="page > totalPages">
-        Thats it! No more movies found.
-      </span>
-    </template>
-  </b-autocomplete>
-</template>
-<script lang="ts">
-import { Component, Model, Vue, Watch } from "vue-property-decorator";
-import debounce from "lodash/debounce";
-import { IPerson } from "@/types/actor";
-import { SEARCH_PERSONS } from "@/graphql/search";
-import { Paginate } from "@/types/paginate";
-
-const SEARCH_PERSON_LIMIT = 10;
-
-@Component
-export default class ActorAutoComplete extends Vue {
-  @Model("change", { type: Object }) readonly defaultSelected!: IPerson | null;
-
-  baseData: IPerson[] = [];
-
-  selected: IPerson | null = this.defaultSelected;
-
-  name: string = this.defaultSelected
-    ? this.defaultSelected.preferredUsername
-    : "";
-
-  page = 1;
-
-  totalPages = 1;
-
-  mounted(): void {
-    this.selected = this.defaultSelected;
-  }
-
-  data(): Record<string, unknown> {
-    return {
-      getAsyncData: debounce(this.doGetAsyncData, 500),
-    };
-  }
-
-  @Watch("defaultSelected")
-  updateDefaultSelected(defaultSelected: IPerson): void {
-    console.log("update defaultSelected", defaultSelected);
-    this.selected = defaultSelected;
-    this.name = defaultSelected.preferredUsername;
-  }
-
-  handleSelect(selected: IPerson): void {
-    this.selected = selected;
-    this.$emit("change", selected);
-  }
-
-  async doGetAsyncData(name: string): Promise<void> {
-    this.baseData = [];
-    if (this.name !== name) {
-      this.name = name;
-      this.page = 1;
-    }
-    if (!name.length) {
-      this.page = 1;
-      this.totalPages = 1;
-      return;
-    }
-    const {
-      data: { searchPersons },
-    } = await this.$apollo.query<{ searchPersons: Paginate<IPerson> }>({
-      query: SEARCH_PERSONS,
-      variables: {
-        searchText: this.name,
-        page: this.page,
-        limit: SEARCH_PERSON_LIMIT,
-      },
-    });
-    this.totalPages = Math.ceil(searchPersons.total / SEARCH_PERSON_LIMIT);
-    this.baseData.push(...searchPersons.elements);
-  }
-}
-</script>
--- a/js/src/components/Account/ActorCard.vue
+++ b/js/src/components/Account/ActorCard.vue
@ -1,31 +1,86 @@
 <template>
-  <div class="media" style="align-items: top" dir="auto">
-    <div class="media-left">
-      <figure class="image is-32x32" v-if="actor.avatar">
-        <img class="is-rounded" :src="actor.avatar.url" alt="" />
+  <div
+    class="bg-white rounded-lg flex space-x-4 items-center"
+    :class="{ 'flex-col p-4 shadow-md sm:p-8 pb-10 w-80': !inline }"
+  >
+    <div>
+      <figure class="w-12 h-12" v-if="actor.avatar">
+        <img
+          class="rounded-lg"
+          :src="actor.avatar.url"
+          alt=""
+          width="48"
+          height="48"
+        />
      </figure>
-      <b-icon v-else size="is-medium" icon="account-circle" />
+      <b-icon
+        v-else
+        :size="inline ? 'is-medium' : 'is-large'"
+        icon="account-circle"
+        class="ltr:-mr-0.5 rtl:-ml-0.5"
+      />
    </div>
-
-    <div class="media-content">
-      <p>
-        {{ actor.name || `@${usernameWithDomain(actor)}` }}
-      </p>
-      <p class="has-text-grey-dark" v-if="actor.name">
+    <div :class="{ 'text-center': !inline }" class="overflow-hidden w-full">
+      <h5
+        class="text-xl font-medium violet-title tracking-tight text-gray-900 whitespace-pre-line line-clamp-2"
+      >
+        {{ displayName(actor) }}
+      </h5>
+      <p class="text-gray-500 truncate" v-if="actor.name">
        <span dir="ltr">@{{ usernameWithDomain(actor) }}</span>
      </p>
      <div
        v-if="full"
-        class="summary"
-        :class="{ limit: limit }"
+        class="only-first-child"
+        :class="{
+          'line-clamp-3': limit,
+          'line-clamp-10': !limit,
+        }"
        v-html="actor.summary"
      />
    </div>
  </div>
+  <!-- <div
+    class="p-4 bg-white rounded-lg shadow-md sm:p-8 flex items-center space-x-4"
+    dir="auto"
+  >
+    <div class="flex-shrink-0">
+      <figure class="w-12 h-12" v-if="actor.avatar">
+        <img
+          class="rounded-lg"
+          :src="actor.avatar.url"
+          alt=""
+          width="48"
+          height="48"
+        />
+      </figure>
+      <b-icon
+        v-else
+        size="is-large"
+        icon="account-circle"
+        class="ltr:-mr-0.5 rtl:-ml-0.5"
+      />
+    </div>
+
+    <div class="flex-1 min-w-0">
+      <h5 class="text-xl font-medium violet-title tracking-tight text-gray-900">
+        {{ displayName(actor) }}
+      </h5>
+      <p class="text-gray-500 truncate" v-if="actor.name">
+        <span dir="ltr">@{{ usernameWithDomain(actor) }}</span>
+      </p>
+      <div
+        v-if="full"
+        class="line-clamp-3"
+        :class="{ limit: limit }"
+        v-html="actor.summary"
+      />
+    </div>
+  </div> -->
 </template>
 <script lang="ts">
 import { Component, Vue, Prop } from "vue-property-decorator";
-import { IActor, usernameWithDomain } from "../../types/actor";
+import { displayName, IActor, usernameWithDomain } from "../../types/actor";

@Component
 export default class ActorCard extends Vue {
@ -33,140 +88,19 @@ export default class ActorCard extends Vue {

  @Prop({ required: false, type: Boolean, default: false }) full!: boolean;

+  @Prop({ required: false, type: Boolean, default: false }) inline!: boolean;
+
  @Prop({ required: false, type: Boolean, default: false }) popover!: boolean;

  @Prop({ required: false, type: Boolean, default: true }) limit!: boolean;

  usernameWithDomain = usernameWithDomain;
+
+  displayName = displayName;
 }
 </script>
-<style lang="scss" scoped>
-.summary.limit {
-  max-width: 25rem;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  overflow: hidden;
-}
-</style>
-
-<style lang="scss">
-@use "@/styles/_mixins" as *;
-
-.media {
-  .media-left {
-    margin-right: initial;
-    @include margin-right(1rem);
-  }
-}
-
-.tooltip {
-  display: block !important;
-  z-index: 10000;
-
-  .tooltip-inner {
-    background: black;
-    color: white;
-    border-radius: 16px;
-    padding: 5px 10px 4px;
-  }
-
-  .tooltip-arrow {
-    width: 0;
-    height: 0;
-    border-style: solid;
-    position: absolute;
-    margin: 5px;
-    border-color: black;
-    z-index: 1;
-  }
-
-  &[x-placement^="top"] {
-    margin-bottom: 5px;
-
-    .tooltip-arrow {
-      border-width: 5px 5px 0 5px;
-      border-left-color: transparent !important;
-      border-right-color: transparent !important;
-      border-bottom-color: transparent !important;
-      bottom: -5px;
-      left: calc(50% - 5px);
-      margin-top: 0;
-      margin-bottom: 0;
-    }
-  }
-
-  &[x-placement^="bottom"] {
-    margin-top: 5px;
-
-    .tooltip-arrow {
-      border-width: 0 5px 5px 5px;
-      border-left-color: transparent !important;
-      border-right-color: transparent !important;
-      border-top-color: transparent !important;
-      top: -5px;
-      left: calc(50% - 5px);
-      margin-top: 0;
-      margin-bottom: 0;
-    }
-  }
-
-  &[x-placement^="right"] {
-    @include margin-left(5px);
-
-    .tooltip-arrow {
-      border-width: 5px 5px 5px 0;
-      border-left-color: transparent !important;
-      border-top-color: transparent !important;
-      border-bottom-color: transparent !important;
-      left: -5px;
-      top: calc(50% - 5px);
-      @include margin-left(0);
-      @include margin-right(0);
-    }
-  }
-
-  &[x-placement^="left"] {
-    @include margin-right(5px);
-
-    .tooltip-arrow {
-      border-width: 5px 0 5px 5px;
-      border-top-color: transparent !important;
-      border-right-color: transparent !important;
-      border-bottom-color: transparent !important;
-      right: -5px;
-      top: calc(50% - 5px);
-      @include margin-left(0);
-      @include margin-right(0);
-    }
-  }
-
-  &.popover {
-    $color: #f9f9f9;
-
-    .popover-inner {
-      background: lighten($background-color, 65%);
-      color: black;
-      padding: 24px;
-      border-radius: 5px;
-      box-shadow: 0 5px 30px rgba(black, 0.1);
-    }
-
-    .popover-arrow {
-      border-color: $color;
-    }
-  }
-
-  &[aria-hidden="true"] {
-    visibility: hidden;
-    opacity: 0;
-    transition: opacity 0.15s, visibility 0.15s;
-  }
-
-  &[aria-hidden="false"] {
-    visibility: visible;
-    opacity: 1;
-    transition: opacity 0.15s;
-  }
+<style scoped>
+.only-first-child ::v-deep :not(:first-child) {
+  display: none;
 }
 </style>
--- a/js/src/components/Account/ActorInline.vue
+++ b/js/src/components/Account/ActorInline.vue
@ -1,28 +1,33 @@
 <template>
-  <div class="actor-inline">
-    <div class="actor-avatar">
-      <figure class="image is-24x24" v-if="actor.avatar">
+  <div class="inline-flex items-start">
+    <div class="flex-none mr-2">
+      <figure class="image is-48x48" v-if="actor.avatar">
        <img class="is-rounded" :src="actor.avatar.url" alt="" />
      </figure>
-      <b-icon v-else size="is-medium" icon="account-circle" />
+      <b-icon v-else size="is-large" icon="account-circle" />
    </div>

-    <div class="actor-name">
-      <p>
-        {{ actor.name || `@${usernameWithDomain(actor)}` }}
+    <div class="flex-auto">
+      <p class="text-base line-clamp-3 md:line-clamp-2 max-w-xl">
+        {{ displayName(actor) }}
+      </p>
+      <p class="text-sm text-gray-500 truncate">
+        @{{ usernameWithDomain(actor) }}
      </p>
    </div>
  </div>
 </template>
 <script lang="ts">
 import { Component, Vue, Prop } from "vue-property-decorator";
-import { IActor, usernameWithDomain } from "../../types/actor";
+import { displayName, IActor, usernameWithDomain } from "../../types/actor";

@Component
 export default class ActorInline extends Vue {
  @Prop({ required: true, type: Object }) actor!: IActor;

  usernameWithDomain = usernameWithDomain;
+
+  displayName = displayName;
 }
 </script>
 <style lang="scss" scoped>
--- a/js/src/components/Account/ProfileOnboarding.vue
+++ b/js/src/components/Account/ProfileOnboarding.vue
@ -41,8 +41,8 @@
          )
        }}
      </p>
-      <div class="has-text-centered">
-        <code>{{ `${currentActor.preferredUsername}@${domain}` }}</code>
+      <div class="has-text-centered has-text-primary has-background-success">
+        <pre>{{ `${currentActor.preferredUsername}@${domain}` }}</pre>
      </div>
    </div>
  </div>
--- a/js/src/components/Address/InlineAddress.vue
+++ b/js/src/components/Address/InlineAddress.vue
@ -1,6 +1,6 @@
 <template>
  <div
-    class="ellipsis"
+    class="truncate"
    :title="
      isDescriptionDifferentFromLocality
        ? `${physicalAddress.description}, ${physicalAddress.locality}`
@ -8,8 +8,7 @@
    "
  >
    <b-icon icon="map-marker" />
-    <span v-if="isDescriptionDifferentFromLocality">
-      {{ physicalAddress.description }},
+    <span v-if="physicalAddress.locality">
      {{ physicalAddress.locality }}
    </span>
    <span v-else>
@ -35,11 +34,3 @@ export default class InlineAddress extends Vue {
  }
 }
 </script>
-<style lang="scss" scoped>
-.ellipsis {
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-</style>
--- a/js/src/components/Admin/Followers.vue
+++ b/js/src/components/Admin/Followers.vue
@ -1,262 +0,0 @@
-<template>
-  <div>
-    <b-table
-      v-show="relayFollowers.elements.length > 0"
-      :data="relayFollowers.elements"
-      :loading="$apollo.queries.relayFollowers.loading"
-      ref="table"
-      :checked-rows.sync="checkedRows"
-      detailed
-      :show-detail-icon="false"
-      paginated
-      backend-pagination
-      :current-page.sync="page"
-      :aria-next-label="$t('Next page')"
-      :aria-previous-label="$t('Previous page')"
-      :aria-page-label="$t('Page')"
-      :aria-current-label="$t('Current page')"
-      :total="relayFollowers.total"
-      :per-page="FOLLOWERS_PER_PAGE"
-      @page-change="onFollowersPageChange"
-      checkable
-      checkbox-position="left"
-    >
-      <b-table-column
-        field="actor.id"
-        label="ID"
-        width="40"
-        numeric
-        v-slot="props"
-        >{{ props.row.actor.id }}</b-table-column
-      >
-
-      <b-table-column
-        field="actor.type"
-        :label="$t('Type')"
-        width="80"
-        v-slot="props"
-      >
-        <b-icon icon="lan" v-if="RelayMixin.isInstance(props.row.actor)" />
-        <b-icon icon="account-circle" v-else />
-      </b-table-column>
-
-      <b-table-column
-        field="approved"
-        :label="$t('Status')"
-        width="100"
-        sortable
-        centered
-        v-slot="props"
-      >
-        <span
-          :class="`tag ${props.row.approved ? 'is-success' : 'is-danger'}`"
-          >{{ props.row.approved ? $t("Accepted") : $t("Pending") }}</span
-        >
-      </b-table-column>
-
-      <b-table-column field="actor.domain" :label="$t('Domain')" sortable>
-        <template v-slot:default="props">
-          <a
-            @click="toggle(props.row)"
-            v-if="RelayMixin.isInstance(props.row.actor)"
-            >{{ props.row.actor.domain }}</a
-          >
-          <a @click="toggle(props.row)" v-else>{{
-            `${props.row.actor.preferredUsername}@${props.row.actor.domain}`
-          }}</a>
-        </template>
-      </b-table-column>
-
-      <b-table-column
-        field="targetActor.updatedAt"
-        :label="$t('Date')"
-        sortable
-        v-slot="props"
-      >
-        <span
-          :title="$options.filters.formatDateTimeString(props.row.updatedAt)"
-          >{{
-            formatDistanceToNow(new Date(props.row.updatedAt), {
-              locale: $dateFnsLocale,
-            })
-          }}</span
-        ></b-table-column
-      >
-
-      <template #detail="props">
-        <article>
-          <div class="content">
-            <strong>{{ props.row.actor.name }}</strong>
-            <small v-if="props.row.actor.preferredUsername !== 'relay'"
-              >@{{ props.row.actor.preferredUsername }}</small
-            >
-            <p v-html="props.row.actor.summary" />
-          </div>
-        </article>
-      </template>
-
-      <template slot="bottom-left" v-if="checkedRows.length > 0">
-        <div class="buttons">
-          <b-button
-            @click="acceptRelays"
-            type="is-success"
-            v-if="checkedRowsHaveAtLeastOneToApprove"
-          >
-            {{
-              $tc(
-                "No instance to approve|Approve instance|Approve {number} instances",
-                checkedRows.length,
-                { number: checkedRows.length }
-              )
-            }}
-          </b-button>
-          <b-button @click="rejectRelays" type="is-danger">
-            {{
-              $tc(
-                "No instance to reject|Reject instance|Reject {number} instances",
-                checkedRows.length,
-                { number: checkedRows.length }
-              )
-            }}
-          </b-button>
-        </div>
-      </template>
-    </b-table>
-    <b-message type="is-danger" v-if="relayFollowers.elements.length === 0">{{
-      $t("No instance follows your instance yet.")
-    }}</b-message>
-  </div>
-</template>
-<script lang="ts">
-import { Component, Mixins } from "vue-property-decorator";
-import { SnackbarProgrammatic as Snackbar } from "buefy";
-import { formatDistanceToNow } from "date-fns";
-import {
-  ACCEPT_RELAY,
-  REJECT_RELAY,
-  RELAY_FOLLOWERS,
-} from "../../graphql/admin";
-import { IFollower } from "../../types/actor/follower.model";
-import RelayMixin from "../../mixins/relay";
-import RouteName from "@/router/name";
-import { Paginate } from "@/types/paginate";
-
-const FOLLOWERS_PER_PAGE = 10;
-
-@Component({
-  apollo: {
-    relayFollowers: {
-      query: RELAY_FOLLOWERS,
-      variables() {
-        return {
-          page: this.page,
-          limit: FOLLOWERS_PER_PAGE,
-        };
-      },
-    },
-  },
-  metaInfo() {
-    return {
-      title: this.$t("Followers") as string,
-      titleTemplate: "%s | Mobilizon",
-    };
-  },
-})
-export default class Followers extends Mixins(RelayMixin) {
-  RelayMixin = RelayMixin;
-
-  formatDistanceToNow = formatDistanceToNow;
-
-  relayFollowers: Paginate<IFollower> = { elements: [], total: 0 };
-
-  checkedRows: IFollower[] = [];
-
-  FOLLOWERS_PER_PAGE = FOLLOWERS_PER_PAGE;
-
-  toggle(row: Record<string, unknown>): void {
-    this.table.toggleDetails(row);
-  }
-
-  get page(): number {
-    return parseInt((this.$route.query.page as string) || "1", 10);
-  }
-
-  set page(page: number) {
-    this.pushRouter(RouteName.RELAY_FOLLOWERS, {
-      page: page.toString(),
-    });
-  }
-
-  acceptRelays(): void {
-    this.checkedRows.forEach((row: IFollower) => {
-      this.acceptRelay(`${row.actor.preferredUsername}@${row.actor.domain}`);
-    });
-  }
-
-  rejectRelays(): void {
-    this.checkedRows.forEach((row: IFollower) => {
-      this.rejectRelay(`${row.actor.preferredUsername}@${row.actor.domain}`);
-    });
-  }
-
-  async acceptRelay(address: string): Promise<void> {
-    try {
-      await this.$apollo.mutate({
-        mutation: ACCEPT_RELAY,
-        variables: {
-          address,
-        },
-      });
-      await this.$apollo.queries.relayFollowers.refetch();
-      this.checkedRows = [];
-    } catch (e: any) {
-      if (e.message) {
-        Snackbar.open({
-          message: e.message,
-          type: "is-danger",
-          position: "is-bottom",
-        });
-      }
-    }
-  }
-
-  async rejectRelay(address: string): Promise<void> {
-    try {
-      await this.$apollo.mutate({
-        mutation: REJECT_RELAY,
-        variables: {
-          address,
-        },
-      });
-      await this.$apollo.queries.relayFollowers.refetch();
-      this.checkedRows = [];
-    } catch (e: any) {
-      if (e.message) {
-        Snackbar.open({
-          message: e.message,
-          type: "is-danger",
-          position: "is-bottom",
-        });
-      }
-    }
-  }
-
-  get checkedRowsHaveAtLeastOneToApprove(): boolean {
-    return this.checkedRows.some((checkedRow) => !checkedRow.approved);
-  }
-
-  async onFollowersPageChange(page: number): Promise<void> {
-    this.page = page;
-    try {
-      await this.$apollo.queries.relayFollowers.fetchMore({
-        variables: {
-          page: this.page,
-          limit: FOLLOWERS_PER_PAGE,
-        },
-      });
-    } catch (err: any) {
-      console.error(err);
-    }
-  }
-}
-</script>
--- a/js/src/components/Admin/Followings.vue
+++ b/js/src/components/Admin/Followings.vue
@ -1,311 +0,0 @@
-<template>
-  <div>
-    <form @submit="followRelay">
-      <b-field
-        :label="$t('Add an instance')"
-        custom-class="add-relay"
-        horizontal
-      >
-        <b-field grouped expanded size="is-large">
-          <p class="control">
-            <b-input
-              v-model="newRelayAddress"
-              :placeholder="$t('Ex: mobilizon.fr')"
-            />
-          </p>
-          <p class="control">
-            <b-button type="is-primary" native-type="submit">{{
-              $t("Add an instance")
-            }}</b-button>
-          </p>
-        </b-field>
-      </b-field>
-    </form>
-    <b-table
-      v-show="relayFollowings.elements.length > 0"
-      :data="relayFollowings.elements"
-      :loading="$apollo.queries.relayFollowings.loading"
-      ref="table"
-      :checked-rows.sync="checkedRows"
-      :is-row-checkable="(row) => row.id !== 3"
-      detailed
-      :show-detail-icon="false"
-      paginated
-      backend-pagination
-      :current-page.sync="page"
-      :aria-next-label="$t('Next page')"
-      :aria-previous-label="$t('Previous page')"
-      :aria-page-label="$t('Page')"
-      :aria-current-label="$t('Current page')"
-      :total="relayFollowings.total"
-      :per-page="FOLLOWINGS_PER_PAGE"
-      @page-change="onFollowingsPageChange"
-      checkable
-      checkbox-position="left"
-    >
-      <b-table-column
-        field="targetActor.id"
-        label="ID"
-        width="40"
-        numeric
-        v-slot="props"
-        >{{ props.row.targetActor.id }}</b-table-column
-      >
-
-      <b-table-column
-        field="targetActor.type"
-        :label="$t('Type')"
-        width="80"
-        v-slot="props"
-      >
-        <b-icon
-          icon="lan"
-          v-if="RelayMixin.isInstance(props.row.targetActor)"
-        />
-        <b-icon icon="account-circle" v-else />
-      </b-table-column>
-
-      <b-table-column
-        field="approved"
-        :label="$t('Status')"
-        width="100"
-        sortable
-        centered
-        v-slot="props"
-      >
-        <span
-          :class="`tag ${props.row.approved ? 'is-success' : 'is-danger'}`"
-          >{{ props.row.approved ? $t("Accepted") : $t("Pending") }}</span
-        >
-      </b-table-column>
-
-      <b-table-column field="targetActor.domain" :label="$t('Domain')" sortable>
-        <template v-slot:default="props">
-          <a
-            @click="toggle(props.row)"
-            v-if="RelayMixin.isInstance(props.row.targetActor)"
-            >{{ props.row.targetActor.domain }}</a
-          >
-          <a @click="toggle(props.row)" v-else>{{
-            `${props.row.targetActor.preferredUsername}@${props.row.targetActor.domain}`
-          }}</a>
-        </template>
-      </b-table-column>
-
-      <b-table-column
-        field="targetActor.updatedAt"
-        :label="$t('Date')"
-        sortable
-        v-slot="props"
-      >
-        <span
-          :title="$options.filters.formatDateTimeString(props.row.updatedAt)"
-          >{{
-            formatDistanceToNow(new Date(props.row.updatedAt), {
-              locale: $dateFnsLocale,
-            })
-          }}</span
-        ></b-table-column
-      >
-
-      <template #detail="props">
-        <article>
-          <div class="content">
-            <strong>{{ props.row.targetActor.name }}</strong>
-            <small v-if="props.row.actor.preferredUsername !== 'relay'"
-              >@{{ props.row.targetActor.preferredUsername }}</small
-            >
-            <p v-html="props.row.targetActor.summary" />
-          </div>
-        </article>
-      </template>
-
-      <template slot="bottom-left" v-if="checkedRows.length > 0">
-        <b-button @click="removeRelays" type="is-danger">
-          {{
-            $tc(
-              "No instance to remove|Remove instance|Remove {number} instances",
-              checkedRows.length,
-              { number: checkedRows.length }
-            )
-          }}
-        </b-button>
-      </template>
-    </b-table>
-    <b-message type="is-danger" v-if="relayFollowings.total === 0">{{
-      $t("You don't follow any instances yet.")
-    }}</b-message>
-  </div>
-</template>
-<script lang="ts">
-import { Component, Mixins } from "vue-property-decorator";
-import { SnackbarProgrammatic as Snackbar } from "buefy";
-import { formatDistanceToNow } from "date-fns";
-import { ADD_RELAY, REMOVE_RELAY } from "../../graphql/admin";
-import { IFollower } from "../../types/actor/follower.model";
-import RelayMixin from "../../mixins/relay";
-import { RELAY_FOLLOWINGS } from "@/graphql/admin";
-import { Paginate } from "@/types/paginate";
-import RouteName from "@/router/name";
-import { ApolloCache, FetchResult, Reference } from "@apollo/client/core";
-import gql from "graphql-tag";
-
-const FOLLOWINGS_PER_PAGE = 10;
-
-@Component({
-  apollo: {
-    relayFollowings: {
-      query: RELAY_FOLLOWINGS,
-      variables() {
-        return {
-          page: this.page,
-          limit: FOLLOWINGS_PER_PAGE,
-        };
-      },
-    },
-  },
-  metaInfo() {
-    return {
-      title: this.$t("Followings") as string,
-      titleTemplate: "%s | Mobilizon",
-    };
-  },
-})
-export default class Followings extends Mixins(RelayMixin) {
-  newRelayAddress = "";
-
-  RelayMixin = RelayMixin;
-
-  formatDistanceToNow = formatDistanceToNow;
-
-  relayFollowings: Paginate<IFollower> = { elements: [], total: 0 };
-
-  FOLLOWINGS_PER_PAGE = FOLLOWINGS_PER_PAGE;
-
-  checkedRows: IFollower[] = [];
-
-  get page(): number {
-    return parseInt((this.$route.query.page as string) || "1", 10);
-  }
-
-  set page(page: number) {
-    this.pushRouter(RouteName.RELAY_FOLLOWINGS, {
-      page: page.toString(),
-    });
-  }
-
-  async onFollowingsPageChange(page: number): Promise<void> {
-    this.page = page;
-    try {
-      await this.$apollo.queries.relayFollowings.fetchMore({
-        variables: {
-          page: this.page,
-          limit: FOLLOWINGS_PER_PAGE,
-        },
-      });
-    } catch (err: any) {
-      console.error(err);
-    }
-  }
-
-  async followRelay(e: Event): Promise<void> {
-    e.preventDefault();
-    try {
-      await this.$apollo.mutate<{ relayFollowings: Paginate<IFollower> }>({
-        mutation: ADD_RELAY,
-        variables: {
-          address: this.newRelayAddress.trim(), // trim to fix copy and paste domain name spaces and tabs
-        },
-        update(
-          cache: ApolloCache<{ relayFollowings: Paginate<IFollower> }>,
-          { data }: FetchResult
-        ) {
-          cache.modify({
-            fields: {
-              relayFollowings(
-                existingFollowings = { elements: [], total: 0 },
-                { readField }
-              ) {
-                const newFollowingRef = cache.writeFragment({
-                  id: `${data?.addRelay.__typename}:${data?.addRelay.id}`,
-                  data: data?.addRelay,
-                  fragment: gql`
-                    fragment NewFollowing on Follower {
-                      id
-                    }
-                  `,
-                });
-                if (
-                  existingFollowings.elements.some(
-                    (ref: Reference) =>
-                      readField("id", ref) === data?.addRelay.id
-                  )
-                ) {
-                  return existingFollowings;
-                }
-                return {
-                  total: existingFollowings.total + 1,
-                  elements: [newFollowingRef, ...existingFollowings.elements],
-                };
-              },
-            },
-            broadcast: false,
-          });
-        },
-      });
-      this.newRelayAddress = "";
-    } catch (err: any) {
-      if (err.message) {
-        Snackbar.open({
-          message: err.message,
-          type: "is-danger",
-          position: "is-bottom",
-        });
-      }
-    }
-  }
-
-  removeRelays(): void {
-    this.checkedRows.forEach((row: IFollower) => {
-      this.removeRelay(row);
-    });
-  }
-
-  async removeRelay(follower: IFollower): Promise<void> {
-    const address = `${follower.targetActor.preferredUsername}@${follower.targetActor.domain}`;
-    try {
-      await this.$apollo.mutate<{ removeRelay: IFollower }>({
-        mutation: REMOVE_RELAY,
-        variables: {
-          address,
-        },
-        update(cache: ApolloCache<{ removeRelay: IFollower }>) {
-          cache.modify({
-            fields: {
-              relayFollowings(existingFollowingRefs, { readField }) {
-                return {
-                  total: existingFollowingRefs.total - 1,
-                  elements: existingFollowingRefs.elements.filter(
-                    (followingRef: Reference) =>
-                      follower.id !== readField("id", followingRef)
-                  ),
-                };
-              },
-            },
-          });
-        },
-      });
-      await this.$apollo.queries.relayFollowings.refetch();
-      this.checkedRows = [];
-    } catch (e: any) {
-      if (e.message) {
-        Snackbar.open({
-          message: e.message,
-          type: "is-danger",
-          position: "is-bottom",
-        });
-      }
-    }
-  }
-}
-</script>
--- a/js/src/components/Editor.vue
+++ b/js/src/components/Editor.vue
@ -195,10 +195,18 @@
 <script lang="ts">
 import { Component, Prop, Vue, Watch } from "vue-property-decorator";
 import { Editor, EditorContent, BubbleMenu } from "@tiptap/vue-2";
-import StarterKit from "@tiptap/starter-kit";
+import Blockquote from "@tiptap/extension-blockquote";
+import BulletList from "@tiptap/extension-bullet-list";
+import Heading from "@tiptap/extension-heading";
 import Document from "@tiptap/extension-document";
 import Paragraph from "@tiptap/extension-paragraph";
+import Bold from "@tiptap/extension-bold";
+import Italic from "@tiptap/extension-italic";
+import Strike from "@tiptap/extension-strike";
 import Text from "@tiptap/extension-text";
+import Dropcursor from "@tiptap/extension-dropcursor";
+import Gapcursor from "@tiptap/extension-gapcursor";
+import History from "@tiptap/extension-history";
 import { IActor, IPerson, usernameWithDomain } from "../types/actor";
 import CustomImage from "./Editor/Image";
 import { UPLOAD_MEDIA } from "../graphql/upload";
@ -210,7 +218,6 @@ import OrderedList from "@tiptap/extension-ordered-list";
 import ListItem from "@tiptap/extension-list-item";
 import Underline from "@tiptap/extension-underline";
 import Link from "@tiptap/extension-link";
-import CharacterCount from "@tiptap/extension-character-count";
 import { AutoDir } from "./Editor/Autodir";
 import sanitizeHtml from "sanitize-html";

@ -269,7 +276,9 @@ export default class EditorComponent extends Vue {
        transformPastedHTML: this.transformPastedHTML,
      },
      extensions: [
-        StarterKit,
+        Blockquote,
+        BulletList,
+        Heading,
        Document,
        Paragraph,
        Text,
@ -279,12 +288,15 @@ export default class EditorComponent extends Vue {
        CustomImage,
        AutoDir,
        Underline,
+        Bold,
+        Italic,
+        Strike,
+        Dropcursor,
+        Gapcursor,
+        History,
        Link.configure({
          HTMLAttributes: { target: "_blank", rel: "noopener noreferrer ugc" },
        }),
-        CharacterCount.configure({
-          limit: this.maxSize,
-        }),
      ],
      injectCSS: false,
      content: this.value,
@ -554,7 +566,7 @@ $color-white: #eee;
    }
    &.is-selected,
    &:hover {
-      background-color: rgba($color-white, 0.2);
+      background-color: rgba(#eee, 0.2);
    }
    &.is-empty {
      opacity: 0.5;
@ -571,7 +583,7 @@ $color-white: #eee;
  padding: 0;
  font-size: 1rem;
  text-align: inherit;
-  color: $color-white;
+  color: #eee;
  border-radius: 5px;
 }

--- a/js/src/components/Editor/Mention.ts
+++ b/js/src/components/Editor/Mention.ts
@ -7,6 +7,8 @@ import apolloProvider from "@/vue-apollo";
 import { IPerson } from "@/types/actor";
 import pDebounce from "p-debounce";
 import { NormalizedCacheObject } from "@apollo/client/cache/inmemory/types";
+import { MentionOptions } from "@tiptap/extension-mention";
+import { Editor } from "@tiptap/core";

 const client =
  apolloProvider.defaultClient as ApolloClient<NormalizedCacheObject>;
@ -24,13 +26,21 @@ const fetchItems = async (query: string): Promise<IPerson[]> => {

 const debouncedFetchItems = pDebounce(fetchItems, 200);

-const mentionOptions: Partial<any> = {
+const mentionOptions: MentionOptions = {
  HTMLAttributes: {
    class: "mention",
    dir: "ltr",
  },
+  renderLabel({ options, node }) {
+    return `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`;
+  },
  suggestion: {
-    items: async (query: string): Promise<IPerson[]> => {
+    items: async ({
+      query,
+    }: {
+      query: string;
+      editor: Editor;
+    }): Promise<IPerson[]> => {
      if (query === "") {
        return [];
      }
@ -70,8 +80,12 @@ const mentionOptions: Partial<any> = {
          return component.ref?.onKeyDown(props);
        },
        onExit() {
-          popup[0].destroy();
-          component.destroy();
+          if (popup && popup[0]) {
+            popup[0].destroy();
+          }
+          if (component) {
+            component.destroy();
+          }
        },
      };
    },
--- a/js/src/components/Editor/MentionList.vue
+++ b/js/src/components/Editor/MentionList.vue
@ -7,7 +7,7 @@
      :key="index"
      @click="selectItem(index)"
    >
-      <actor-card :actor="item" />
+      <actor-inline :actor="item" />
    </button>
  </div>
 </template>
@ -16,11 +16,11 @@
 import { Vue, Component, Prop, Watch } from "vue-property-decorator";
 import { displayName, usernameWithDomain } from "@/types/actor/actor.model";
 import { IPerson } from "@/types/actor";
-import ActorCard from "../../components/Account/ActorCard.vue";
+import ActorInline from "../../components/Account/ActorInline.vue";

@Component({
  components: {
-    ActorCard,
+    ActorInline,
  },
 })
 export default class MentionList extends Vue {
--- a/js/src/components/Editor/style.scss
+++ b/js/src/components/Editor/style.scss
@ -5,10 +5,14 @@

 .ProseMirror {
  position: relative;
+}
+.ProseMirror {
  word-wrap: break-word;
  white-space: pre-wrap;
+  white-space: break-spaces;
  -webkit-font-variant-ligatures: none;
  font-variant-ligatures: none;
+  font-feature-settings: "liga" 0; /* the above doesn't seem to work in Edge */

  & [contenteditable="false"] {
    white-space: normal;
@ -16,14 +20,22 @@
  & [contenteditable="false"] [contenteditable="true"] {
    white-space: pre-wrap;
  }
-  pre {
+  & pre {
    white-space: pre-wrap;
  }
 }
+img.ProseMirror-separator {
+  display: inline !important;
+  border: none !important;
+  margin: 0 !important;
+  width: 1px !important;
+  height: 1px !important;
+}
 .ProseMirror-gapcursor {
  display: none;
  pointer-events: none;
  position: absolute;
+  margin: 0;

  &:after {
    content: "";
@ -40,16 +52,17 @@
    visibility: hidden;
  }
 }
-.ProseMirror-hideselection * {
-  &::selection {
+.ProseMirror-hideselection {
+  *::selection {
    background: transparent;
  }
-  &::-moz-selection {
+  *::-moz-selection {
    background: transparent;
  }
-  caret-color: transparent;
+  * {
+    caret-color: transparent;
+  }
 }
-
 .ProseMirror-focused .ProseMirror-gapcursor {
  display: block;
 }
--- a/js/src/components/Error.vue
+++ b/js/src/components/Error.vue
@ -48,13 +48,75 @@
              $t("Mobilizon")
            }}</a>
          </i18n>
-          {{
-            $t(
-              "We improve this software thanks to your feedback. To let us know about this issue, two possibilities (both unfortunately require user account creation):"
-            )
-          }}
+          <span v-if="sentryEnabled && sentryReady">
+            {{
+              $t(
+                "We collect your feedback and the error information in order to improve this service."
+              )
+            }}</span
+          >
+          <span v-else>
+            {{
+              $t(
+                "We improve this software thanks to your feedback. To let us know about this issue, two possibilities (both unfortunately require user account creation):"
+              )
+            }}
+          </span>
        </p>
-        <div class="content">
+        <form
+          v-if="sentryEnabled && sentryReady && !submittedFeedback"
+          @submit.prevent="sendErrorToSentry"
+        >
+          <b-field :label="$t('What happened?')" label-for="what-happened">
+            <b-input
+              v-model="feedback"
+              type="textarea"
+              id="what-happened"
+              :placeholder="$t(`I've clicked on X, then on Y`)"
+            />
+          </b-field>
+          <b-button icon-left="send" native-type="submit" type="is-primary">{{
+            $t("Send feedback")
+          }}</b-button>
+          <p class="content">
+            {{
+              $t(
+                "Please add as many details as possible to help identify the problem."
+              )
+            }}
+          </p>
+        </form>
+        <b-message type="is-danger" v-else-if="feedbackError">
+          <p>
+            {{
+              $t(
+                "Sorry, we wen't able to save your feedback. Don't worry, we'll try to fix this issue anyway."
+              )
+            }}
+          </p>
+          <i18n path="You may now close this page or {return_to_the_homepage}.">
+            <template #return_to_the_homepage>
+              <router-link :to="{ name: RouteName.HOME }">{{
+                $t("return to the homepage")
+              }}</router-link>
+            </template>
+          </i18n>
+        </b-message>
+        <b-message type="is-success" v-else-if="submittedFeedback">
+          <p>{{ $t("Thanks a lot, your feedback was submitted!") }}</p>
+          <i18n path="You may now close this page or {return_to_the_homepage}.">
+            <template #return_to_the_homepage>
+              <router-link :to="{ name: RouteName.HOME }">{{
+                $t("return to the homepage")
+              }}</router-link>
+            </template>
+          </i18n>
+        </b-message>
+        <div
+          class="content"
+          v-if="!(sentryEnabled && sentryReady) || submittedFeedback"
+        >
+          <p v-if="submittedFeedback">{{ $t("You may also:") }}</p>
          <ul>
            <li>
              <a
@ -65,7 +127,7 @@
            </li>
            <li>
              <a
-                href="https://framagit.org/framasoft/mobilizon/-/issues/new?issuable_template=Bug"
+                href="https://framagit.org/framasoft/mobilizon/-/issues/"
                target="_blank"
                >{{
                  $t("Open an issue on our bug tracker (advanced users)")
@ -74,7 +136,7 @@
            </li>
          </ul>
        </div>
-        <p class="content">
+        <p class="content" v-if="!sentryEnabled">
          {{
            $t(
              "Please add as many details as possible to help identify the problem."
@ -89,14 +151,14 @@
          <p>{{ $t("Error stacktrace") }}</p>
          <pre>{{ error.stack }}</pre>
        </details>
-        <p>
+        <p v-if="!sentryEnabled">
          {{
            $t(
              "The technical details of the error can help developers solve the problem more easily. Please add them to your feedback."
            )
          }}
        </p>
-        <div class="buttons">
+        <div class="buttons" v-if="!sentryEnabled">
          <b-tooltip
            :label="tooltipConfig.label"
            :type="tooltipConfig.type"
@ -115,14 +177,20 @@
  </div>
 </template>
 <script lang="ts">
-import { CONTACT } from "@/graphql/config";
+import { CONFIG } from "@/graphql/config";
+import { checkProviderConfig, convertConfig } from "@/services/statistics";
+import { IAnalyticsConfig, IConfig } from "@/types/config.model";
 import { Component, Prop, Vue } from "vue-property-decorator";
+import { LOGGED_USER } from "@/graphql/user";
+import { IUser } from "@/types/current-user.model";
+import { ISentryConfiguration } from "@/types/analytics/sentry.model";
+import { submitFeedback } from "@/services/statistics/sentry";
+import RouteName from "@/router/name";

@Component({
  apollo: {
-    config: {
-      query: CONTACT,
-    },
+    config: CONFIG,
+    loggedUser: LOGGED_USER,
  },
  metaInfo() {
    return {
@ -138,7 +206,17 @@ export default class ErrorComponent extends Vue {

  copied: "success" | "error" | false = false;

-  config!: { contact: string | null; name: string };
+  config!: IConfig;
+
+  feedback = "";
+
+  submittedFeedback = false;
+
+  feedbackError = false;
+
+  loggedUser!: IUser;
+
+  RouteName = RouteName;

  async copyErrorToClipboard(): Promise<void> {
    try {
@ -193,6 +271,56 @@ export default class ErrorComponent extends Vue {

    document.body.removeChild(textArea);
  }
+
+  get sentryEnabled(): boolean {
+    return this.sentryProvider?.enabled === true;
+  }
+
+  get sentryProvider(): IAnalyticsConfig | undefined {
+    return this.config && checkProviderConfig(this.config, "sentry");
+  }
+
+  get sentryConfig(): ISentryConfiguration | undefined {
+    if (this.sentryProvider?.configuration) {
+      return convertConfig(
+        this.sentryProvider?.configuration
+      ) as ISentryConfiguration;
+    }
+    return undefined;
+  }
+
+  get sentryReady() {
+    const eventId = window.sessionStorage.getItem("lastEventId");
+    const dsn = this.sentryConfig?.dsn;
+    const organization = this.sentryConfig?.organization;
+    const project = this.sentryConfig?.project;
+    const host = this.sentryConfig?.host;
+    return eventId && dsn && organization && project && host;
+  }
+
+  async sendErrorToSentry() {
+    try {
+      const eventId = window.sessionStorage.getItem("lastEventId");
+      const dsn = this.sentryConfig?.dsn;
+      const organization = this.sentryConfig?.organization;
+      const project = this.sentryConfig?.project;
+      const host = this.sentryConfig?.host;
+      const endpoint = `https://${host}/api/0/projects/${organization}/${project}/user-feedback/`;
+      if (eventId && dsn && this.sentryReady) {
+        await submitFeedback(endpoint, dsn, {
+          event_id: eventId,
+          name:
+            this.loggedUser?.defaultActor?.preferredUsername || "Unknown user",
+          email: this.loggedUser?.email || "unknown@email.org",
+          comments: this.feedback,
+        });
+        this.submittedFeedback = true;
+      }
+    } catch (error) {
+      console.error(error);
+      this.feedbackError = true;
+    }
+  }
 }
 </script>
 <style lang="scss" scoped>
--- a/js/src/components/Event/DateCalendarIcon.vue
+++ b/js/src/components/Event/DateCalendarIcon.vue
@ -54,10 +54,13 @@ export default class DateCalendarIcon extends Vue {

 <style lang="scss" scoped>
 div.datetime-container {
+  background: #fff;
+  border: 1px solid $borders;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
+  padding: 8px;
  text-align: center;
  overflow-y: hidden;
  overflow-x: hidden;
--- a/js/src/components/Event/EventCard.vue
+++ b/js/src/components/Event/EventCard.vue
@ -67,7 +67,6 @@
            <inline-address
              dir="auto"
              v-if="event.physicalAddress"
-              class="event-subtitle"
              :physical-address="event.physicalAddress"
            />
            <div
@ -188,16 +187,22 @@ a.card {

    a {
      text-decoration: none;
+    }

-      span.tag {
-        margin: 5px auto;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        display: block;
-        font-size: 0.9em;
-        line-height: 1.75em;
+    span.tag {
+      margin: 5px auto;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      display: block;
+      font-size: 0.9em;
+      line-height: 1.75em;
+
+      &:not(.is-info, .is-danger) {
        background-color: #e6e4f4;
-        color: #3c376e;
+        color: $violet-3;
+      }
+      &.is-info {
+        color: $violet-3;
      }
    }
  }
@ -248,10 +253,13 @@ a.card {
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
-      padding-bottom: 8px;
      font-weight: bold;
    }

+    .content-end {
+      padding-top: 8px;
+    }
+
    .event-subtitle {
      font-size: 0.85rem;
    }
--- a/js/src/components/Event/EventFullDate.vue
+++ b/js/src/components/Event/EventFullDate.vue
@ -169,17 +169,20 @@ export default class EventFullDate extends Vue {

  isSameDay(): boolean {
    const sameDay =
-      new Date(this.beginsOn).toDateString() ===
-      new Date(this.endsOn).toDateString();
+      this.beginsOnDate.toDateString() === new Date(this.endsOn).toDateString();
    return this.endsOn !== undefined && sameDay;
  }

+  get beginsOnDate(): Date {
+    return new Date(this.beginsOn);
+  }
+
  get differentFromUserTimezone(): boolean {
    return (
      !!this.timezone &&
      !!this.userActualTimezone &&
-      getTimezoneOffset(this.timezone) !==
-        getTimezoneOffset(this.userActualTimezone) &&
+      getTimezoneOffset(this.timezone, this.beginsOnDate) !==
+        getTimezoneOffset(this.userActualTimezone, this.beginsOnDate) &&
      this.timezone !== this.userActualTimezone
    );
  }
--- a/js/src/components/Event/EventMetadataBlock.vue
+++ b/js/src/components/Event/EventMetadataBlock.vue
@ -45,6 +45,7 @@ div.eventMetadataBlock {
  .content-wrapper {
    overflow: hidden;
    width: 100%;
+    max-width: calc(100vw - 32px - 20px);

    &.padding-left {
      padding: 0 20px;
--- a/js/src/components/Event/EventMetadataSidebar.vue
+++ b/js/src/components/Event/EventMetadataSidebar.vue
@ -34,14 +34,9 @@
      class="metadata-organized-by"
      :title="$t('Organized by')"
    >
-      <popover-actor-card
-        :actor="event.organizerActor"
-        v-if="!event.attributedTo"
-      >
-        <actor-card :actor="event.organizerActor" />
-      </popover-actor-card>
      <router-link
        v-if="event.attributedTo"
+        class="hover:underline"
        :to="{
          name: RouteName.GROUP,
          params: {
@ -49,23 +44,21 @@
          },
        }"
      >
-        <popover-actor-card
-          :actor="event.attributedTo"
+        <actor-card
          v-if="
            !event.attributedTo || !event.options.hideOrganizerWhenGroupEvent
          "
-        >
-          <actor-card :actor="event.attributedTo" />
-        </popover-actor-card>
+          :actor="event.attributedTo"
+          :inline="true"
+        />
      </router-link>
-
-      <popover-actor-card
+      <actor-card v-else :actor="event.organizerActor" :inline="true" />
+      <actor-card
+        :inline="true"
        :actor="contact"
        v-for="contact in event.contacts"
        :key="contact.id"
-      >
-        <actor-card :actor="contact" />
-      </popover-actor-card>
+      />
    </event-metadata-block>
    <event-metadata-block
      v-if="event.onlineAddress && urlToHostname(event.onlineAddress)"
@ -74,6 +67,7 @@
    >
      <a
        target="_blank"
+        class="hover:underline"
        rel="noopener noreferrer ugc"
        :href="event.onlineAddress"
        :title="
--- a/js/src/components/Event/EventMinimalistCard.vue
+++ b/js/src/components/Event/EventMinimalistCard.vue
@ -1,6 +1,6 @@
 <template>
  <router-link
-    class="event-minimalist-card-wrapper"
+    class="event-minimalist-card-wrapper bg-white rounded-lg shadow-md"
    dir="auto"
    :to="{ name: RouteName.EVENT, params: { uuid: event.uuid } }"
  >
@ -18,6 +18,20 @@
    </div>
    <div class="title-info-wrapper has-text-grey-dark">
      <h3 class="event-minimalist-title" :lang="event.language" dir="auto">
+        <b-tag
+          type="is-info"
+          class="mr-1"
+          v-if="event.status === EventStatus.TENTATIVE"
+        >
+          {{ $t("Tentative") }}
+        </b-tag>
+        <b-tag
+          type="is-danger"
+          class="mr-1"
+          v-if="event.status === EventStatus.CANCELLED"
+        >
+          {{ $t("Cancelled") }}
+        </b-tag>
        <b-tag
          class="mr-2"
          type="is-warning"
@ -105,7 +119,7 @@
 import { Component, Prop, Vue } from "vue-property-decorator";
 import { IEvent, organizer, organizerDisplayName } from "@/types/event.model";
 import DateCalendarIcon from "@/components/Event/DateCalendarIcon.vue";
-import { ParticipantRole } from "@/types/enums";
+import { EventStatus, ParticipantRole } from "@/types/enums";
 import RouteName from "../../router/name";
 import LazyImageWrapper from "@/components/Image/LazyImageWrapper.vue";
 import InlineAddress from "@/components/Address/InlineAddress.vue";
@ -129,6 +143,8 @@ export default class EventMinimalistCard extends Vue {
  organizerDisplayName = organizerDisplayName;

  organizer = organizer;
+
+  EventStatus = EventStatus;
 }
 </script>
 <style lang="scss" scoped>
--- a/js/src/components/Event/EventParticipationCard.vue
+++ b/js/src/components/Event/EventParticipationCard.vue
@ -45,6 +45,22 @@
        </div>
        <div class="list-card-content">
          <div class="title-wrapper" dir="auto">
+            <b-tag
+              type="is-info"
+              class="mr-1 mb-1"
+              size="is-medium"
+              v-if="participation.event.status === EventStatus.TENTATIVE"
+            >
+              {{ $t("Tentative") }}
+            </b-tag>
+            <b-tag
+              type="is-danger"
+              class="mr-1 mb-1"
+              size="is-medium"
+              v-if="participation.event.status === EventStatus.CANCELLED"
+            >
+              {{ $t("Cancelled") }}
+            </b-tag>
            <router-link
              :to="{
                name: RouteName.EVENT,
@ -257,7 +273,7 @@ import { Component, Prop } from "vue-property-decorator";
 import DateCalendarIcon from "@/components/Event/DateCalendarIcon.vue";
 import { mixins } from "vue-class-component";
 import { RawLocation, Route } from "vue-router";
-import { EventVisibility, ParticipantRole } from "@/types/enums";
+import { EventStatus, EventVisibility, ParticipantRole } from "@/types/enums";
 import { IParticipant } from "../../types/participant.model";
 import {
  IEventCardOptions,
@ -326,6 +342,8 @@ export default class EventParticipationCard extends mixins(

  RouteName = RouteName;

+  EventStatus = EventStatus;
+
  get mergedOptions(): IEventCardOptions {
    return { ...defaultOptions, ...this.options };
  }
@ -528,4 +546,11 @@ article.box {
  }
  padding: 0;
 }
+.content h3.event-title-card {
+  line-height: 1em;
+  margin-top: 0.5em;
+}
+.participation-actor {
+  margin-top: 1em;
+}
 </style>
--- a/js/src/components/Event/OrganizerPicker.vue
+++ b/js/src/components/Event/OrganizerPicker.vue
@ -5,33 +5,48 @@
      :placeholder="$t('Filter by profile or group name')"
      v-model="actorFilter"
    />
-    <b-radio-button
-      v-model="selectedActor"
-      :native-value="availableActor"
-      class="list-item"
-      v-for="availableActor in actualFilteredAvailableActors"
-      :key="availableActor.id"
+    <transition-group
+      tag="ul"
+      class="grid grid-cols-1 gap-y-3 m-5 max-w-md mx-auto"
+      enter-active-class="duration-300 ease-out"
+      enter-from-class="transform opacity-0"
+      enter-to-class="opacity-100"
+      leave-active-class="duration-200 ease-in"
+      leave-from-class="opacity-100"
+      leave-to-class="transform opacity-0"
    >
-      <div class="media" dir="auto">
-        <figure class="image is-48x48" v-if="availableActor.avatar">
-          <img
-            class="image is-rounded"
-            :src="availableActor.avatar.url"
-            alt=""
-          />
-        </figure>
-        <b-icon
-          class="media-left"
-          v-else
-          size="is-large"
-          icon="account-circle"
+      <li
+        class="relative focus-within:shadow-lg"
+        v-for="availableActor in actualFilteredAvailableActors"
+        :key="availableActor.id"
+      >
+        <input
+          class="sr-only peer"
+          type="radio"
+          :value="availableActor"
+          name="availableActors"
+          v-model="selectedActor"
+          :id="`availableActor-${availableActor.id}`"
        />
-        <div class="media-content">
-          <h3>{{ availableActor.name }}</h3>
-          <small>{{ `@${availableActor.preferredUsername}` }}</small>
-        </div>
-      </div>
-    </b-radio-button>
+        <label
+          class="flex flex-wrap p-3 bg-white border border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50 peer-checked:ring-primary peer-checked:ring-2 peer-checked:border-transparent"
+          :for="`availableActor-${availableActor.id}`"
+        >
+          <figure class="image is-48x48" v-if="availableActor.avatar">
+            <img
+              class="image is-rounded"
+              :src="availableActor.avatar.url"
+              alt=""
+            />
+          </figure>
+          <b-icon v-else size="is-large" icon="account-circle" />
+          <div>
+            <h3>{{ availableActor.name }}</h3>
+            <small>{{ `@${availableActor.preferredUsername}` }}</small>
+          </div>
+        </label>
+      </li>
+    </transition-group>
  </div>
 </template>
 <script lang="ts">
@ -51,6 +66,13 @@ import { MemberRole } from "@/types/enums";
    groupMemberships: {
      query: LOGGED_USER_MEMBERSHIPS,
      update: (data) => data.loggedUser.memberships,
+      variables() {
+        return {
+          page: 1,
+          limit: 10,
+          membershipName: this.actorFilter,
+        };
+      },
    },
    identities: IDENTITIES,
    currentActor: CURRENT_ACTOR_CLIENT,
--- a/js/src/components/Event/OrganizerPickerWrapper.vue
+++ b/js/src/components/Event/OrganizerPickerWrapper.vue
@ -1,5 +1,8 @@
 <template>
-  <div class="organizer-picker" v-if="selectedActor">
+  <div
+    class="bg-white border border-gray-300 rounded-lg cursor-pointer"
+    v-if="selectedActor"
+  >
    <!-- If we have a current actor (inline) -->
    <div
      v-if="inline && selectedActor.id"
@ -65,42 +68,61 @@
              />
            </div>
            <div class="column contact-picker">
-              <div v-if="isSelectedActorAGroup && actorMembers.length > 0">
+              <div v-if="isSelectedActorAGroup">
                <p>{{ $t("Add a contact") }}</p>
                <b-input
                  :placeholder="$t('Filter by name')"
-                  v-model="contactFilter"
+                  :value="contactFilter"
+                  @input="debounceSetFilterByName"
                  dir="auto"
                />
-                <p
-                  class="field"
-                  v-for="actor in filteredActorMembers"
-                  :key="actor.id"
-                >
-                  <b-checkbox v-model="actualContacts" :native-value="actor.id">
-                    <div class="media">
-                      <div class="media-left">
-                        <figure class="image is-48x48" v-if="actor.avatar">
-                          <img
-                            class="image is-rounded"
-                            :src="actor.avatar.url"
-                            :alt="actor.avatar.alt"
+                <div v-if="actorMembers.length > 0">
+                  <p
+                    class="field"
+                    v-for="actor in filteredActorMembers"
+                    :key="actor.id"
+                  >
+                    <b-checkbox
+                      v-model="actualContacts"
+                      :native-value="actor.id"
+                    >
+                      <div class="media">
+                        <div class="media-left">
+                          <figure class="image is-48x48" v-if="actor.avatar">
+                            <img
+                              class="image is-rounded"
+                              :src="actor.avatar.url"
+                              :alt="actor.avatar.alt"
+                            />
+                          </figure>
+                          <b-icon
+                            v-else
+                            size="is-large"
+                            icon="account-circle"
                          />
-                        </figure>
-                        <b-icon v-else size="is-large" icon="account-circle" />
-                      </div>
-                      <div class="media-content" v-if="actor.name">
-                        <p class="is-4">{{ actor.name }}</p>
-                        <p class="is-6 has-text-grey-dark">
+                        </div>
+                        <div class="media-content" v-if="actor.name">
+                          <p class="is-4">{{ actor.name }}</p>
+                          <p class="is-6 has-text-grey-dark">
+                            {{ `@${usernameWithDomain(actor)}` }}
+                          </p>
+                        </div>
+                        <div class="media-content" v-else>
                          {{ `@${usernameWithDomain(actor)}` }}
-                        </p>
+                        </div>
                      </div>
-                      <div class="media-content" v-else>
-                        {{ `@${usernameWithDomain(actor)}` }}
-                      </div>
-                    </div>
-                  </b-checkbox>
-                </p>
+                    </b-checkbox>
+                  </p>
+                </div>
+                <div
+                  v-else-if="
+                    actorMembers.length === 0 && contactFilter.length > 0
+                  "
+                >
+                  <empty-content icon="account-multiple" :inline="true">
+                    {{ $t("No group member found") }}
+                  </empty-content>
+                </div>
              </div>
              <div v-else class="content has-text-grey-dark has-text-centered">
                <p>{{ $t("Your profile will be shown as contact.") }}</p>
@ -122,14 +144,16 @@ import { Component, Prop, Vue, Watch } from "vue-property-decorator";
 import { IMember } from "@/types/actor/member.model";
 import { IActor, IGroup, IPerson, usernameWithDomain } from "../../types/actor";
 import OrganizerPicker from "./OrganizerPicker.vue";
+import EmptyContent from "../Utils/EmptyContent.vue";
 import {
  CURRENT_ACTOR_CLIENT,
  IDENTITIES,
-  LOGGED_USER_MEMBERSHIPS,
+  PERSON_GROUP_MEMBERSHIPS,
 } from "../../graphql/actor";
 import { Paginate } from "../../types/paginate";
 import { GROUP_MEMBERS } from "@/graphql/member";
 import { ActorType, MemberRole } from "@/types/enums";
+import debounce from "lodash/debounce";

 const MEMBER_ROLES = [
  MemberRole.CREATOR,
@ -139,16 +163,17 @@ const MEMBER_ROLES = [
 ];

@Component({
-  components: { OrganizerPicker },
+  components: { OrganizerPicker, EmptyContent },
  apollo: {
    members: {
      query: GROUP_MEMBERS,
      variables() {
        return {
-          name: usernameWithDomain(this.selectedActor),
+          groupName: usernameWithDomain(this.selectedActor),
          page: this.membersPage,
          limit: 10,
          roles: MEMBER_ROLES.join(","),
+          name: this.contactFilter,
        };
      },
      update: (data) => data.group.members,
@ -159,13 +184,17 @@ const MEMBER_ROLES = [
      },
    },
    currentActor: CURRENT_ACTOR_CLIENT,
-    userMemberships: {
-      query: LOGGED_USER_MEMBERSHIPS,
-      variables: {
-        page: 1,
-        limit: 100,
+    personMemberships: {
+      query: PERSON_GROUP_MEMBERSHIPS,
+      variables() {
+        return {
+          id: this.currentActor?.id,
+          page: 1,
+          limit: 10,
+          groupId: this.$route.query?.actorId,
+        };
      },
-      update: (data) => data.loggedUser.memberships,
+      update: (data) => data.person.memberships,
    },
    identities: IDENTITIES,
  },
@ -175,6 +204,9 @@ export default class OrganizerPickerWrapper extends Vue {

  @Prop({ default: true, type: Boolean }) inline!: boolean;

+  @Prop({ type: Array, required: false, default: () => [] })
+  contacts!: IActor[];
+
  currentActor!: IPerson;

  identities!: IPerson[];
@ -185,13 +217,17 @@ export default class OrganizerPickerWrapper extends Vue {

  usernameWithDomain = usernameWithDomain;

-  @Prop({ type: Array, required: false, default: () => [] })
-  contacts!: IActor[];
  members: Paginate<IMember> = { elements: [], total: 0 };

  membersPage = 1;

-  userMemberships: Paginate<IMember> = { elements: [], total: 0 };
+  personMemberships: Paginate<IMember> = { elements: [], total: 0 };
+
+  data(): Record<string, unknown> {
+    return {
+      debounceSetFilterByName: debounce(this.setContactFilter, 1000),
+    };
+  }

  get actualContacts(): (string | undefined)[] {
    return this.contacts.map(({ id }) => id);
@ -204,15 +240,17 @@ export default class OrganizerPickerWrapper extends Vue {
    );
  }

-  @Watch("userMemberships")
+  setContactFilter(contactFilter: string) {
+    this.contactFilter = contactFilter;
+  }
+
+  @Watch("personMemberships")
  setInitialActor(): void {
-    if (this.$route.query?.actorId) {
-      const actorId = this.$route.query?.actorId as string;
-      const actor = this.userMemberships.elements.find(
-        ({ parent: { id }, role }) =>
-          actorId === id && MEMBER_ROLES.includes(role)
-      )?.parent as IActor;
-      this.selectedActor = actor;
+    if (
+      this.personMemberships?.elements[0]?.parent?.id ===
+      this.$route.query?.actorId
+    ) {
+      this.selectedActor = this.personMemberships?.elements[0]?.parent;
    }
  }

@ -254,7 +292,7 @@ export default class OrganizerPickerWrapper extends Vue {
        actor.preferredUsername.toLowerCase(),
        actor.name?.toLowerCase(),
        actor.domain?.toLowerCase(),
-      ].some((match) => match?.includes(this.contactFilter.toLowerCase()));
+      ];
    });
  }

--- a/js/src/components/Event/ShareEventModal.vue
+++ b/js/src/components/Event/ShareEventModal.vue
@ -190,7 +190,7 @@ export default class ShareEventModal extends Vue {
  }

  get mastodonShareUrl(): string {
-    return `https://toot.karamoff.dev/?text=${encodeURIComponent(
+    return `https://toot.kytta.dev/?text=${encodeURIComponent(
      this.basicTextToEncode
    )}`;
  }
--- a/js/src/components/Event/TagInput.vue
+++ b/js/src/components/Event/TagInput.vue
@ -21,7 +21,7 @@
      maxlength="20"
      maxtags="10"
      :placeholder="$t('Eg: Stockholm, Dance, Chess…')"
-      @typing="getFilteredTags"
+      @typing="debouncedGetFilteredTags"
      :id="id"
      dir="auto"
    >
@ -33,6 +33,7 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 import differenceBy from "lodash/differenceBy";
 import { ITag } from "../../types/tag.model";
 import { FILTER_TAGS } from "@/graphql/tags";
+import debounce from "lodash/debounce";

@Component({
  apollo: {
@ -63,6 +64,12 @@ export default class TagInput extends Vue {
    return `tag-input-${TagInput.componentId}`;
  }

+  data(): Record<string, unknown> {
+    return {
+      debouncedGetFilteredTags: debounce(this.getFilteredTags, 200),
+    };
+  }
+
  async getFilteredTags(text: string): Promise<void> {
    this.text = text;
    await this.$apollo.queries.tags.refetch();
--- a/js/src/components/Footer.vue
+++ b/js/src/components/Footer.vue
@ -40,6 +40,11 @@
          $t("About")
        }}</router-link>
      </li>
+      <li>
+        <a href="https://www.chapril.org/Mentions-legales.html">
+          Mentions légales
+        </a>
+      </li>
      <li>
        <router-link :to="{ name: RouteName.TERMS }">{{
          $t("Terms")
@ -49,11 +54,14 @@
        <a
          rel="external"
          hreflang="en"
-          href="https://framagit.org/framasoft/mobilizon/blob/main/LICENSE"
+          href="https://forge.april.org/Chapril/mobilizon.chapril.org-mobilizon/src/branch/chapril/LICENSE"
        >
          {{ $t("License") }}
        </a>
      </li>
+      <li>
+        <a href="mailto:mobilizon-support@chapril.org">{{ $t("Contact") }}</a>
+      </li>
      <li>
        <a href="#navbar">{{ $t("Back to top") }}</a>
      </li>
--- a/js/src/components/Group/GroupCard.vue
+++ b/js/src/components/Group/GroupCard.vue
@ -31,11 +31,11 @@
          </span>
        </div>
      </div>
-      <div class="content mb-2" dir="auto" v-html="group.summary" />
-      <div class="card-custom-footer">
+      <div class="mb-2 line-clamp-3" dir="auto" v-html="group.summary" />
+      <div>
        <inline-address
          class="has-text-grey-dark"
-          v-if="group.physicalAddress"
+          v-if="group.physicalAddress && addressFullName(group.physicalAddress)"
          :physicalAddress="group.physicalAddress"
        />
        <p class="has-text-grey-dark">
@ -61,6 +61,7 @@ import { displayName, IGroup, usernameWithDomain } from "@/types/actor";
 import LazyImageWrapper from "@/components/Image/LazyImageWrapper.vue";
 import RouteName from "../../router/name";
 import InlineAddress from "@/components/Address/InlineAddress.vue";
+import { addressFullName } from "@/types/address.model";

@Component({
  components: {
@ -76,6 +77,8 @@ export default class GroupCard extends Vue {
  usernameWithDomain = usernameWithDomain;

  displayName = displayName;
+
+  addressFullName = addressFullName;
 }
 </script>
 <style lang="scss" scoped>
--- a/js/src/components/Group/JoinGroupWithAccount.vue
+++ b/js/src/components/Group/JoinGroupWithAccount.vue
@ -10,7 +10,7 @@
 import { Component, Prop, Vue } from "vue-property-decorator";
 import RedirectWithAccount from "@/components/Utils/RedirectWithAccount.vue";
 import { FETCH_GROUP } from "@/graphql/group";
-import { IGroup } from "@/types/actor";
+import { displayName, IGroup } from "@/types/actor";

@Component({
  components: { RedirectWithAccount },
@ -52,7 +52,7 @@ export default class JoinGroupWithAccount extends Vue {
  }

  get groupTitle(): undefined | string {
-    return this.group?.name || this.group?.preferredUsername;
+    return this.group && displayName(this.group);
  }

  sentence = this.$t(
--- a/js/src/components/Group/ShareGroupModal.vue
+++ b/js/src/components/Group/ShareGroupModal.vue
@ -117,7 +117,7 @@ import { Component, Prop, Vue, Ref } from "vue-property-decorator";
 import { GroupVisibility } from "@/types/enums";
 import DiasporaLogo from "../Share/DiasporaLogo.vue";
 import MastodonLogo from "../Share/MastodonLogo.vue";
-import TelegramLogo from "../Share/MastodonLogo.vue";
+import TelegramLogo from "../Share/TelegramLogo.vue";
 import { displayName, IGroup } from "@/types/actor";

@Component({
@ -177,7 +177,7 @@ export default class ShareGroupModal extends Vue {
  }

  get mastodonShareUrl(): string {
-    return `https://toot.karamoff.dev/?text=${encodeURIComponent(
+    return `https://toot.kytta.dev/?text=${encodeURIComponent(
      this.basicTextToEncode
    )}`;
  }
--- a/js/src/components/Logo.vue
+++ b/js/src/components/Logo.vue
@ -1,34 +1,12 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248.16 46.78">
-    <title>Mobilizon Logo</title>
-    <g data-name="header">
-      <path
-        d="M0 45.82l3.18-40.8a29.88 29.88 0 015.07-.36 27.74 27.74 0 014.95.36l4.86 17.16a92.19 92.19 0 012.34 10.08h.36a92.19 92.19 0 012.34-10.08L28 5.02a29.23 29.23 0 015-.36 29.23 29.23 0 015 .36l3.18 40.8a13.61 13.61 0 01-3.63.42 23.41 23.41 0 01-3.63-.24l-1.2-19.92q-.36-5.52-.48-12.84h-.44l-7.32 26.51a25.62 25.62 0 01-4 .3 23.36 23.36 0 01-3.84-.3L9.36 13.24H9q-.3 8.94-.48 12.84L7.26 46a22.47 22.47 0 01-3.6.24A13.75 13.75 0 010 45.82zM74 31.06q0 8-4.26 12.3a12.21 12.21 0 01-9 3.42 12.21 12.21 0 01-9-3.42q-4.26-4.26-4.26-12.3t4.24-12.31a12.21 12.21 0 019-3.42 12.21 12.21 0 019 3.42Q74 23.02 74 31.06zM60.75 20.98q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM103.2 19.75q2.7 4.11 2.7 11.28T102 42.31a13.18 13.18 0 01-10 4.11 31.41 31.41 0 01-11.34-2V2.2l.4-.45h2.76A4 4 0 0187 2.83a5.38 5.38 0 01.93 3.57v11.94a12.08 12.08 0 017.56-2.7 8.71 8.71 0 017.71 4.11zm-9.72 2a7.28 7.28 0 00-5.58 2.82v16a15 15 0 004.08.54 5.25 5.25 0 004.68-2.67q1.68-2.67 1.68-7.59 0-9.03-4.86-9.1zM121 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014 1.62A6.27 6.27 0 01121 22z"
-      />
-      <path
-        d="M119.82.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z"
-        fill="#fff"
-      />
-      <path
-        d="M139.08 40.42h2a10.23 10.23 0 01.6 3.18 9.24 9.24 0 01-.18 2.1 38.47 38.47 0 01-5.64.54q-6.48 0-6.48-7v-37l.36-.42h2.88a3.94 3.94 0 013.12 1.05 5.52 5.52 0 01.9 3.57v31.31q-.02 2.67 2.44 2.67zM155.94 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014.05 1.62 6.27 6.27 0 011.43 4.39z"
-      />
-      <path
-        d="M154.8 2.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z"
-        fill="#fff"
-      />
-      <path
-        d="M163.08 39.22l8.76-11.82q1.32-1.8 4.8-5.7l-.18-.3a63.09 63.09 0 01-7.74.42H163a9.79 9.79 0 01-.24-2.34 15.8 15.8 0 01.42-3.3h20.4a16.31 16.31 0 011 4.26 4.1 4.1 0 01-.78 2.34L175 34.66a64.65 64.65 0 01-4.56 5.7l.18.24q3.12-.3 5.22-.3h2.58a15.35 15.35 0 006.12-.9 9.4 9.4 0 01.72 3.12q0 3.42-4.32 3.42h-18a14.27 14.27 0 01-.9-3.93 5.08 5.08 0 011.04-2.79zM215.88 31.06q0 8-4.26 12.3a13.63 13.63 0 01-18.06 0q-4.26-4.26-4.26-12.3t4.26-12.31a13.63 13.63 0 0118.06 0q4.26 4.27 4.26 12.31zm-13.29-10.08q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM247 25.84v13.32a11 11 0 001.2 5.64 7 7 0 01-4.41 1.56q-2.43 0-3.33-1.14a5.69 5.69 0 01-.9-3.54V27.4a7.74 7.74 0 00-.72-3.87 2.78 2.78 0 00-2.58-1.17 8.62 8.62 0 00-6.3 3v20.58a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3v-29.7l.42-.36h2.76q3.42 0 4.08 3.6 4.38-3.84 8.73-3.84t6.42 2.82a12.17 12.17 0 012.07 7.38z"
-      />
-      <path
-        d="M57.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84zM198.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84z"
-        fill="#fff"
-      />
-    </g>
-  </svg>
+  <img src="img/pics/logo_chapril_mobilizon.png" alt="logo chapril" />
 </template>

 <script lang="ts">
 import { Component, Prop, Vue } from "vue-property-decorator";
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+// import MobilizonLogo from "../assets/logo_chapril_mobilizon.png";

@Component
 export default class Logo extends Vue {
--- a/js/src/components/Map.vue
+++ b/js/src/components/Map.vue
@ -142,7 +142,9 @@ export default class Map extends Vue {
  }

  updateDraggableMarkerPosition(e: LatLng): void {
-    this.updateDraggableMarkerCallback(e, this.zoom);
+    if (this.updateDraggableMarkerCallback) {
+      this.updateDraggableMarkerCallback(e, this.zoom);
+    }
  }

  updateZoom(zoom: number): void {
--- a/js/src/components/Map/Vue2LeafletLocateControl.vue
+++ b/js/src/components/Map/Vue2LeafletLocateControl.vue
@ -28,7 +28,7 @@ export default class Vue2LeafletLocateControl extends Vue {
    unknown
  >;

-  @Prop({ type: Boolean, default: true }) visible = true;
+  @Prop({ type: Boolean, default: true }) visible!: boolean;

  ready = false;

--- a/js/src/components/NavBar.vue
+++ b/js/src/components/NavBar.vue
@ -11,7 +11,11 @@
        :to="{ name: RouteName.HOME }"
        :aria-label="$t('Home')"
      >
-        <logo />
+        <img
+          src="/img/long_logo_chapril_mobilizon.png"
+          alt="logo mobilizon"
+          style="width: 5em"
+        />
      </b-navbar-item>
    </template>
    <template slot="start">
@ -52,23 +56,17 @@
          >{{ $t("Create") }}</b-button
        >
      </b-navbar-item>
-      <b-navbar-item
-        v-if="config && config.features.koenaConnect"
-        class="koena"
-        tag="a"
-        href="https://mediation.koena.net/framasoft/mobilizon/"
-        target="_blank"
-        rel="noopener external"
-        hreflang="fr"
-      >
-        <img
-          src="/img/koena-a11y.svg"
-          width="150"
-          alt="Contact accessibilité"
-        />
-      </b-navbar-item>
    </template>
    <template slot="end">
+      <b-navbar-item
+        href="https://www.chapril.org"
+        :aria-label="'www.chapril.org'"
+      >
+        <img
+          src="/img/pics/logo_chapril_mobilizon.png"
+          alt="logo chapril mobilizon"
+        />
+      </b-navbar-item>
      <b-navbar-item tag="div">
        <search-field @navbar-search="mobileNavbarActive = false" />
      </b-navbar-item>
@ -148,8 +146,8 @@
          v-if="currentUser.role === ICurrentUserRole.ADMINISTRATOR"
          tag="router-link"
          :to="{ name: RouteName.ADMIN_DASHBOARD }"
-          >{{ $t("Administration") }}</b-navbar-item
-        >
+          >{{ $t("Administration") }}
+        </b-navbar-item>

        <b-navbar-item
          tag="span"
@ -272,6 +270,11 @@ export default class NavBar extends Vue {
      // If we don't have any identities, the user has validated their account,
      // is logging for the first time but didn't create an identity somehow
      if (this.identities.length === 0) {
+        console.debug(
+          "We have no identities listed for current user",
+          this.identities
+        );
+        console.debug("Pushing route to REGISTER_PROFILE");
        try {
          await this.$router.push({
            name: RouteName.REGISTER_PROFILE,
@ -376,15 +379,6 @@ nav {
    background-color: inherit;
  }

-  .koena {
-    padding-top: 0;
-    padding-bottom: 0;
-    & > img {
-      max-height: 4rem;
-      padding-top: 0.2rem;
-    }
-  }
-
  .identity-wrapper {
    display: flex;

--- a/js/src/components/Post/PostListItem.vue
+++ b/js/src/components/Post/PostListItem.vue
@ -9,7 +9,7 @@
      :rounded="true"
      style="height: 120px"
    />
-    <div class="title-info-wrapper has-text-grey-dark">
+    <div class="title-info-wrapper has-text-grey-dark px-1">
      <h3 class="post-minimalist-title" :lang="post.language">
        {{ post.title }}
      </h3>
--- a/js/src/components/Post/SharePostModal.vue
+++ b/js/src/components/Post/SharePostModal.vue
@ -179,7 +179,7 @@ export default class SharePostModal extends Vue {
  }

  get mastodonShareUrl(): string {
-    return `https://toot.karamoff.dev/?text=${encodeURIComponent(
+    return `https://toot.kytta.dev/?text=${encodeURIComponent(
      this.basicTextToEncode
    )}`;
  }
--- a/js/src/components/Report/ReportModal.vue
+++ b/js/src/components/Report/ReportModal.vue
@ -9,7 +9,7 @@
      :class="{ 'is-titleless': !title }"
    >
      <div class="media">
-        <div class="media-left">
+        <div class="media-left hidden md:block">
          <b-icon icon="alert" type="is-warning" size="is-large" />
        </div>
        <div class="media-content">
--- a/js/src/components/Resource/ResourceItem.vue
+++ b/js/src/components/Resource/ResourceItem.vue
@ -45,7 +45,7 @@
    </a>
    <resource-dropdown
      class="actions"
-      v-if="!inline || !preview"
+      v-if="!inline && !preview"
      @delete="$emit('delete', resource.id)"
      @move="$emit('move', resource)"
      @rename="$emit('rename', resource)"
--- a/js/src/components/Resource/ResourceSelector.vue
+++ b/js/src/components/Resource/ResourceSelector.vue
@ -1,7 +1,7 @@
 <template>
  <div v-if="resource">
    <article class="panel is-primary">
-      <p class="panel-heading">
+      <p class="panel-heading truncate">
        {{
          $t('Move "{resourceName}"', { resourceName: initialResource.title })
        }}
@ -28,7 +28,7 @@
      </a>
      <template v-if="resource.children">
        <a
-          class="panel-block"
+          class="panel-block flex-wrap"
          v-for="element in resource.children.elements"
          :class="{
            clickable:
@ -37,15 +37,17 @@
          :key="element.id"
          @click="goDown(element)"
        >
-          <span class="panel-icon">
-            <b-icon
-              icon="folder"
-              size="is-small"
-              v-if="element.type === 'folder'"
-            />
-            <b-icon icon="link" size="is-small" v-else />
-          </span>
-          {{ element.title }}
+          <p class="truncate">
+            <span class="panel-icon">
+              <b-icon
+                icon="folder"
+                size="is-small"
+                v-if="element.type === 'folder'"
+              />
+              <b-icon icon="link" size="is-small" v-else />
+            </span>
+            <span>{{ element.title }}</span>
+          </p>
          <span v-if="element.id === initialResource.id">
            <em v-if="element.type === 'folder'"> {{ $t("(this folder)") }}</em>
            <em v-else> {{ $t("(this link)") }}</em>
@ -89,7 +91,7 @@
  </div>
 </template>
 <script lang="ts">
-import { Component, Vue, Prop } from "vue-property-decorator";
+import { Component, Vue, Prop, Watch } from "vue-property-decorator";
 import { GET_RESOURCE } from "../../graphql/resources";
 import { IResource } from "../../types/resource";

@ -119,7 +121,7 @@ export default class ResourceSelector extends Vue {

  @Prop({ required: true }) username!: string;

-  resource: IResource | undefined = this.initialResource.parent;
+  resource: IResource | undefined = undefined;

  RESOURCES_PER_PAGE = 10;

@ -131,6 +133,20 @@ export default class ResourceSelector extends Vue {
    }
  }

+  data() {
+    return {
+      resource: this.initialResource?.parent,
+    };
+  }
+
+  @Watch("initialResource")
+  updateResourceFromProp() {
+    if (this.initialResource) {
+      this.resource = this.initialResource?.parent;
+      this.$apollo.queries.resource.refetch();
+    }
+  }
+
  updateResource(): void {
    this.$emit(
      "update-resource",
--- a/js/src/components/SearchField.vue
+++ b/js/src/components/SearchField.vue
@ -1,18 +1,22 @@
 <template>
-  <label for="navSearchField">
-    <span class="visually-hidden">{{ defaultPlaceHolder }}</span>
+  <b-field label-for="navSearchField" class="-mt-2">
    <b-input
-      custom-class="searchField"
+      :placeholder="defaultPlaceHolder"
+      type="search"
      id="navSearchField"
      icon="magnify"
-      type="search"
+      icon-clickable
      rounded
+      custom-class="searchField"
      dir="auto"
-      :placeholder="defaultPlaceHolder"
      v-model="search"
      @keyup.native.enter="enter"
-    />
-  </label>
+    >
+    </b-input>
+    <template #label>
+      <span class="sr-only">{{ defaultPlaceHolder }}</span>
+    </template>
+  </b-field>
 </template>
 <script lang="ts">
 import { Component, Prop, Vue } from "vue-property-decorator";
@ -47,6 +51,7 @@ label span.visually-hidden {
 input.searchField {
  box-shadow: none;
  border-color: #b5b5b5;
+  border-radius: 9999px !important;

  &::placeholder {
    color: gray;
--- a/js/src/components/Settings/SettingsMenu.vue
+++ b/js/src/components/Settings/SettingsMenu.vue
@ -78,7 +78,7 @@
        />
        <SettingMenuItem
          :title="$t('Federation')"
-          :to="{ name: RouteName.RELAYS }"
+          :to="{ name: RouteName.INSTANCES }"
        />
      </SettingMenuSection>
    </ul>
--- a/js/src/components/Tag.vue
+++ b/js/src/components/Tag.vue
@ -17,7 +17,8 @@ span.tag {
  background: $purple-3;
  color: $violet-2;
  text-transform: uppercase;
-  &::before {
+
+  &:not(.category)::before {
    content: "#";
  }
 }
--- a/js/src/components/Todo/FullTodo.vue
+++ b/js/src/components/Todo/FullTodo.vue
@ -7,29 +7,23 @@
      <b-field :label="$t('Title')">
        <b-input v-model="title" />
      </b-field>
-      <b-field :label="$t('Assigned to')">
-        <actor-auto-complete v-model="assignedTo" />
-      </b-field>
+      <b-field :label="$t('Assigned to')"> </b-field>
      <b-field :label="$t('Due on')">
-        <b-datepicker v-model="dueDate" />
+        <b-datepicker v-model="dueDate" :first-day-of-week="firstDayOfWeek" />
      </b-field>
    </div>
  </div>
 </template>
 <script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
+import { Prop, Vue } from "vue-property-decorator";
 import debounce from "lodash/debounce";
 import { DebouncedFunc } from "lodash";
 import { SnackbarProgrammatic as Snackbar } from "buefy";
 import { ITodo } from "../../types/todos";
 import RouteName from "../../router/name";
 import { UPDATE_TODO } from "../../graphql/todos";
-import ActorAutoComplete from "../Account/ActorAutoComplete.vue";
 import { IPerson } from "../../types/actor";

-@Component({
-  components: { ActorAutoComplete },
-})
 export default class Todo extends Vue {
  @Prop({ required: true, type: Object }) todo!: ITodo;

@ -99,5 +93,9 @@ export default class Todo extends Vue {
      });
    }
  }
+
+  get firstDayOfWeek(): number {
+    return this.$dateFnsLocale?.options?.weekStartsOn || 0;
+  }
 }
 </script>
--- a/js/src/components/Utils/Breadcrumbs.vue
+++ b/js/src/components/Utils/Breadcrumbs.vue
@ -0,0 +1,69 @@
+<template>
+  <nav class="flex mb-3" :aria-label="$t('Breadcrumbs')">
+    <ol class="inline-flex items-center space-x-1 md:space-x-3 flex-wrap">
+      <li
+        class="inline-flex items-center"
+        v-for="(element, index) in links"
+        :key="index"
+        :aria-current="index > 0 ? 'page' : undefined"
+      >
+        <router-link
+          v-if="index === 0"
+          :to="element"
+          class="inline-flex items-center text-gray-800 hover:text-gray-900"
+        >
+          {{ element.text }}
+        </router-link>
+        <div class="flex items-center" v-else-if="index === links.length - 1">
+          <svg
+            class="w-6 h-6 text-gray-400 rtl:rotate-180"
+            fill="currentColor"
+            viewBox="0 0 20 20"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              fill-rule="evenodd"
+              d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
+              clip-rule="evenodd"
+            ></path>
+          </svg>
+          <span
+            class="ltr:ml-1 rtl:mr-1 font-medium text-gray-600 md:ltr:ml-2 md:rtl:mr-2"
+            >{{ element.text }}</span
+          >
+        </div>
+        <div class="flex items-center" v-else>
+          <svg
+            class="w-6 h-6 text-gray-400 rtl:rotate-180"
+            fill="currentColor"
+            viewBox="0 0 20 20"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              fill-rule="evenodd"
+              d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
+              clip-rule="evenodd"
+            ></path>
+          </svg>
+          <router-link
+            :to="element"
+            class="ltr:ml-1 rtl:mr-1 font-medium text-gray-800 hover:text-gray-900 md:ltr:ml-2 md:rtl:mr-2"
+            >{{ element.text }}</router-link
+          >
+        </div>
+      </li>
+      <slot></slot>
+    </ol>
+  </nav>
+</template>
+<script lang="ts">
+import { Component, Prop, Vue } from "vue-property-decorator";
+import { Location } from "vue-router";
+
+type LinkElement = Location & { text: string };
+
+@Component
+export default class Breadcrumbs extends Vue {
+  @Prop({ type: Array, required: true }) links!: LinkElement[];
+}
+</script>
--- a/js/src/components/Utils/EmptyContent.vue
+++ b/js/src/components/Utils/EmptyContent.vue
@ -1,11 +1,15 @@
 <template>
-  <div class="empty-content" :class="{ inline }" role="note">
+  <div
+    class="empty-content"
+    :class="{ inline, 'text-center': center }"
+    role="note"
+  >
    <b-icon :icon="icon" size="is-large" />
    <h2 class="empty-content__title">
      <!-- @slot Mandatory title -->
      <slot />
    </h2>
-    <p v-show="$slots.desc">
+    <p v-show="$slots.desc" :class="descriptionClasses">
      <!-- @slot Optional description -->
      <slot name="desc" />
    </p>
@ -17,7 +21,10 @@ import { Component, Prop, Vue } from "vue-property-decorator";
@Component
 export default class EmptyContent extends Vue {
  @Prop({ type: String, required: true }) icon!: string;
+  @Prop({ type: String, required: false, default: "" })
+  descriptionClasses!: string;
  @Prop({ type: Boolean, required: false, default: false }) inline!: boolean;
+  @Prop({ type: Boolean, required: false, default: false }) center!: boolean;
 }
 </script>

--- a/js/src/components/Utils/Subtitle.vue
+++ b/js/src/components/Utils/Subtitle.vue
@ -17,10 +17,8 @@ h2 {
  margin: 15px 0 30px;

  span {
-    background: $secondary;
    display: inline;
    padding: 3px 8px;
-    color: #3a384c;
    font-family: "Liberation Sans", "Helvetica Neue", Roboto, Helvetica, Arial,
      serif;
    font-weight: 400;
--- a/js/src/filters/datetime.ts
+++ b/js/src/filters/datetime.ts
@ -56,7 +56,7 @@ const SHORT_TIME_FORMAT_OPTIONS: DateTimeFormatOptions = {

 function formatDateTimeString(
  value: string,
-  timeZone: string | undefined = undefined,
+  timeZone: string | null | undefined = undefined,
  showTime = true,
  dateFormat = "long"
 ): string {
@ -68,7 +68,7 @@ function formatDateTimeString(
    options = {
      ...options,
      ...(isLongFormat ? LONG_TIME_FORMAT_OPTIONS : SHORT_TIME_FORMAT_OPTIONS),
-      timeZone,
+      timeZone: timeZone || undefined,
    };
  }
  const format = new Intl.DateTimeFormat(locale(), options);
--- a/js/src/graphql/actor.ts
+++ b/js/src/graphql/actor.ts
@ -34,15 +34,6 @@ export const FETCH_PERSON = gql`
      feedTokens {
        token
      }
-      organizedEvents {
-        total
-        elements {
-          id
-          uuid
-          title
-          beginsOn
-        }
-      }
    }
  }
  ${ACTOR_FRAGMENT}
@ -84,6 +75,7 @@ export const GET_PERSON = gql`
          uuid
          title
          beginsOn
+          status
        }
      }
      participations(page: $participationPage, limit: $participationLimit) {
@ -95,6 +87,7 @@ export const GET_PERSON = gql`
            uuid
            title
            beginsOn
+            status
          }
        }
      }
@ -213,6 +206,7 @@ export const LOGGED_USER_DRAFTS = gql`
          alt
        }
        beginsOn
+        status
        visibility
        attributedTo {
          ...ActorFragment
@ -235,10 +229,14 @@ export const LOGGED_USER_DRAFTS = gql`
 `;

 export const LOGGED_USER_MEMBERSHIPS = gql`
-  query LoggedUserMemberships($page: Int, $limit: Int) {
+  query LoggedUserMemberships(
+    $membershipName: String
+    $page: Int
+    $limit: Int
+  ) {
    loggedUser {
      id
-      memberships(page: $page, limit: $limit) {
+      memberships(name: $membershipName, page: $page, limit: $limit) {
        total
        elements {
          id
@ -343,6 +341,30 @@ export const PERSON_STATUS_GROUP = gql`
  ${ACTOR_FRAGMENT}
 `;

+export const PERSON_GROUP_MEMBERSHIPS = gql`
+  query PersonGroupMemberships($id: ID!, $groupId: ID!) {
+    person(id: $id) {
+      id
+      memberships(groupId: $groupId) {
+        total
+        elements {
+          id
+          role
+          parent {
+            ...ActorFragment
+          }
+          invitedBy {
+            ...ActorFragment
+          }
+          insertedAt
+          updatedAt
+        }
+      }
+    }
+  }
+  ${ACTOR_FRAGMENT}
+`;
+
 export const GROUP_MEMBERSHIP_SUBSCRIPTION_CHANGED = gql`
  subscription GroupMembershipSubscriptionChanged(
    $actorId: ID!
--- a/js/src/graphql/admin.ts
+++ b/js/src/graphql/admin.ts
@ -70,13 +70,66 @@ export const RELAY_FOLLOWINGS = gql`
  ${RELAY_FRAGMENT}
 `;

-export const ADD_RELAY = gql`
-  mutation addRelay($address: String!) {
-    addRelay(address: $address) {
-      ...relayFragment
+export const INSTANCE_FRAGMENT = gql`
+  fragment InstanceFragment on Instance {
+    domain
+    hasRelay
+    relayAddress
+    followerStatus
+    followedStatus
+    eventCount
+    personCount
+    groupCount
+    followersCount
+    followingsCount
+    reportsCount
+    mediaSize
+  }
+`;
+
+export const INSTANCE = gql`
+  query instance($domain: ID!) {
+    instance(domain: $domain) {
+      ...InstanceFragment
    }
  }
-  ${RELAY_FRAGMENT}
+  ${INSTANCE_FRAGMENT}
+`;
+
+export const INSTANCES = gql`
+  query Instances(
+    $page: Int
+    $limit: Int
+    $orderBy: InstancesSortFields
+    $direction: String
+    $filterDomain: String
+    $filterFollowStatus: InstanceFilterFollowStatus
+    $filterSuspendStatus: InstanceFilterSuspendStatus
+  ) {
+    instances(
+      page: $page
+      limit: $limit
+      orderBy: $orderBy
+      direction: $direction
+      filterDomain: $filterDomain
+      filterFollowStatus: $filterFollowStatus
+      filterSuspendStatus: $filterSuspendStatus
+    ) {
+      total
+      elements {
+        ...InstanceFragment
+      }
+    }
+  }
+  ${INSTANCE_FRAGMENT}
+`;
+export const ADD_INSTANCE = gql`
+  mutation addInstance($domain: String!) {
+    addInstance(domain: $domain) {
+      ...InstanceFragment
+    }
+  }
+  ${INSTANCE_FRAGMENT}
 `;

 export const REMOVE_RELAY = gql`
@ -190,3 +243,26 @@ export const SAVE_ADMIN_SETTINGS = gql`
  }
  ${ADMIN_SETTINGS_FRAGMENT}
 `;
+
+export const ADMIN_UPDATE_USER = gql`
+  mutation AdminUpdateUser(
+    $id: ID!
+    $email: String
+    $role: UserRole
+    $confirmed: Boolean
+    $notify: Boolean
+  ) {
+    adminUpdateUser(
+      id: $id
+      email: $email
+      role: $role
+      confirmed: $confirmed
+      notify: $notify
+    ) {
+      id
+      email
+      role
+      confirmedAt
+    }
+  }
+`;
--- a/js/src/graphql/config.ts
+++ b/js/src/graphql/config.ts
@ -11,6 +11,10 @@ export const CONFIG = gql`
      demoMode
      countryCode
      languages
+      eventCategories {
+        id
+        label
+      }
      anonymous {
        participation {
          allowed
@ -67,7 +71,6 @@ export const CONFIG = gql`
      features {
        groups
        eventCreation
-        koenaConnect
      }
      restrictions {
        onlyAdminCanCreateGroups
@ -92,6 +95,15 @@ export const CONFIG = gql`
        enabled
        publicKey
      }
+      analytics {
+        id
+        enabled
+        configuration {
+          key
+          value
+          type
+        }
+      }
    }
  }
 `;
@ -103,6 +115,10 @@ export const CONFIG_EDIT_EVENT = gql`
      features {
        groups
      }
+      eventCategories {
+        id
+        label
+      }
      anonymous {
        participation {
          allowed
--- a/js/src/graphql/event.ts
+++ b/js/src/graphql/event.ts
@ -23,6 +23,7 @@ const FULL_EVENT_FRAGMENT = gql`
    joinOptions
    draft
    language
+    category
    picture {
      id
      url
@ -61,6 +62,7 @@ const FULL_EVENT_FRAGMENT = gql`
      uuid
      title
      beginsOn
+      status
      language
      picture {
        id
@ -202,11 +204,11 @@ export const CREATE_EVENT = gql`
    $picture: MediaInput
    $onlineAddress: String
    $phoneAddress: String
-    $category: String
+    $category: EventCategory
    $physicalAddress: AddressInput
    $options: EventOptionsInput
    $contacts: [Contact]
-    $metadata: EventMetadataInput
+    $metadata: [EventMetadataInput]
  ) {
    createEvent(
      organizerActorId: $organizerActorId
@ -252,11 +254,11 @@ export const EDIT_EVENT = gql`
    $phoneAddress: String
    $organizerActorId: ID
    $attributedToId: ID
-    $category: String
+    $category: EventCategory
    $physicalAddress: AddressInput
    $options: EventOptionsInput
    $contacts: [Contact]
-    $metadata: EventMetadataInput
+    $metadata: [EventMetadataInput]
  ) {
    updateEvent(
      eventId: $id
@ -438,6 +440,7 @@ export const FETCH_GROUP_EVENTS = gql`
          uuid
          title
          beginsOn
+          status
          draft
          options {
            ...EventOptions
--- a/js/src/graphql/group.ts
+++ b/js/src/graphql/group.ts
@ -42,6 +42,7 @@ export const LIST_GROUPS = gql`
            id
            uuid
            title
+            status
            beginsOn
          }
          total
@ -104,6 +105,7 @@ export const GROUP_FIELDS_FRAGMENTS = gql`
        uuid
        title
        beginsOn
+        status
        draft
        language
        options {
@ -224,6 +226,15 @@ export const FETCH_GROUP = gql`
  ${RESOURCE_METADATA_BASIC_FIELDS_FRAGMENT}
 `;

+export const FETCH_GROUP_BY_ID = gql`
+  query FetchGroupById($id: ID!) {
+    groupById(id: $name) {
+      ...GroupFullFields
+    }
+  }
+  ${GROUP_FIELDS_FRAGMENTS}
+`;
+
 export const GET_GROUP = gql`
  query GetGroup(
    $id: ID!
--- a/js/src/graphql/home.ts
+++ b/js/src/graphql/home.ts
@ -36,6 +36,7 @@ export const HOME_USER_QUERIES = gql`
              alt
            }
            beginsOn
+            status
            visibility
            language
            organizerActor {
@ -77,6 +78,7 @@ export const HOME_USER_QUERIES = gql`
            uuid
            title
            beginsOn
+            status
            picture {
              url
            }
@ -127,6 +129,7 @@ export const CLOSE_CONTENT = gql`
        title
        uuid
        beginsOn
+        status
        picture {
          id
          url
--- a/js/src/graphql/member.ts
+++ b/js/src/graphql/member.ts
@ -44,10 +44,16 @@ export const REJECT_INVITATION = gql`
 `;

 export const GROUP_MEMBERS = gql`
-  query ($name: String!, $roles: String, $page: Int, $limit: Int) {
-    group(preferredUsername: $name) {
+  query (
+    $groupName: String!
+    $name: String
+    $roles: String
+    $page: Int
+    $limit: Int
+  ) {
+    group(preferredUsername: $groupName) {
      ...ActorFragment
-      members(page: $page, limit: $limit, roles: $roles) {
+      members(name: $name, page: $page, limit: $limit, roles: $roles) {
        elements {
          id
          role
--- a/js/src/graphql/participant.ts
+++ b/js/src/graphql/participant.ts
@ -32,6 +32,7 @@ export const LOGGED_USER_PARTICIPATIONS = gql`
              alt
            }
            beginsOn
+            status
            visibility
            organizerActor {
              ...ActorFragment
@ -98,6 +99,7 @@ export const LOGGED_USER_UPCOMING_EVENTS = gql`
              alt
            }
            beginsOn
+            status
            visibility
            organizerActor {
              ...ActorFragment
@ -144,6 +146,7 @@ export const LOGGED_USER_UPCOMING_EVENTS = gql`
            uuid
            title
            beginsOn
+            status
            picture {
              url
            }
--- a/js/src/graphql/post.ts
+++ b/js/src/graphql/post.ts
@ -98,7 +98,7 @@ export const FETCH_POST = gql`
 export const CREATE_POST = gql`
  mutation CreatePost(
    $title: String!
-    $body: String
+    $body: String!
    $attributedToId: ID!
    $visibility: PostVisibility
    $draft: Boolean
--- a/js/src/graphql/report.ts
+++ b/js/src/graphql/report.ts
@ -2,8 +2,13 @@ import gql from "graphql-tag";
 import { ACTOR_FRAGMENT } from "./actor";

 export const REPORTS = gql`
-  query Reports($status: ReportStatus, $page: Int, $limit: Int) {
-    reports(status: $status, page: $page, limit: $limit) {
+  query Reports(
+    $status: ReportStatus
+    $domain: String
+    $page: Int
+    $limit: Int
+  ) {
+    reports(status: $status, domain: $domain, page: $page, limit: $limit) {
      total
      elements {
        id
--- a/Show More
+++ b/Show More