import React from "react";
import {List} from "antd";
import Icon from "@ant-design/icons";
import {FaArrowRight} from "react-icons/fa";

export default function AuditTrailValuesComponent({oldV, newV}) {
    if (!oldV && !newV) return <div></div>;

    if (!oldV && newV)
        return (
            <List style={{width: "800px"}} bordered size='small'>
                {Object.keys(newV).map((key, idx) => (
                    <List.Item key={idx} value={key}>
                        {key}: {JSON.stringify(newV[key])}
                    </List.Item>
                ))}
            </List>
        );

    return (
        <List style={{width: "800px"}} bordered size='small'>
            {Object.keys(oldV).map((key, idx) => (
                <List.Item key={idx}>
                    {key}: {oldV[key]} <Icon component={FaArrowRight}/>
                    {JSON.stringify(newV[key])}
                </List.Item>
            ))}
        </List>
    );
}