From e03b020397bddf35b2e2e7f521799916a99ded64 Mon Sep 17 00:00:00 2001
From: Szymon Szlachtowicz <38212223+Szymx95@users.noreply.github.com>
Date: Wed, 5 Jan 2022 13:51:12 +0100
Subject: [PATCH] Load community key from env (#175)
---
.gitignore | 1 +
packages/react-chat-example/package.json | 2 +-
packages/react-chat-example/src/index.tsx | 7 +--
packages/react-chat-example/webpack.config.js | 7 ++-
.../react-chat/src/components/ChatLoader.tsx | 8 +--
.../react-chat/src/components/ReactChat.tsx | 50 +++++++++----------
.../src/contexts/configProvider.tsx | 24 +++++++++
.../src/contexts/messengerProvider.tsx | 8 +--
.../src/hooks/messenger/useMessenger.ts | 6 ++-
packages/react-chat/src/index.ts | 4 +-
.../react-chat/src/utils/createMessenger.ts | 35 +++++++++----
packages/status-communities/src/groupChats.ts | 1 +
12 files changed, 94 insertions(+), 59 deletions(-)
create mode 100644 packages/react-chat/src/contexts/configProvider.tsx
diff --git a/.gitignore b/.gitignore
index 89cc6ae..bdee3fa 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,6 +2,7 @@ dist
node_modules
yarn-error.log
.DS_Store
+.env
build
cache
diff --git a/packages/react-chat-example/package.json b/packages/react-chat-example/package.json
index c263dec..dd02099 100644
--- a/packages/react-chat-example/package.json
+++ b/packages/react-chat-example/package.json
@@ -9,7 +9,7 @@
"clean:all": "yarn clean && rimraf node_modules/",
"clean": "rimraf dist/",
"build": "rm -rf dist && webpack --mode=production --env ENV=production",
- "start": "webpack serve --mode=development --env ENV=development --https",
+ "start": "webpack serve --mode=development --env ENV=$ENV COMMUNITY_KEY=$COMMUNITY_KEY --https",
"fix": "run-s 'fix:*'",
"fix:prettier": "prettier './{src,test}/**/*.{ts,tsx}' \"./*.json\" --write",
"fix:lint": "eslint './{src,test}/**/*.{ts,tsx}' --fix",
diff --git a/packages/react-chat-example/src/index.tsx b/packages/react-chat-example/src/index.tsx
index 96885d2..e9a2e04 100644
--- a/packages/react-chat-example/src/index.tsx
+++ b/packages/react-chat-example/src/index.tsx
@@ -75,9 +75,10 @@ function DragDiv() {
diff --git a/packages/react-chat-example/webpack.config.js b/packages/react-chat-example/webpack.config.js
index fb7902d..e4a4585 100644
--- a/packages/react-chat-example/webpack.config.js
+++ b/packages/react-chat-example/webpack.config.js
@@ -5,10 +5,8 @@ const webpack = require('webpack');
const { ESBuildMinifyPlugin } = require('esbuild-loader');
module.exports = env => {
- let environment = 'development';
- if (env.ENV) {
- environment = env.ENV;
- }
+ const environment = env.ENV || 'development';
+ const communityKey = env.COMMUNITY_KEY || '';
return {
entry: './src/index.tsx',
@@ -71,6 +69,7 @@ module.exports = env => {
}),
new webpack.DefinePlugin({
'process.env.ENV': JSON.stringify(environment),
+ 'process.env.COMMUNITY_KEY': JSON.stringify(communityKey),
}),
new webpack.ProvidePlugin({
process: 'process/browser.js',
diff --git a/packages/react-chat/src/components/ChatLoader.tsx b/packages/react-chat/src/components/ChatLoader.tsx
index 54d1f8e..135cdb4 100644
--- a/packages/react-chat/src/components/ChatLoader.tsx
+++ b/packages/react-chat/src/components/ChatLoader.tsx
@@ -11,17 +11,13 @@ import {
import { Chat } from "./Chat";
import { IdentityLoader } from "./Form/IdentityLoader";
-interface ChatLoaderProps {
- communityKey: string;
-}
-
-export function ChatLoader({ communityKey }: ChatLoaderProps) {
+export function ChatLoader() {
const [userCreationState] = useUserCreationState();
if (userCreationState === UserCreationState.NotCreating)
return (
-
+
diff --git a/packages/react-chat/src/components/ReactChat.tsx b/packages/react-chat/src/components/ReactChat.tsx
index 5c84a5b..2cac6e0 100644
--- a/packages/react-chat/src/components/ReactChat.tsx
+++ b/packages/react-chat/src/components/ReactChat.tsx
@@ -2,7 +2,9 @@ import React, { useRef } from "react";
import { ThemeProvider } from "styled-components";
import styled from "styled-components";
+import { ConfigType } from "..";
import { ActivityProvider } from "../contexts/activityProvider";
+import { ConfigProvider } from "../contexts/configProvider";
import { FetchMetadataProvider } from "../contexts/fetchMetadataProvider";
import { ModalProvider } from "../contexts/modalProvider";
import { NarrowProvider } from "../contexts/narrowProvider";
@@ -16,36 +18,34 @@ import { ChatLoader } from "./ChatLoader";
interface ReactChatProps {
theme: Theme;
- communityKey: string;
+ config: ConfigType;
fetchMetadata?: (url: string) => Promise;
}
-export function ReactChat({
- theme,
- communityKey,
- fetchMetadata,
-}: ReactChatProps) {
+export function ReactChat({ theme, config, fetchMetadata }: ReactChatProps) {
const ref = useRef(null);
return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
}
diff --git a/packages/react-chat/src/contexts/configProvider.tsx b/packages/react-chat/src/contexts/configProvider.tsx
new file mode 100644
index 0000000..22debb5
--- /dev/null
+++ b/packages/react-chat/src/contexts/configProvider.tsx
@@ -0,0 +1,24 @@
+import React, { createContext, useContext } from "react";
+
+export type ConfigType = {
+ communityKey: string;
+ environment: string;
+};
+
+const ConfigContext = createContext({
+ communityKey: "",
+ environment: "production",
+});
+
+export function useConfig() {
+ return useContext(ConfigContext);
+}
+
+type ConfigProviderProps = {
+ children: React.ReactNode;
+ config: ConfigType;
+};
+
+export function ConfigProvider({ children, config }: ConfigProviderProps) {
+ return ;
+}
diff --git a/packages/react-chat/src/contexts/messengerProvider.tsx b/packages/react-chat/src/contexts/messengerProvider.tsx
index 57c946e..ba2cd79 100644
--- a/packages/react-chat/src/contexts/messengerProvider.tsx
+++ b/packages/react-chat/src/contexts/messengerProvider.tsx
@@ -37,15 +37,11 @@ export function useMessengerContext() {
interface MessengerProviderProps {
children: React.ReactNode;
- communityKey?: string;
}
-export function MessengerProvider({
- children,
- communityKey,
-}: MessengerProviderProps) {
+export function MessengerProvider({ children }: MessengerProviderProps) {
const identity = useIdentity();
const nickname = useNickname();
- const messenger = useMessenger(communityKey, identity, nickname);
+ const messenger = useMessenger(identity, nickname);
return ;
}
diff --git a/packages/react-chat/src/hooks/messenger/useMessenger.ts b/packages/react-chat/src/hooks/messenger/useMessenger.ts
index 59a9712..d17ffd6 100644
--- a/packages/react-chat/src/hooks/messenger/useMessenger.ts
+++ b/packages/react-chat/src/hooks/messenger/useMessenger.ts
@@ -8,6 +8,7 @@ import {
Messenger,
} from "status-communities/dist/cjs";
+import { useConfig } from "../../contexts/configProvider";
import { ChannelData, ChannelsData } from "../../models/ChannelData";
import { ChatMessage } from "../../models/ChatMessage";
import { CommunityData } from "../../models/CommunityData";
@@ -49,9 +50,10 @@ export type MessengerType = {
};
function useCreateMessenger(identity: Identity | undefined) {
+ const { environment } = useConfig();
const [messenger, setMessenger] = useState(undefined);
useEffect(() => {
- createMessenger(identity).then((e) => {
+ createMessenger(identity, environment).then((e) => {
setMessenger(e);
});
}, [identity]);
@@ -98,10 +100,10 @@ function useCreateCommunity(
}
export function useMessenger(
- communityKey: string | undefined,
identity: Identity | undefined,
nickname: string | undefined
) {
+ const { communityKey } = useConfig();
const [activeChannel, setActiveChannel] = useState({
id: "",
name: "",
diff --git a/packages/react-chat/src/index.ts b/packages/react-chat/src/index.ts
index f576df0..eed412a 100644
--- a/packages/react-chat/src/index.ts
+++ b/packages/react-chat/src/index.ts
@@ -1,4 +1,4 @@
import { ReactChat } from "./components/ReactChat";
+import { ConfigType } from "./contexts/configProvider";
import { darkTheme, lightTheme } from "./styles/themes";
-
-export { ReactChat, lightTheme, darkTheme };
+export { ReactChat, lightTheme, darkTheme, ConfigType };
diff --git a/packages/react-chat/src/utils/createMessenger.ts b/packages/react-chat/src/utils/createMessenger.ts
index ebdfd7e..a4c87fe 100644
--- a/packages/react-chat/src/utils/createMessenger.ts
+++ b/packages/react-chat/src/utils/createMessenger.ts
@@ -1,18 +1,33 @@
-import { StoreCodec } from "js-waku";
+import { getBootstrapNodes, StoreCodec } from "js-waku";
import { Identity, Messenger } from "status-communities/dist/cjs";
-const WAKU_OPTIONS = {
- libp2p: {
- config: {
- pubsub: {
- enabled: true,
- emitSelf: true,
+function createWakuOptions(env: string) {
+ let bootstrap: any = true;
+ if (env === "test") {
+ bootstrap = getBootstrapNodes.bind({}, [
+ "fleets",
+ "wakuv2.test",
+ "waku-websocket",
+ ]);
+ }
+ return {
+ bootstrap,
+ libp2p: {
+ config: {
+ pubsub: {
+ enabled: true,
+ emitSelf: true,
+ },
},
},
- },
-};
+ };
+}
-export async function createMessenger(identity: Identity | undefined) {
+export async function createMessenger(
+ identity: Identity | undefined,
+ env: string
+) {
+ const WAKU_OPTIONS = createWakuOptions(env);
const messenger = await Messenger.create(identity, WAKU_OPTIONS);
await new Promise((resolve) => {
messenger.waku.libp2p.peerStore.on("change:protocols", ({ protocols }) => {
diff --git a/packages/status-communities/src/groupChats.ts b/packages/status-communities/src/groupChats.ts
index 24bfa19..f54d415 100644
--- a/packages/status-communities/src/groupChats.ts
+++ b/packages/status-communities/src/groupChats.ts
@@ -436,6 +436,7 @@ export class GroupChats {
await this.waku.store.queryHistory([member.topic], {
timeFilter: { startTime, endTime },
callback: (msg) => _callback(msg, member.id),
+ decryptionKeys: [member.symKey],
})
).length;
amountOfMessages.push(msgLength);