highlight current element
This commit is contained in:
parent
149e9fe144
commit
74aec668ab
@ -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 (
|
||||
<div
|
||||
@ -30,10 +37,10 @@ const HistoryWidget = ({ widget }: HistoryWidgetProps) => {
|
||||
return (
|
||||
<HistoryMessageElement
|
||||
index={convoMessages.length - index}
|
||||
isActive={true}
|
||||
isActive={highlightIndex === convoMessages.length - 1 - index}
|
||||
title={`ACA-${message.data.detectedByAca}`}
|
||||
header="Request to attack"
|
||||
desc = {`Approval for ${message.data.attackWeapon.type} attack`}
|
||||
desc={`Approval for ${message.data.attackWeapon.type} attack`}
|
||||
tableContent={
|
||||
<TableElement
|
||||
element={{
|
||||
@ -70,7 +77,6 @@ const HistoryWidget = ({ widget }: HistoryWidgetProps) => {
|
||||
return;
|
||||
}
|
||||
})}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@ -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]);
|
||||
|
||||
|
@ -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<string>) => {
|
||||
state.activeConvoID = action.payload;
|
||||
console.log(action.payload);
|
||||
}
|
||||
},
|
||||
|
||||
setSelectedElementID : (state, action : PayloadAction<string>) => {
|
||||
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;
|
||||
|
Loading…
Reference in New Issue
Block a user