feat: ACA dots at the top now will turn orange when an aca fuel low, aca defect, or aca heading to base message is fired.
This commit is contained in:
parent
c539c3b11e
commit
35a0c4781a
@ -1,6 +1,8 @@
|
||||
import { type AcaStatusElement as AcaStatusElementType } from 'src/types/element';
|
||||
import WEAPON_ICON_1 from 'src/assets/icons/weapon1.svg';
|
||||
import WEAPON_ICON_2 from 'src/assets/icons/weapon2.svg';
|
||||
import { getMessages } from 'src/redux/slices/conversationSlice';
|
||||
import { useAppSelector } from 'src/redux/hooks';
|
||||
|
||||
type PropsType = {
|
||||
element: AcaStatusElementType;
|
||||
@ -10,6 +12,32 @@ const AcaStatusElement = ({ element }: PropsType) => {
|
||||
const { id, acaId, fuelLevel, h, w, weaponLoad1, weaponLoad2, isDead } =
|
||||
element;
|
||||
|
||||
// let border = false;
|
||||
|
||||
const messages = useAppSelector(getMessages);
|
||||
// console.log(messages);
|
||||
|
||||
const getAcaDotStatus = () => {
|
||||
|
||||
const latestMessage = messages[messages.length-1];
|
||||
// && (latestMessage.kind == 'AcaDefect' || latestMessage.kind == 'AcaFuelLow')
|
||||
|
||||
/*@ts-ignore*/
|
||||
if(latestMessage?.tags?.includes(`aca-${acaId}`) && (latestMessage.kind == 'AcaDefect' || latestMessage.kind == 'AcaFuelLow' || latestMessage.kind == 'AcaHeadingToBase')){
|
||||
return {color: 'bg-[#FCA700]', border: 'border-0'};
|
||||
}
|
||||
else{
|
||||
return {color: 'bg-[#323235]', border:'border-2'};
|
||||
}
|
||||
}
|
||||
|
||||
const {color, border} = getAcaDotStatus();
|
||||
console.log(`Applied classes: color=${color}, border=${border}`);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div
|
||||
id={id}
|
||||
@ -35,7 +63,7 @@ const AcaStatusElement = ({ element }: PropsType) => {
|
||||
</svg>
|
||||
|
||||
<div>
|
||||
<div className="inline-block w-4 h-4 rounded-full bg-transparent border-2 border-[#f5f5f5] mr-2"></div>
|
||||
<div className={`inline-block w-4 h-4 rounded-full ${border} ${color} mr-2`}></div>
|
||||
<span className="text-[#f5f5f5] text-[20px]">ACA-{acaId}</span>
|
||||
</div>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user