diff --git a/net/web/src/App.js b/net/web/src/App.js index cb7a871e..35f5d3ce 100644 --- a/net/web/src/App.js +++ b/net/web/src/App.js @@ -1,5 +1,6 @@ import login from './login.png'; import { AppContextProvider } from './AppContext/AppContext'; +import { ConversationContextProvider } from './ConversationContext/ConversationContext'; import { Home } from './Home/Home'; import { Login } from './Login/Login'; import { Create } from './Create/Create'; @@ -26,8 +27,16 @@ function App() { }> } /> } /> - } /> - } /> + + + + } /> + + + + } /> diff --git a/net/web/src/ConversationContext/ConversationContext.js b/net/web/src/ConversationContext/ConversationContext.js new file mode 100644 index 00000000..08cde892 --- /dev/null +++ b/net/web/src/ConversationContext/ConversationContext.js @@ -0,0 +1,14 @@ +import { createContext } from 'react'; +import { useConversationContext } from './useConversationContext.hook'; + +export const ConversationContext = createContext({}); + +export function ConversationContextProvider({ children }) { + const { state, actions } = useConversationContext(); + return ( + + {children} + + ); +} + diff --git a/net/web/src/ConversationContext/useConversationContext.hook.js b/net/web/src/ConversationContext/useConversationContext.hook.js new file mode 100644 index 00000000..0a437e46 --- /dev/null +++ b/net/web/src/ConversationContext/useConversationContext.hook.js @@ -0,0 +1,20 @@ +import { useEffect, useState, useRef } from 'react'; + +export function useConversationContext() { + const [state, setState] = useState({}); + + useEffect(() => { + console.log("CREATED CONVERSATION"); + }, []); + + const updateState = (value) => { + setState((s) => ({ ...s, ...value })) + } + + const actions = { + } + + return { state, actions } +} + + diff --git a/net/web/src/User/Conversation/Conversation.jsx b/net/web/src/User/Conversation/Conversation.jsx index 372ac100..659517f2 100644 --- a/net/web/src/User/Conversation/Conversation.jsx +++ b/net/web/src/User/Conversation/Conversation.jsx @@ -1,11 +1,12 @@ import React, { useState, useEffect, useRef } from 'react' +import { ConversationContextProvider } from '../../ConversationContext/ConversationContext'; import { CloseOutlined, UserOutlined } from '@ant-design/icons'; import { useConversation } from './useConversation.hook'; import { Button, Checkbox, Modal } from 'antd' import { ConversationWrapper, CloseButton, ListItem } from './Conversation.styled'; import { AutoSizer, CellMeasurer, CellMeasurerCache, List } from 'react-virtualized'; import { AddTopic } from './AddTopic/AddTopic'; -import { VirtualList } from '../..//VirtualList/VirtualList'; +import { VirtualList } from '../../VirtualList/VirtualList'; import { TopicItem } from './TopicItem/TopicItem'; export function Conversation() { diff --git a/net/web/src/User/Conversation/TopicItem/TopicItem.jsx b/net/web/src/User/Conversation/TopicItem/TopicItem.jsx index 38c27d9d..c5cda964 100644 --- a/net/web/src/User/Conversation/TopicItem/TopicItem.jsx +++ b/net/web/src/User/Conversation/TopicItem/TopicItem.jsx @@ -1,9 +1,11 @@ import React, { useEffect, useState } from 'react'; import { TopicItemWrapper } from './TopicItem.styled'; import ReactResizeDetector from 'react-resize-detector'; +import { useTopicItem } from './useTopicItem.hook'; export function TopicItem({ topic }) { + const { state, actions } = useTopicItem(); const [ text, setText ] = useState(null); useEffect(() => { diff --git a/net/web/src/User/Conversation/TopicItem/useTopicItem.hook.js b/net/web/src/User/Conversation/TopicItem/useTopicItem.hook.js new file mode 100644 index 00000000..f4f21c95 --- /dev/null +++ b/net/web/src/User/Conversation/TopicItem/useTopicItem.hook.js @@ -0,0 +1,20 @@ +import { useContext, useState, useEffect, useRef } from 'react'; +import { AppContext } from '../../../AppContext/AppContext'; +import { ConversationContext } from '../../../ConversationContext/ConversationContext'; + +export function useTopicItem() { + + const [state, setState] = useState({}); + + const app = useContext(AppContext); + const conversation = useContext(ConversationContext); + + const updateState = (value) => { + setState((s) => ({ ...s, ...value })); + } + + const actions = { + }; + + return { state, actions }; +} diff --git a/net/web/src/User/Conversation/useConversation.hook.js b/net/web/src/User/Conversation/useConversation.hook.js index 4726bb50..91c11f71 100644 --- a/net/web/src/User/Conversation/useConversation.hook.js +++ b/net/web/src/User/Conversation/useConversation.hook.js @@ -5,6 +5,7 @@ import { getChannelTopics } from '../../Api/getChannelTopics'; import { getChannelTopic } from '../../Api/getChannelTopic'; import { getContactChannelTopics } from '../../Api/getContactChannelTopics'; import { getContactChannelTopic } from '../../Api/getContactChannelTopic'; +import { ConversationContext } from '../../ConversationContext/ConversationContext'; export function useConversation() { @@ -15,6 +16,7 @@ export function useConversation() { const { card, channel } = useParams(); const navigate = useNavigate(); const app = useContext(AppContext); + const conversation = useContext(ConversationContext); const topics = useRef(new Map()); const updateState = (value) => { diff --git a/net/web/src/VirtualList/VirtualList.jsx b/net/web/src/VirtualList/VirtualList.jsx index 053ac046..80f2eb7e 100644 --- a/net/web/src/VirtualList/VirtualList.jsx +++ b/net/web/src/VirtualList/VirtualList.jsx @@ -289,7 +289,7 @@ export function VirtualList({ items, itemRenderer }) { {({ height }) => { - if (typeof height !== 'undefined' && height > 0) { + if (typeof height !== 'undefined') { onItemHeight(container, height); } return itemRenderer(items[container.index]);