Add ChevronRightIcon component and update FilterInput to use it
All checks were successful
farmcontrol/farmcontrol-ui/pipeline/head This commit looks good

- Introduced a new ChevronRightIcon component using SVG for better visual representation.
- Replaced the ArrowLeftIcon with ChevronRightIcon in the FilterInput component to enhance the operand display.
- Added the corresponding SVG file for the ChevronRightIcon to the assets/icons directory.
This commit is contained in:
Tom Butcher 2026-08-11 02:10:34 +01:00
parent b85089604f
commit 93bd485ae3
3 changed files with 18 additions and 2 deletions

View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g transform="matrix(1.001515,0,0,1.001515,1,3.331628)">
<path d="M32.953,57.25C34.312,57.25 35.438,56.766 36.406,55.828L60.047,32.719C61.312,31.438 61.906,30.172 61.906,28.625C61.891,27.047 61.297,25.766 60.047,24.531L36.406,1.422C35.438,0.469 34.328,0 32.953,0C30.172,0 27.906,2.234 27.906,4.984C27.906,6.328 28.484,7.609 29.531,8.641L51.438,29.859L51.438,27.312L29.531,48.609C28.5,49.625 27.906,50.906 27.906,52.281C27.906,55.016 30.172,57.25 32.953,57.25Z" style="fill-rule:nonzero;"/>
<path d="M5.016,57.25C6.375,57.25 7.5,56.766 8.484,55.828L32.125,32.719C33.406,31.438 33.984,30.172 33.984,28.625C33.953,27.047 33.391,25.766 32.125,24.531L8.469,1.422C7.531,0.469 6.391,0 5.016,0C2.234,0 0,2.234 0,4.984C0,6.328 0.562,7.609 1.594,8.641L23.516,29.859L23.516,27.312L1.594,48.609C0.578,49.625 0,50.906 0,52.281C0,55.016 2.234,57.25 5.016,57.25Z" style="fill-rule:nonzero;"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -18,7 +18,7 @@ import useStyle, { useSharedStyle } from 'antd/es/input/style'
import { useThemeContext } from '../context/ThemeContext' import { useThemeContext } from '../context/ThemeContext'
import SimplePropertyFilter from './SimplePropertyFilter' import SimplePropertyFilter from './SimplePropertyFilter'
import ScrollBox from './ScrollBox' import ScrollBox from './ScrollBox'
import ArrowLeftIcon from '../../Icons/ArrowLeftIcon' import ChevronRightIcon from '../../Icons/ChevronRightIcon'
import GreaterThanIcon from '../../Icons/GreaterThanIcon' import GreaterThanIcon from '../../Icons/GreaterThanIcon'
import GreaterThanOrEqualToIcon from '../../Icons/GreaterThanOrEqualToIcon' import GreaterThanOrEqualToIcon from '../../Icons/GreaterThanOrEqualToIcon'
import LessThanIcon from '../../Icons/LessThanIcon' import LessThanIcon from '../../Icons/LessThanIcon'
@ -35,7 +35,7 @@ const WILDCARDS = new Set(['*', '?'])
const OPERANDS = [ const OPERANDS = [
{ {
symbol: '..', symbol: '..',
label: <ArrowLeftIcon style={operandIconStyle} />, label: <ChevronRightIcon style={{ ...operandIconStyle, fontSize: 11 }} />,
color: 'purple' color: 'purple'
}, },
{ {

View File

@ -0,0 +1,8 @@
import Icon from '@ant-design/icons'
import CustomIconSvg from '../../../assets/icons/chevronrighticon.svg?react'
const ChevronRightIcon = (props) => (
<Icon component={CustomIconSvg} {...props} />
)
export default ChevronRightIcon