chore: Refactoring all import directories to alias and all .js|.jsx renamed to be .ts|.tsx

src/containers/Preferences/Users/Roles/RolesForm/RoleFormObserver.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { useFormikContext } from 'formik';
+import { FormikObserver } from '@/components';
+
+/**
+ * Role form observer.
+ * @returns {React.JSX}
+ */
+export function RoleFormObserver() {
+  const { values } = useFormikContext();
+
+  // Handles the form change.
+  const handleFormChange = () => {};
+
+  return <FormikObserver onChange={handleFormChange} values={values} />;
+}