refactor: extract VersionHistoryItem component for improved readability and maintainability

app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx

@@ -99,11 +99,37 @@ const VersionHistory = () => {
                 {versionHistory.length === 0 ? (
                     <div className="no-versions-message">No saved versions</div>
                 ) : (
-                    versionHistory.map((version) => (
+                    versionHistory.map((version) => {
+                        const key = `version-${version.versionId}`;
+                        return (
+                            <VersionHistoryItem
+                                key={key}
+                                version={version}
+                                onSelect={handleSelectVersion}
+                                onRename={handleVersionNameChange}
+                            />
+                        );
+                    })
+
+                )}
+            </div>
+        </div>
+    );
+};
+
+export default VersionHistory;
+
+type VersionHistoryItemProps = {
+    version: Version;
+    onSelect: (version: Version) => void;
+    onRename: (newName: string, versionId: string) => void;
+};
+
+const VersionHistoryItem: React.FC<VersionHistoryItemProps> = ({ version, onSelect, onRename }) => {
+    return (
         <button
-                            key={version.versionId}
             className="saved-version"
-                            onClick={() => handleSelectVersion(version)}
+            onClick={() => onSelect(version)}
         >
             <div className="version-name">v {version.version}</div>
             <div className="version-details">
@@ -111,9 +137,7 @@ const VersionHistory = () => {
                     <span className="timestamp">
                         <RenameInput
                             value={version.versionName ? version.versionName : version.timeStamp}
-                                            onRename={(newName) =>
+                            onRename={(newName) => onRename(newName, version.versionId)}
-                                                handleVersionNameChange(newName, version.versionId)
-                                            }
                         />
                     </span>
                     <span className="saved-by">
@@ -124,11 +148,5 @@ const VersionHistory = () => {
                 <ArrowIcon />
             </div>
         </button>
-                    ))
-                )}
-            </div>
-        </div>
     );
 };
-
-export default VersionHistory;