diff --git a/src/client/dd-hub-react/src/_mock/_data.ts b/src/client/dd-hub-react/src/_mock/_data.ts
index 07cc88e..ef00abf 100644
--- a/src/client/dd-hub-react/src/_mock/_data.ts
+++ b/src/client/dd-hub-react/src/_mock/_data.ts
@@ -227,7 +227,7 @@ export const _products: Product[] = [
 
 export const _filters: Filter[] = [
   { id: 1, label: 'Rechnungsnummer', name: 'invoiceNumber', type: 'VARCHAR' },
-  { id: 2, label: 'Kundenname', name: 'customerName', type: 'VARCHAR' },
+  { id: 2, label: 'Kundenname', name: 'customerName', type: 'INTEGER' },
   { id: 3, label: 'Startdatum', name: 'startDate', type: 'DATE' },
   { id: 4, label: 'Enddatum', name: 'endDate', type: 'DATE' },
   { id: 5, label: 'Status der Rechnung', name: 'status', type: 'VARCHAR' },
diff --git a/src/client/dd-hub-react/src/sections/document/num-filter.tsx b/src/client/dd-hub-react/src/sections/document/num-filter.tsx
new file mode 100644
index 0000000..214967c
--- /dev/null
+++ b/src/client/dd-hub-react/src/sections/document/num-filter.tsx
@@ -0,0 +1,26 @@
+import TextField from '@mui/material/TextField';
+// ----------------------------------------------------------------------
+
+type BoolFilterProps = {
+    label: string;
+}
+
+export function IntFilter({ label }: BoolFilterProps) {
+    return (
+        <TextField
+            type="number"
+            label={label}
+            variant="standard"
+        />
+    );
+}
+
+export function DecimalFilter({ label }: BoolFilterProps) {
+    return (
+        <TextField
+            type="number"
+            label={label}
+            variant="standard"
+        />
+    );
+}
\ No newline at end of file
diff --git a/src/client/dd-hub-react/src/sections/document/view/doc-search-view.tsx b/src/client/dd-hub-react/src/sections/document/view/doc-search-view.tsx
index 0771dda..b7f9dd9 100644
--- a/src/client/dd-hub-react/src/sections/document/view/doc-search-view.tsx
+++ b/src/client/dd-hub-react/src/sections/document/view/doc-search-view.tsx
@@ -1,3 +1,4 @@
+import React from 'react';
 import { useState, useCallback, useEffect } from 'react';
 
 import Box from '@mui/material/Box';
@@ -14,6 +15,7 @@ import { Iconify } from 'src/components/iconify';
 
 import { DocItem } from '../doc-item';
 import { BoolFilter } from '../bool-filter';
+import { DecimalFilter, IntFilter } from '../num-filter';
 
 import type { IDocItem } from '../doc-item';
 // ----------------------------------------------------------------------
@@ -104,9 +106,13 @@ export function DocSearchView({ posts }: Props) {
             case 'BOOLEAN':
               filterComp = <BoolFilter label={filter.label ?? filter.name} />
               break;
-            case 'VARCHAR':
             case 'INTEGER':
+              filterComp = <IntFilter label={filter.label ?? filter.name} />
+              break;
             case 'DECIMAL':
+              filterComp = <DecimalFilter label={filter.label ?? filter.name} />
+              break;
+            case 'VARCHAR':
             case 'DATE':
             default:
               filterComp = <TextField id={`filter-${filter.id.toString()}`} label={filter.label ?? filter.type} variant="filled" />