Updated channel editor + fixes

src/components/generic/form/Input.tsx

@@ -9,10 +9,12 @@ interface InputProps extends DefaultInputProps {
   label?: string;
   error?: string;
   action?: JSX.Element;
+  prefix?: string;
+  suffix?: string;
 }
 
 export const Input = React.forwardRef<HTMLInputElement, InputProps>(
-  function Input({ label, error, action, ...props }: InputProps, ref) {
+  function Input({ label, error, action, suffix, ...props }: InputProps, ref) {
     return (
       <div className="w-full">
         {label && <Label label={label} error={error} />}
@@ -22,6 +24,11 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
             className="w-full h-10 px-3 py-2 bg-transparent focus:outline-none"
             {...props}
           />
+          {suffix && (
+            <span className="my-auto mr-3 text-sm font-medium text-gray-500 dark:text-gray-400">
+              {suffix}
+            </span>
+          )}
           {action && <div className="flex mr-1">{action}</div>}
         </InputWrapper>
       </div>