Add identity provider (#117)

This commit is contained in:
Szymon Szlachtowicz 2021-11-05 16:31:35 +01:00 committed by GitHub
parent 84624011f5
commit 23d3ee01ea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 33 additions and 35 deletions

View File

@ -1,5 +1,4 @@
import React, { useMemo, useState } from "react"; import React, { useMemo, useState } from "react";
import { Identity } from "status-communities/dist/cjs";
import styled from "styled-components"; import styled from "styled-components";
import { useMessengerContext } from "../contexts/messengerProvider"; import { useMessengerContext } from "../contexts/messengerProvider";
@ -15,11 +14,7 @@ import { CommunityModal } from "./Modals/CommunityModal";
import { EditModal } from "./Modals/EditModal"; import { EditModal } from "./Modals/EditModal";
import { CommunitySkeleton } from "./Skeleton/CommunitySkeleton"; import { CommunitySkeleton } from "./Skeleton/CommunitySkeleton";
interface ChatProps { export function Chat() {
identity: Identity;
}
export function Chat({ identity }: ChatProps) {
const [showMembers, setShowMembers] = useState(true); const [showMembers, setShowMembers] = useState(true);
const [showChannels, setShowChannels] = useState(true); const [showChannels, setShowChannels] = useState(true);
const [membersList, setMembersList] = useState([]); const [membersList, setMembersList] = useState([]);
@ -72,7 +67,6 @@ export function Chat({ identity }: ChatProps) {
{!createChat && ( {!createChat && (
<ChatBody <ChatBody
identity={identity}
onClick={() => setShowMembers(!showMembers)} onClick={() => setShowMembers(!showMembers)}
showMembers={showMembers} showMembers={showMembers}
community={communityData} community={communityData}
@ -88,14 +82,12 @@ export function Chat({ identity }: ChatProps) {
)} )}
{showMembers && !narrow && !createChat && ( {showMembers && !narrow && !createChat && (
<Members <Members
identity={identity}
setShowChannels={setShowChannels} setShowChannels={setShowChannels}
setMembersList={setMembersList} setMembersList={setMembersList}
/> />
)} )}
{createChat && communityData && ( {createChat && communityData && (
<ChatCreation <ChatCreation
identity={identity}
community={communityData} community={communityData}
setMembersList={setMembersList} setMembersList={setMembersList}
setGroupList={setGroupList} setGroupList={setGroupList}

View File

@ -1,5 +1,4 @@
import React, { useCallback, useEffect, useMemo, useState } from "react"; import React, { useCallback, useEffect, useMemo, useState } from "react";
import { Identity } from "status-communities/dist/cjs";
import styled from "styled-components"; import styled from "styled-components";
import { useMessengerContext } from "../../contexts/messengerProvider"; import { useMessengerContext } from "../../contexts/messengerProvider";
@ -21,7 +20,6 @@ import { ChatInput } from "./ChatInput";
import { ChatMessages } from "./ChatMessages"; import { ChatMessages } from "./ChatMessages";
interface ChatBodyProps { interface ChatBodyProps {
identity: Identity;
community: CommunityData | undefined; community: CommunityData | undefined;
onClick: () => void; onClick: () => void;
showMembers: boolean; showMembers: boolean;
@ -36,7 +34,6 @@ interface ChatBodyProps {
} }
export function ChatBody({ export function ChatBody({
identity,
community, community,
onClick, onClick,
showMembers, showMembers,
@ -78,7 +75,6 @@ export function ChatBody({
<ChatBodyWrapper className={className}> <ChatBodyWrapper className={className}>
{editGroup && community ? ( {editGroup && community ? (
<ChatCreation <ChatCreation
identity={identity}
community={community} community={community}
setMembersList={setMembersList} setMembersList={setMembersList}
setGroupList={setGroupList} setGroupList={setGroupList}
@ -170,7 +166,6 @@ export function ChatBody({
)} )}
{showMembersList && narrow && ( {showMembersList && narrow && (
<NarrowMembers <NarrowMembers
identity={identity}
community={community} community={community}
setShowChannels={setShowChannelsList} setShowChannels={setShowChannelsList}
setShowMembersList={setShowMembersList} setShowMembersList={setShowMembersList}

View File

@ -1,8 +1,8 @@
import React, { useState } from "react"; import React, { useState } from "react";
import { Identity } from "status-communities/dist/cjs";
import { bufToHex } from "status-communities/dist/cjs/utils"; import { bufToHex } from "status-communities/dist/cjs/utils";
import styled from "styled-components"; import styled from "styled-components";
import { useIdentity } from "../../contexts/identityProvider";
import { useMessengerContext } from "../../contexts/messengerProvider"; import { useMessengerContext } from "../../contexts/messengerProvider";
import { CommunityData } from "../../models/CommunityData"; import { CommunityData } from "../../models/CommunityData";
import { buttonStyles } from "../Buttons/buttonStyle"; import { buttonStyles } from "../Buttons/buttonStyle";
@ -11,7 +11,6 @@ import { Member } from "../Members/Member";
import { SearchBlock } from "../SearchBlock"; import { SearchBlock } from "../SearchBlock";
import { textMediumStyles } from "../Text"; import { textMediumStyles } from "../Text";
interface ChatCreationProps { interface ChatCreationProps {
identity: Identity;
community: CommunityData; community: CommunityData;
setMembersList: any; setMembersList: any;
setGroupList: any; setGroupList: any;
@ -20,13 +19,13 @@ interface ChatCreationProps {
} }
export function ChatCreation({ export function ChatCreation({
identity,
community, community,
setMembersList, setMembersList,
setGroupList, setGroupList,
setCreateChat, setCreateChat,
editGroup, editGroup,
}: ChatCreationProps) { }: ChatCreationProps) {
const identity = useIdentity();
const [query, setQuery] = useState(""); const [query, setQuery] = useState("");
const [styledGroup, setStyledGroup] = useState<string[]>([]); const [styledGroup, setStyledGroup] = useState<string[]>([]);

View File

@ -1,6 +1,7 @@
import React, { useState } from "react"; import React, { useState } from "react";
import { Identity } from "status-communities/dist/cjs"; import { Identity } from "status-communities/dist/cjs";
import { IdentityProvider } from "../contexts/identityProvider";
import { MessengerProvider } from "../contexts/messengerProvider"; import { MessengerProvider } from "../contexts/messengerProvider";
import { Chat } from "./Chat"; import { Chat } from "./Chat";
@ -15,9 +16,11 @@ export function ChatLoader({ communityKey }: ChatLoaderProps) {
if (identity) { if (identity) {
return ( return (
<IdentityProvider identity={identity}>
<MessengerProvider identity={identity} communityKey={communityKey}> <MessengerProvider identity={identity} communityKey={communityKey}>
<Chat identity={identity} /> <Chat />
</MessengerProvider> </MessengerProvider>
</IdentityProvider>
); );
} else { } else {
return <IdentityLoader setIdentity={setIdentity} />; return <IdentityLoader setIdentity={setIdentity} />;

View File

@ -1,25 +1,18 @@
import React from "react"; import React from "react";
import { Identity } from "status-communities/dist/cjs";
import styled from "styled-components"; import styled from "styled-components";
import { MembersList } from "./MembersList"; import { MembersList } from "./MembersList";
interface MembersProps { interface MembersProps {
identity: Identity;
setShowChannels: (val: boolean) => void; setShowChannels: (val: boolean) => void;
setMembersList: any; setMembersList: any;
} }
export function Members({ export function Members({ setShowChannels, setMembersList }: MembersProps) {
identity,
setShowChannels,
setMembersList,
}: MembersProps) {
return ( return (
<MembersWrapper> <MembersWrapper>
<MemberHeading>Members</MemberHeading> <MemberHeading>Members</MemberHeading>
<MembersList <MembersList
identity={identity}
setShowChannels={setShowChannels} setShowChannels={setShowChannels}
setMembersList={setMembersList} setMembersList={setMembersList}
/> />

View File

@ -1,27 +1,27 @@
import React from "react"; import React from "react";
import { Identity, utils } from "status-communities/dist/cjs"; import { utils } from "status-communities/dist/cjs";
import { bufToHex } from "status-communities/dist/cjs/utils"; import { bufToHex } from "status-communities/dist/cjs/utils";
import styled from "styled-components"; import styled from "styled-components";
import { useIdentity } from "../../contexts/identityProvider";
import { useMessengerContext } from "../../contexts/messengerProvider"; import { useMessengerContext } from "../../contexts/messengerProvider";
import { UserIcon } from "../Icons/UserIcon"; import { UserIcon } from "../Icons/UserIcon";
import { Member, MemberData, MemberIcon } from "./Member"; import { Member, MemberData, MemberIcon } from "./Member";
interface MembersListProps { interface MembersListProps {
identity: Identity;
setShowChannels: (val: boolean) => void; setShowChannels: (val: boolean) => void;
setShowMembers?: (val: boolean) => void; setShowMembers?: (val: boolean) => void;
setMembersList: any; setMembersList: any;
} }
export function MembersList({ export function MembersList({
identity,
setShowChannels, setShowChannels,
setShowMembers, setShowMembers,
setMembersList, setMembersList,
}: MembersListProps) { }: MembersListProps) {
const { contacts } = useMessengerContext(); const { contacts } = useMessengerContext();
const identity = useIdentity();
return ( return (
<MembersListWrap> <MembersListWrap>

View File

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import { Identity } from "status-communities/dist/cjs";
import styled from "styled-components"; import styled from "styled-components";
import { CommunityData } from "../../models/CommunityData"; import { CommunityData } from "../../models/CommunityData";
@ -8,7 +7,6 @@ import { MembersList } from "../Members/MembersList";
import { NarrowTopbar } from "./NarrowTopbar"; import { NarrowTopbar } from "./NarrowTopbar";
interface NarrowMembersProps { interface NarrowMembersProps {
identity: Identity;
community: CommunityData; community: CommunityData;
setShowChannels: (val: boolean) => void; setShowChannels: (val: boolean) => void;
setShowMembersList: (val: boolean) => void; setShowMembersList: (val: boolean) => void;
@ -16,7 +14,6 @@ interface NarrowMembersProps {
} }
export function NarrowMembers({ export function NarrowMembers({
identity,
community, community,
setShowChannels, setShowChannels,
setShowMembersList, setShowMembersList,
@ -26,7 +23,6 @@ export function NarrowMembers({
<ListWrapper> <ListWrapper>
<NarrowTopbar list="Community members" community={community.name} /> <NarrowTopbar list="Community members" community={community.name} />
<MembersList <MembersList
identity={identity}
setShowChannels={setShowChannels} setShowChannels={setShowChannels}
setShowMembers={setShowMembersList} setShowMembers={setShowMembersList}
setMembersList={setMembersList} setMembersList={setMembersList}

View File

@ -0,0 +1,20 @@
import React, { createContext, useContext } from "react";
import { Identity } from "status-communities/dist/cjs";
const IdentityContext = createContext(new Identity(new Uint8Array()));
export function useIdentity() {
return useContext(IdentityContext);
}
interface IdentityProviderProps {
children: React.ReactNode;
identity: Identity;
}
export function IdentityProvider({
children,
identity,
}: IdentityProviderProps) {
return <IdentityContext.Provider value={identity} children={children} />;
}