DappConnect SDKs to easily add decentralized communications to your dApp, powered bu Waku.
Go to file
Felicio Mununga 6fa65c8ee6
Extend Avatar (#371)
* add color hash to Avatar

* remove compoundVariants

* remove outline prop

* remove vars

* ref figma

* remove example

* add background color to Image

* extend radius variants in Image

* use union type

* add channel avatar to stories

* add channel avatar as Avatar type

* resolve typecheck errors

* add name prop

* add icon avatar as Avatar type

* add community avatar

* move fallback

* set default icon color

* add group avatar

* add wallet avatar

* join user type

* join channel type

* remove 32 text variant

* assert LockBase variant

* remove fn type guards

* fix icon import

* set icon sizes based on props

* set default variants and use render fns

* uses raidus tokens

* add outline

* remove outline

* fix overlapping background on loaded image

* fix indicator position

* fix background color
2023-04-19 12:56:20 +02:00
.changeset Use built-in PBKDF2 implementation for browsers (#295) 2022-07-19 17:45:29 +02:00
.github/workflows update ci workflow 2023-03-13 21:48:08 +01:00
.husky Add pre-commit git hooks (#229) 2022-02-24 23:27:22 +01:00
.vscode update launch.json 2022-11-28 02:58:40 +01:00
apps Automate sync of colors and icons with Figma (#378) 2023-04-14 23:27:05 +02:00
examples unify react versions 2023-03-13 22:24:39 +01:00
packages Extend Avatar (#371) 2023-04-19 12:56:20 +02:00
.editorconfig Add editorconfig 2022-02-25 14:56:28 +01:00
.eslintignore Merge branch 'next' into 'main' 2023-04-06 15:33:18 +02:00
.eslintrc update eslint config 2023-01-18 17:48:51 +01:00
.gitignore Merge branch 'next' into 'main' 2023-04-06 15:33:18 +02:00
.prettierrc Improve Prettier monorepo configuration (#225) 2022-02-23 15:49:00 +01:00
LICENSE-APACHE-v2 First commit 2021-09-03 17:58:45 +10:00
LICENSE-MIT First commit 2021-09-03 17:58:45 +10:00
README.md use yarn in readme 2022-11-17 18:44:25 +01:00
eas.json Add blur and IconButton variants (#340) 2023-02-10 17:25:13 +01:00
package.json Automate sync of colors and icons with Figma (#378) 2023-04-14 23:27:05 +02:00
tsconfig.base.json Automate sync of colors and icons with Figma (#378) 2023-04-14 23:27:05 +02:00
turbo.json Setup GitHub Actions (#287) 2022-06-29 16:46:51 +02:00
yarn.lock Fix `yarn.lock` (#382) 2023-04-19 11:26:40 +02:00

README.md

Status Web 🌐

CI

About

Embeddable, customizable and themable component for your Status Community.

Who

  • For community leaders
  • online content creators
  • and their followers

What

  • It is 100% open source
  • 100% decentralized
  • Peer-to-peer
  • Private
  • Pseudoanonymous
  • End-to-end encrypted
  • Free
  • Permissionless
  • Serverless
  • Group chat platform
  • And a virtual space outside the jurisdiction of any government

Why

  • To communicate and collaborate freely without worrying about
    • Censorship
    • Persecution
    • Chilling effects
    • Interference
    • Oppression
    • Being deplatformed, or shut down
  • Support
    • Autonomy
    • Free speech
    • Freedom of association
    • Freedom to transact
    • Right to privacy
    • Crypto native and frictionless integration
    • Monetization
    • Facilitation of sharing of common interests, needs, desires and values
  • Be trusted alternative to centralized group chat application

Usage

For Community owners 👥

Get public key to your pre-existing Community:

  1. Open Status Desktop
  2. Select Community
  3. Click on its overview in upper left corner
  4. Invite new people
  5. Share community
  6. Get only the public key from the URL (e.g. 0x033c88c950480493e2e759923bd38f9aad88e1b36295757a598679a569e6a96801)

Or create new one first:

  1. Get Status Desktop at https://status.im/get
  2. Go to Chat
  3. Click on plus icon
  4. Click on Communities

Use the Community component:

In your project,

Install package:

npm install @status-im/react

Import component:

import { Community } from '@status-im/react'

Set component props:

<Community
  publicKey="0x033c88c950480493e2e759923bd38f9aad88e1b36295757a598679a569e6a96801"
  theme="light"
/>

For an example, see examples/with-vite/src/app.tsx.

For User 👤

Simply visit your Community's URL from the browser:

If the Community doesn't require a joining request, that would be it. So look around and get the feel for the space.

Once ready to chat, create a throwaway profile:

Use Throwaway Profile > wait for your request to be approved and the chat input enabled > react to and write messages

Optionally, you could even run the application locally yourself.

Get the source ready:

git clone https://github.com/status-im/status-web.git
cd ./status-web
yarn install
yarn run build

Add your Community's public key to your environment:

echo 'PUBLIC_KEY="0x033c88c950480493e2e759923bd38f9aad88e1b36295757a598679a569e6a96801"' >> examples/with-vite/.env

And run it:

yarn workspace with-vite run dev