From 0419ef5c4a3da5dc7dda137a1f9b60f3b9c32082 Mon Sep 17 00:00:00 2001
From: Matthew Russell <mattrussell36@gmail.com>
Date: Fri, 24 Feb 2023 14:58:50 -0800
Subject: [PATCH] chore: use input error in date range filter now circ dep is
 fixed

---
 .../components/data-grid/filters/date-range-filter.tsx | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/libs/ui-toolkit/src/components/data-grid/filters/date-range-filter.tsx b/libs/ui-toolkit/src/components/data-grid/filters/date-range-filter.tsx
index 3f038d56a..2c3004d23 100644
--- a/libs/ui-toolkit/src/components/data-grid/filters/date-range-filter.tsx
+++ b/libs/ui-toolkit/src/components/data-grid/filters/date-range-filter.tsx
@@ -14,6 +14,7 @@ import {
   isValid,
 } from 'date-fns';
 import { t, formatForInput } from '@vegaprotocol/utils';
+import { InputError } from '../../input-error';
 
 const defaultFilterValue: Schema.DateRange = {};
 export interface DateRangeFilterProps extends IFilterParams {
@@ -194,14 +195,7 @@ export const DateRangeFilter = forwardRef(
     }, [value, props]);
 
     const notification = useMemo(() => {
-      const not = error ? (
-        <div
-          className="text-sm flex items-center first-letter:uppercase mt-2 border-danger text-danger"
-          role="alert"
-        >
-          {error}
-        </div>
-      ) : null;
+      const not = error ? <InputError>{error}</InputError> : null;
       return (
         <div className="ag-filter-apply-panel flex min-h-[2rem]">{not}</div>
       );