[WEB-5459] feat(codemods): add function declaration transformer with tests (#8137)

- Add jscodeshift-based codemod to convert arrow function components to function declarations
- Support React.FC, observer-wrapped, and forwardRef components
- Include comprehensive test suite covering edge cases
- Add npm script to run transformer across codebase
- Target only .tsx files in source directories, excluding node_modules and declaration files

* [WEB-5459] chore: updates after running codemod

---------

Co-authored-by: sriramveeraghanta <veeraghanta.sriram@gmail.com>

apps/web/core/components/api-token/delete-token-modal.tsx

@@ -23,7 +23,7 @@ type Props = {
 
 const apiTokenService = new APITokenService();
 
-export const DeleteApiTokenModal: FC<Props> = (props) => {
+export function DeleteApiTokenModal(props: Props) {
   const { isOpen, onClose, tokenId } = props;
   // states
   const [deleteLoading, setDeleteLoading] = useState<boolean>(false);
@@ -90,4 +90,4 @@ export const DeleteApiTokenModal: FC<Props> = (props) => {
       content={<>{t("workspace_settings.settings.api_tokens.delete.description")} </>}
     />
   );
-};
+}

apps/web/core/components/api-token/empty-state.tsx

@@ -10,7 +10,7 @@ type Props = {
   onClick: () => void;
 };
 
-export const ApiTokenEmptyState: React.FC<Props> = (props) => {
+export function ApiTokenEmptyState(props: Props) {
   const { onClick } = props;
 
   return (
@@ -29,4 +29,4 @@ export const ApiTokenEmptyState: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}

apps/web/core/components/api-token/modal/create-token-modal.tsx

@@ -25,7 +25,7 @@ type Props = {
 // services
 const apiTokenService = new APITokenService();
 
-export const CreateApiTokenModal: React.FC<Props> = (props) => {
+export function CreateApiTokenModal(props: Props) {
   const { isOpen, onClose } = props;
   // states
   const [neverExpires, setNeverExpires] = useState<boolean>(false);
@@ -104,4 +104,4 @@ export const CreateApiTokenModal: React.FC<Props> = (props) => {
       )}
     </ModalCore>
   );
-};
+}

apps/web/core/components/api-token/modal/form.tsx

@@ -66,7 +66,7 @@ const getFormattedDate = (date: Date): Date => {
   return add(date, { hours, minutes, seconds });
 };
 
-export const CreateApiTokenForm: React.FC<Props> = (props) => {
+export function CreateApiTokenForm(props: Props) {
   const { handleClose, neverExpires, toggleNeverExpires, onSubmit } = props;
   // states
   const [customDate, setCustomDate] = useState<Date | null>(null);
@@ -253,4 +253,4 @@ export const CreateApiTokenForm: React.FC<Props> = (props) => {
       </div>
     </form>
   );
-};
+}

apps/web/core/components/api-token/modal/generated-token-details.tsx

@@ -18,7 +18,7 @@ type Props = {
   tokenDetails: IApiToken;
 };
 
-export const GeneratedTokenDetails: React.FC<Props> = (props) => {
+export function GeneratedTokenDetails(props: Props) {
   const { handleClose, tokenDetails } = props;
   const { isMobile } = usePlatformOS();
   const { t } = useTranslation();
@@ -60,4 +60,4 @@ export const GeneratedTokenDetails: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}

apps/web/core/components/api-token/token-list-item.tsx

@@ -16,7 +16,7 @@ type Props = {
   token: IApiToken;
 };
 
-export const ApiTokenListItem: React.FC<Props> = (props) => {
+export function ApiTokenListItem(props: Props) {
   const { token } = props;
   // states
   const [deleteModalOpen, setDeleteModalOpen] = useState(false);
@@ -61,4 +61,4 @@ export const ApiTokenListItem: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}