React Redux 記事IDに紐づく詳細記事を表示させたい

実現したいこと

前提

Reactルーティングで簡単なページを作成しています。
App.jsx
Top.jsx
Posts.jsx(記事一覧ページ)
Post.jsx(記事詳細ページ)
Store.js(Redux)
記事一覧ページに表示している記事のIdに紐づいた記事を、動的ルーティングを使用して、記事詳細ページに表示させたいです。
記事はRedux（Store.js）で管理しています。

発生している問題・エラーメッセージ

Idの紐付け方が分かりません。

該当のソースコード

import "./reset.css" import AppStyle from "./App.module.css" import { Routes, Route, Link } from "react-router-dom"; import Top from "./components/pages/top/Top"; import Posts from "./components/pages/posts/Posts"; import Post from "./components/pages/post/Post"; function App() { return ( <div className={AppStyle.container}> <h1>React 7回目</h1> <nav className={AppStyle.nav}> <ul className={AppStyle.menu}> <li><Link to="/top">TOP</Link></li> <li><Link to="/Posts">記事一覧</Link></li> <li><Link to="/Post">記事詳細</Link></li> </ul> </nav> <Routes> <Route path="/top" element={ <Top /> }></Route> <Route path="/posts" element={ <Posts /> }></Route> <Route path=":postId" element={ <Post /> }></Route> </Routes> </div> ) } export default App

import postsStyle from "./posts.module.css" import { useSelector } from 'react-redux'; const Posts =() => { const posts = useSelector((state) => state.posts); return ( <div className={postsStyle.container}> <h2>記事一覧</h2> <div className={postsStyle.posts}> {posts.map((post) => ( <div className={postsStyle.post} key={post.postId}>{post.postName} <p className={postsStyle.post_text} key={post.postId}>{post.postDetail}</p> </div> ))} </div> </div> ) } export default Posts

import postStyle from "./post.module.css" import { useParams } from 'react-router-dom'; const Post =() => { const { postId } = useParams(); return ( <div className={postStyle.container}> <h2>記事詳細 {postId}</h2> </div> ) } export default Post

import { createStore } from 'redux' const initialState = { posts: [ { postId: '1', postName: 'サンプル記事1', postDetail: 'サンプル記事1のテキスト', }, { postId: '2', postName: 'サンプル記事2', postDetail: 'サンプル記事2のテキスト', }, { postId: '3', postName: 'サンプル記事3', postDetail: 'サンプル記事3のテキスト', }, ], }; const reducer = (state = initialState) => { return state; }; const store = createStore(reducer); console.log(store.getState()); export default store;

React勉強中です。
至らない点も多々あるかと思いますが、ご教授いただけると幸いです。
宜しくお願い致します。