refactor: revert useId changes in filter components

Author: afonsojramos

src/components/filters/ReasonFilter.tsx

@@ -1,4 +1,4 @@
-import { type FC, useId } from 'react';
+import type { FC } from 'react';
 
 import { NoteIcon } from '@primer/octicons-react';
 import { Text } from '@primer/react';
@@ -7,14 +7,12 @@ import { reasonFilter } from '../../utils/notifications/filters';
 import { FilterSection } from './FilterSection';
 
 export const ReasonFilter: FC = () => {
-  const id = useId();
-
   return (
     <FilterSection
       filter={reasonFilter}
       filterSetting="filterReasons"
       icon={NoteIcon}
-      id={id}
+      id="filter-reasons"
       title="Reason"
       tooltip={<Text>Filter notifications by reason.</Text>}
     />

src/components/filters/StateFilter.tsx

@@ -1,4 +1,4 @@
-import { type FC, useId } from 'react';
+import type { FC } from 'react';
 
 import { IssueOpenedIcon } from '@primer/octicons-react';
 import { Text } from '@primer/react';
@@ -7,14 +7,12 @@ import { stateFilter } from '../../utils/notifications/filters';
 import { FilterSection } from './FilterSection';
 
 export const StateFilter: FC = () => {
-  const id = useId();
-
   return (
     <FilterSection
       filter={stateFilter}
       filterSetting="filterStates"
       icon={IssueOpenedIcon}
-      id={id}
+      id="filter-state"
       title="State"
       tooltip={<Text>Filter notifications by state.</Text>}
     />

src/components/filters/SubjectTypeFilter.tsx

@@ -1,4 +1,4 @@
-import { type FC, useId } from 'react';
+import type { FC } from 'react';
 
 import { BellIcon } from '@primer/octicons-react';
 import { Text } from '@primer/react';
@@ -7,14 +7,12 @@ import { subjectTypeFilter } from '../../utils/notifications/filters';
 import { FilterSection } from './FilterSection';
 
 export const SubjectTypeFilter: FC = () => {
-  const id = useId();
-
   return (
     <FilterSection
       filter={subjectTypeFilter}
       filterSetting="filterSubjectTypes"
       icon={BellIcon}
-      id={id}
+      id="filter-subject-type"
       title="Type"
       tooltip={<Text>Filter notifications by type.</Text>}
     />

src/components/filters/UserTypeFilter.tsx

@@ -1,4 +1,4 @@
-import { type FC, useId } from 'react';
+import type { FC } from 'react';
 
 import {
   DependabotIcon,
@@ -13,14 +13,12 @@ import { userTypeFilter } from '../../utils/notifications/filters';
 import { FilterSection } from './FilterSection';
 
 export const UserTypeFilter: FC = () => {
-  const id = useId();
-
   return (
     <FilterSection
       filter={userTypeFilter}
       filterSetting="filterUserTypes"
       icon={FeedPersonIcon}
-      id={id}
+      id="filter-user-types"
       layout="horizontal"
       title="User Type"
       tooltip={