Hey is a decentralized and permissionless social media app built with Lens Protocol 🌿
🧹 refactor: Remove FC type annotations from functional components for cleaner code: v6 (#rm-fc)
Summary: Removed `FC` type annotations from functional components for cleaner code.
Highlights:
• `CountdownTimer`, `Cover`, and `CoverUpload` components no longer use `FC` type.
• `DismissRecommendedAccount`, `FallbackAccountName`, and `FeedFocusType` components updated similarly.
• Other components like `Loader`, `LoginButton`, and `MenuTransition` also had `FC` type removed.
Read more: https://pierre.co/yo/hey/rm-fc
authored by
Pierre
dce8348a
341eaf06
+130
-196
+1
-2
apps/web/src/components/Post/Type/Commented.tsx
+1
-2
apps/web/src/components/Post/Type/Commented.tsx
···
1
1
import type { PostFragment } from "@hey/indexer";
2
-
import type { FC } from "react";
3
2
import ThreadBody from "../ThreadBody";
4
3
5
4
interface CommentedProps {
6
5
commentOn: PostFragment;
7
6
}
8
7
9
-
const Commented: FC<CommentedProps> = ({ commentOn }) => {
8
+
const Commented = ({ commentOn }: CommentedProps) => {
10
9
return <ThreadBody post={commentOn} />;
11
10
};
12
11
+1
-2
apps/web/src/components/Post/Type/Reposted.tsx
+1
-2
apps/web/src/components/Post/Type/Reposted.tsx
···
1
1
import Accounts from "@components/Shared/Accounts";
2
2
import { ArrowsRightLeftIcon } from "@heroicons/react/24/outline";
3
3
import type { AccountFragment } from "@hey/indexer";
4
-
import type { FC } from "react";
5
4
6
5
interface RepostedProps {
7
6
account: AccountFragment;
8
7
}
9
8
10
-
const Reposted: FC<RepostedProps> = ({ account }) => {
9
+
const Reposted = ({ account }: RepostedProps) => {
11
10
return (
12
11
<div className="ld-text-gray-500 mb-3 flex items-center space-x-1 text-[13px]">
13
12
<ArrowsRightLeftIcon className="size-4" />
+1
-6
apps/web/src/components/Post/Type/index.tsx
+1
-6
apps/web/src/components/Post/Type/index.tsx
···
1
1
import stopEventPropagation from "@hey/helpers/stopEventPropagation";
2
2
import type { AnyPostFragment } from "@hey/indexer";
3
3
import { useRouter } from "next/router";
4
-
import type { FC } from "react";
5
4
import Commented from "./Commented";
6
5
import Reposted from "./Reposted";
7
6
···
11
10
showType: boolean;
12
11
}
13
12
14
-
const PostType: FC<PostTypeProps> = ({
15
-
post,
16
-
showThread = false,
17
-
showType
18
-
}) => {
13
+
const PostType = ({ post, showThread = false, showType }: PostTypeProps) => {
19
14
const { pathname } = useRouter();
20
15
const type = post.__typename;
21
16
+1
-2
apps/web/src/components/Search/Accounts.tsx
+1
-2
apps/web/src/components/Search/Accounts.tsx
···
3
3
import { UsersIcon } from "@heroicons/react/24/outline";
4
4
import { type AccountsRequest, PageSize, useAccountsQuery } from "@hey/indexer";
5
5
import { Card, EmptyState, ErrorMessage } from "@hey/ui";
6
-
import type { FC } from "react";
7
6
import { Virtuoso } from "react-virtuoso";
8
7
9
8
interface AccountsProps {
10
9
query: string;
11
10
}
12
11
13
-
const Accounts: FC<AccountsProps> = ({ query }) => {
12
+
const Accounts = ({ query }: AccountsProps) => {
14
13
const request: AccountsRequest = {
15
14
pageSize: PageSize.Fifty,
16
15
filter: { searchBy: { localNameQuery: query } }
+1
-2
apps/web/src/components/Search/Posts.tsx
+1
-2
apps/web/src/components/Search/Posts.tsx
···
3
3
import { ChatBubbleBottomCenterIcon } from "@heroicons/react/24/outline";
4
4
import { PageSize, type PostsRequest, usePostsQuery } from "@hey/indexer";
5
5
import { Card, EmptyState, ErrorMessage } from "@hey/ui";
6
-
import type { FC } from "react";
7
6
import { useRef } from "react";
8
7
import type { StateSnapshot, VirtuosoHandle } from "react-virtuoso";
9
8
import { Virtuoso } from "react-virtuoso";
···
14
13
query: string;
15
14
}
16
15
17
-
const Posts: FC<PostsProps> = ({ query }) => {
16
+
const Posts = ({ query }: PostsProps) => {
18
17
const virtuoso = useRef<VirtuosoHandle>(null);
19
18
20
19
const request: PostsRequest = {
+2
-2
apps/web/src/components/Settings/Funds/Unwrap.tsx
+2
-2
apps/web/src/components/Settings/Funds/Unwrap.tsx
···
4
4
import { Events } from "@hey/data/events";
5
5
import { useUnwrapTokensMutation } from "@hey/indexer";
6
6
import { Button, Input, Modal } from "@hey/ui";
7
-
import { type FC, useState } from "react";
7
+
import { useState } from "react";
8
8
import toast from "react-hot-toast";
9
9
import usePollTransactionStatus from "src/hooks/usePollTransactionStatus";
10
10
import useTransactionLifecycle from "src/hooks/useTransactionLifecycle";
···
14
14
refetch: () => void;
15
15
}
16
16
17
-
const Unwrap: FC<UnwrapProps> = ({ value, refetch }) => {
17
+
const Unwrap = ({ value, refetch }: UnwrapProps) => {
18
18
const [isSubmitting, setIsSubmitting] = useState(false);
19
19
const [showModal, setShowModal] = useState(false);
20
20
const [valueToUnwrap, setValueToUnwrap] = useState(value);
+2
-2
apps/web/src/components/Settings/Funds/Withdraw.tsx
+2
-2
apps/web/src/components/Settings/Funds/Withdraw.tsx
···
3
3
import { Events } from "@hey/data/events";
4
4
import { useWithdrawMutation } from "@hey/indexer";
5
5
import { Button, Input, Modal } from "@hey/ui";
6
-
import { type FC, useState } from "react";
6
+
import { useState } from "react";
7
7
import toast from "react-hot-toast";
8
8
import usePollTransactionStatus from "src/hooks/usePollTransactionStatus";
9
9
import useTransactionLifecycle from "src/hooks/useTransactionLifecycle";
···
15
15
refetch: () => void;
16
16
}
17
17
18
-
const Withdraw: FC<WithdrawProps> = ({ currency, value, refetch }) => {
18
+
const Withdraw = ({ currency, value, refetch }: WithdrawProps) => {
19
19
const [isSubmitting, setIsSubmitting] = useState(false);
20
20
const [showModal, setShowModal] = useState(false);
21
21
const [valueToWithdraw, setValueToWithdraw] = useState(value);
+2
-2
apps/web/src/components/Settings/Funds/Wrap.tsx
+2
-2
apps/web/src/components/Settings/Funds/Wrap.tsx
···
4
4
import { Events } from "@hey/data/events";
5
5
import { useWrapTokensMutation } from "@hey/indexer";
6
6
import { Button, Input, Modal } from "@hey/ui";
7
-
import { type FC, useState } from "react";
7
+
import { useState } from "react";
8
8
import toast from "react-hot-toast";
9
9
import usePollTransactionStatus from "src/hooks/usePollTransactionStatus";
10
10
import useTransactionLifecycle from "src/hooks/useTransactionLifecycle";
···
14
14
refetch: () => void;
15
15
}
16
16
17
-
const Wrap: FC<WrapProps> = ({ value, refetch }) => {
17
+
const Wrap = ({ value, refetch }: WrapProps) => {
18
18
const [isSubmitting, setIsSubmitting] = useState(false);
19
19
const [showModal, setShowModal] = useState(false);
20
20
const [valueToWrap, setValueToWrap] = useState(value);
+3
-3
apps/web/src/components/Settings/Manager/AccountManager/AddAccountManager.tsx
+3
-3
apps/web/src/components/Settings/Manager/AccountManager/AddAccountManager.tsx
···
6
6
import { Events } from "@hey/data/events";
7
7
import { useAddAccountManagerMutation } from "@hey/indexer";
8
8
import { Button } from "@hey/ui";
9
-
import type { Dispatch, FC, SetStateAction } from "react";
9
+
import type { Dispatch, SetStateAction } from "react";
10
10
import { useState } from "react";
11
11
import toast from "react-hot-toast";
12
12
import useTransactionLifecycle from "src/hooks/useTransactionLifecycle";
···
18
18
setShowAddManagerModal: Dispatch<SetStateAction<boolean>>;
19
19
}
20
20
21
-
const AddAccountManager: FC<AddAccountManagerProps> = ({
21
+
const AddAccountManager = ({
22
22
setShowAddManagerModal
23
-
}) => {
23
+
}: AddAccountManagerProps) => {
24
24
const { currentAccount } = useAccountStore();
25
25
const { isSuspended } = useAccountStatus();
26
26
const [manager, setManager] = useState("");
+1
-2
apps/web/src/components/Settings/Manager/AccountManager/Management/List.tsx
+1
-2
apps/web/src/components/Settings/Manager/AccountManager/Management/List.tsx
···
11
11
useUnhideManagedAccountMutation
12
12
} from "@hey/indexer";
13
13
import { Button, EmptyState, ErrorMessage } from "@hey/ui";
14
-
import type { FC } from "react";
15
14
import { useEffect } from "react";
16
15
import toast from "react-hot-toast";
17
16
import { Virtuoso } from "react-virtuoso";
···
21
20
managed?: boolean;
22
21
}
23
22
24
-
const List: FC<ListProps> = ({ managed = false }) => {
23
+
const List = ({ managed = false }: ListProps) => {
25
24
const { address } = useAccount();
26
25
27
26
const lastLoggedInAccountRequest: LastLoggedInAccountRequest = { address };