refactor: Revue de la modale permettant de créer un dossier

d'inscription

Front-End/src/components/InputTextWithColorIcon.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { Palette } from 'lucide-react';
+
+const InputTextWithColorIcon = ({ name, textValue, colorValue, onTextChange, onColorChange, placeholder, errorMsg }) => {
+  return (
+    <div className="flex items-center space-x-2">
+      <input
+        type="text"
+        name={name}
+        value={textValue}
+        onChange={onTextChange}
+        placeholder={placeholder}
+        className={`flex-1 px-2 py-1 border ${errorMsg ? 'border-red-500' : 'border-gray-300'} rounded-md`}
+      />
+      <div className="relative flex items-center space-x-2">
+        <input
+          type="color"
+          name={`${name}_color`}
+          value={colorValue}
+          onChange={onColorChange}
+          className="absolute inset-0 w-full h-full opacity-0 cursor-pointer"
+        />
+        <Palette className="w-6 h-6 text-gray-500" />
+        <div
+          className="w-6 h-6 rounded-full border border-gray-300"
+          style={{ backgroundColor: colorValue }}
+        ></div>
+      </div>
+      {errorMsg && <p className="mt-2 text-sm text-red-600">{errorMsg}</p>}
+    </div>
+  );
+};
+
+export default InputTextWithColorIcon;