diff --git a/src/components/Widget/HistoryWidget.tsx b/src/components/Widget/HistoryWidget.tsx
index 2cbc277..1d34c1f 100644
--- a/src/components/Widget/HistoryWidget.tsx
+++ b/src/components/Widget/HistoryWidget.tsx
@@ -1,9 +1,13 @@
import { type HistoryWidget as HistoryWidgetType } from 'src/types/widget';
import TableElement from '../Element/Simple/TableElement';
import HistoryMessageElement from '../Element/Complex/HistoryMessageElement';
-import { getActiveConvoID } from 'src/redux/slices/componentSlice';
+import {
+ getActiveConvoID,
+ getSelectedElementID,
+} from 'src/redux/slices/componentSlice';
import { useAppSelector } from 'src/redux/hooks';
import { getMessages } from 'src/redux/slices/minimapSlice';
+import { useState } from 'react';
type HistoryWidgetProps = {
widget: HistoryWidgetType;
@@ -16,6 +20,9 @@ const HistoryWidget = ({ widget }: HistoryWidgetProps) => {
const convoMessages = useAppSelector(getMessages).filter(
(message) => message.conversationId === convoID,
);
+ const activeElementID = useAppSelector(getSelectedElementID);
+
+ const highlightIndex = convoMessages.findIndex((message) => message.id === activeElementID)
return (
{
return (
{
return;
}
})}
-
);
diff --git a/src/components/Widget/ListWidget.tsx b/src/components/Widget/ListWidget.tsx
index 2f63092..87beb6c 100644
--- a/src/components/Widget/ListWidget.tsx
+++ b/src/components/Widget/ListWidget.tsx
@@ -1,7 +1,7 @@
import { useEffect, useState } from 'react';
import Element from 'src/components/Element/Element';
import { useAppDispatch } from 'src/redux/hooks';
-import { setActiveConvoID } from 'src/redux/slices/componentSlice';
+import { setActiveConvoID, setSelectedElementID } from 'src/redux/slices/componentSlice';
import type { Widget } from 'src/types/widget';
type ListWidgetProps = {
@@ -26,6 +26,9 @@ const ListWidget = ({ widget }: ListWidgetProps) => {
setActiveConvoID(
sortedElementsByPriority[selectedElement].message?.conversationId ?? '',
),
+ dispatch(
+ setSelectedElementID(sortedElementsByPriority[selectedElement].message?.id)
+ )
);
}, [selectedElement]);
diff --git a/src/redux/slices/componentSlice.ts b/src/redux/slices/componentSlice.ts
index d9c9c6b..72c53d5 100644
--- a/src/redux/slices/componentSlice.ts
+++ b/src/redux/slices/componentSlice.ts
@@ -3,10 +3,12 @@ import type { PayloadAction } from '@reduxjs/toolkit';
type InitialState = {
activeConvoID : string;
+ selectedElementID : string;
};
const initialState: InitialState = {
activeConvoID : "",
+ selectedElementID : "",
};
export const componentSlice = createSlice({
@@ -16,17 +18,21 @@ export const componentSlice = createSlice({
// add state updating functions here)
setActiveConvoID : (state, action : PayloadAction) => {
state.activeConvoID = action.payload;
- console.log(action.payload);
- }
+ },
+
+ setSelectedElementID : (state, action : PayloadAction) => {
+ state.selectedElementID = action.payload;
+ },
},
selectors: {
// add selector functions here (to get state values from the store)
getActiveConvoID : (state) => state.activeConvoID,
+ getSelectedElementID : (state) => state.selectedElementID,
},
});
-export const { setActiveConvoID } =
+export const { setActiveConvoID, setSelectedElementID } =
componentSlice.actions;
-export const { getActiveConvoID } = componentSlice.selectors;
+export const { getActiveConvoID, getSelectedElementID } = componentSlice.selectors;