Sidebar improvement

[sumansaurabh]

Description

• This PR introduces significant enhancements to the documentation and analysis features of the application.
• New pages for repository analysis, documentation generation, and security insights have been added.
• Various API endpoints have been updated for better functionality and performance.
• Improvements to user feedback mechanisms in modals and components have been implemented.

---

Changes walkthrough 📝

	Relevant files
Enhancement	docgen.api.ts Update API Endpoints for Documentation Generation                src/api/docgen.api.ts Updated API endpoints for documentation generation and status. Changed HTTP methods from POST to GET where appropriate. +5/-6      git.api.ts Refactor Git API Metadata Types                                                    src/api/git.api.ts Introduced GitAppAdvancedMetaData type for enhanced metadata handling. Refactored existing types to accommodate new structure. +12/-9    OutdatedDocsModal.tsx Improve Outdated Documentation Modal                                          src/components/dashboard/DashboardHeader/OutdatedDocsModal.tsx Improved handling of outdated documentation display. Enhanced link handling with hover effects for accessibility. +75/-27  RepoNav.tsx Add Repository Navigation Component                                            src/components/layouts/main/sider/SiderMenu/RepoNav.tsx Added repository navigation component for better UX. Integrated vendor-specific navigation links. +90/-0    AnalyzePage.tsx Introduce Repository Analysis Page                                              src/pages/DashboardPages/DocGenDashboardPage/RepoPages/AnalyzePage.tsx Created a new AnalyzePage for repository analysis. Implemented metrics display for code quality and documentation coverage. +115/-0  DocufyPage.tsx Create Documentation Generation Page                                          src/pages/DashboardPages/DocGenDashboardPage/RepoPages/DocufyPage.tsx Developed DocufyPage for documentation generation tools. Added functionality for generating and syncing documentation. +160/-0  SecurityPage.tsx Add Security Insights Page                                                              src/pages/DashboardPages/DocGenDashboardPage/RepoPages/SecurityPage.tsx Implemented SecurityPage for vulnerability analysis. Added mock data for security vulnerabilities and display logic. +252/-0
Bug fix	AzurePATModal.tsx Enhance Azure PAT Modal Validation                                              src/components/dashboard/AzurePATModal/AzurePATModal.tsx Improved PAT validation response handling. Updated notification messages for better user feedback. +11/-6

---

💡 Penify usage:
Comment /help on the PR to get a list of all available Penify tools and their descriptions

[penify-dev]

PR Review 🔍

⏱️ Estimated effort to review [1-5]	4, because this PR introduces significant changes across multiple files, including new components and updates to existing logic, which may require careful consideration and testing.
🧪 Relevant tests	No
⚡ Possible issues	Possible Bug: The change in API endpoints from POST to GET could lead to issues if the backend is not updated accordingly. Ensure that the backend supports these changes.
	Possible Bug: The handling of the isPrivate prop in the ArchConfigModal may not cover all edge cases, particularly in how it affects the hostDocumentation default value.
🔒 Security concerns	No

[penify-dev]

PR Code Suggestions ✨

Category	Suggestion	Score
Possible bug	Add error handling for the documentation generation trigger to enhance user experience Ensure that the triggerDocGen function handles potential errors gracefully, especially when the API call fails, to improve user experience. src/components/dashboard/DashboardHeader/RepoMetricsCards.tsx [224] -const response = await triggerDocGen(orgName, repoName, vendor, analysisType || ''); +try { + const response = await triggerDocGen(orgName, repoName, vendor, analysisType || ''); +} catch (error) { + console.error('Error triggering documentation generation:', error); + addTerminalMessage(`Failed to trigger analysis: ${error.message}`, MessageType.ERROR); +} Suggestion importance[1-10]: 9 Why: Adding error handling for the API call enhances user experience by providing feedback in case of failures, which is crucial for usability.	9
	Add validation for the severity property to prevent runtime errors Ensure that the severity property is validated before being passed to the getSeverityProps function to avoid potential runtime errors if the severity is not one of the expected values. src/pages/DashboardPages/DocGenDashboardPage/RepoPages/SecurityPage.tsx [187] -const severityProps = getSeverityProps(item.severity); +const severityProps = getSeverityProps(item.severity || 'unknown'); Suggestion importance[1-10]: 7 Why: While adding a default value for severity can prevent runtime errors, it may mask underlying issues with data integrity. A more robust validation approach would be ideal.	7
	Add a check for undefined to prevent runtime errors Ensure that gitData.gitAppAdvancedMeta is defined before accessing analysisReport to avoid potential runtime errors. src/components/dashboard/DashboardTerminal/CustomTerminal.tsx [398] -if(gitData.gitAppAdvancedMeta && gitData.gitAppAdvancedMeta.analysisReport) { +if(gitData.gitAppAdvancedMeta && gitData.gitAppAdvancedMeta.analysisReport !== undefined) { Suggestion importance[1-10]: 7 Why: The suggestion correctly identifies a potential runtime error by checking for undefined, but the original code already checks for the existence of gitData.gitAppAdvancedMeta, making the additional check for undefined somewhat redundant.	7
Possible issue	Provide a fallback for timestamp initialization to prevent undefined behavior Ensure that the timestamp variable is always initialized to avoid potential undefined behavior. src/components/dashboard/DashboardTerminal/CustomTerminal.tsx [467] -const timestamp = parseTimestamp(parts[1]); // Parse the timestamp from the second part +const timestamp = parts[1] ? parseTimestamp(parts[1]) : new Date(); // Fallback to current date Suggestion importance[1-10]: 9 Why: The suggestion effectively addresses a potential issue with undefined behavior by providing a fallback for the timestamp variable, which is crucial for maintaining code stability.	9
	Add validation for organization and repository names to prevent rendering issues Ensure that orgName and repoName are properly validated before being used in the UI to avoid potential rendering issues if they are undefined or null. src/pages/DashboardPages/DocGenDashboardPage/RepoPages/AnalyzePage.tsx [24] -Repository Analysis: {orgName}/{repoName} +Repository Analysis: {orgName || 'Unknown Organization'}/{repoName || 'Unknown Repository'} Suggestion importance[1-10]: 8 Why: Adding validation for orgName and repoName prevents potential rendering issues and improves the robustness of the UI.	8
Enhancement	Add a confirmation dialog for the "Fix Issue" button to prevent accidental actions The Button for "Fix Issue" should ideally have a confirmation dialog before proceeding to fix the issue to prevent accidental clicks. src/pages/DashboardPages/DocGenDashboardPage/RepoPages/SecurityPage.tsx [194] -<Button key="fix" type="primary" ghost>Fix Issue</Button> +<Button key="fix" type="primary" ghost onClick={() => confirmFixIssue(vulnerability.id)}>Fix Issue</Button> Suggestion importance[1-10]: 8 Why: Adding a confirmation dialog is a significant improvement for user experience and safety, preventing unintended actions that could lead to data loss or errors.	8
	Implement a loading state during the documentation generation trigger to improve user feedback Consider using a loading state while waiting for the triggerDocGen response to enhance user feedback during the operation. src/components/dashboard/DashboardHeader/RepoMetricsCards.tsx [224] +setLoading(true); const response = await triggerDocGen(orgName, repoName, vendor, analysisType || ''); +setLoading(false); Suggestion importance[1-10]: 8 Why: Implementing a loading state improves user feedback during asynchronous operations, making the application feel more responsive and user-friendly.	8
	Improve error logging for better debugging Use a more specific error message when logging JSON parsing errors to aid debugging. src/components/dashboard/DashboardTerminal/CustomTerminal.tsx [503] -console.error('Error parsing JSON:', error); +console.error('Error parsing JSON content:', content, error); Suggestion importance[1-10]: 8 Why: This suggestion improves the error logging by providing more context, which is beneficial for debugging. It addresses a minor issue that could lead to confusion during error analysis.	8
Performance	Add a condition to check the current value before calling setFieldsValue Ensure that the setFieldsValue method is called only when necessary to avoid unnecessary re-renders. src/components/dashboard/DashboardTerminal/ArchConfigModal.tsx [325] -setFieldsValue({ hostDocumentation: false }); +if (getFieldValue('hostDocumentation')) { + setFieldsValue({ hostDocumentation: false }); +} Suggestion importance[1-10]: 8 Why: Adding a condition to check the current value before calling setFieldsValue is a good practice to enhance performance and avoid unnecessary re-renders.	8
Maintainability	Remove debugging console logs to clean up the production code Remove the console logs used for debugging to keep the production code clean and avoid potential performance issues. src/components/dashboard/DashboardHeader/RepoMetricsCards.tsx [149] -console.log('RepoMetricsCards mounted with repoDetails:', repoDetails.organizationName); +// console.log('RepoMetricsCards mounted with repoDetails:', repoDetails.organizationName); Suggestion importance[1-10]: 7 Why: Removing debugging console logs is a good practice for maintainability and performance, especially in production code.	7
	Improve variable naming for better code readability Consider using a more descriptive variable name than item in the renderItem function to improve code readability. src/pages/DashboardPages/DocGenDashboardPage/RepoPages/SecurityPage.tsx [186] -renderItem={item => { +renderItem={vulnerability => { Suggestion importance[1-10]: 6 Why: Using a more descriptive variable name like vulnerability enhances readability, making the code easier to understand at a glance.	6
	Rename a variable to enhance code clarity Consider using a more descriptive variable name than content to improve code readability. src/components/dashboard/DashboardTerminal/CustomTerminal.tsx [468] -let contentList = parts.slice(2).join('::').split('\n'); +let messageContentList = parts.slice(2).join('::').split('\n'); Suggestion importance[1-10]: 6 Why: The suggestion is valid as it promotes better readability, but the impact is minor since content is a common term in this context. Renaming it to messageContentList could enhance clarity.	6
	Extract the tooltip title logic into a separate function for better maintainability Consider extracting the tooltip content into a separate function to enhance maintainability and readability. src/components/dashboard/DashboardTerminal/ArchConfigModal.tsx [336-342] -<Tooltip title={ - isPrivate ? - "Hosting is disabled for Private Repositories" : - generateHtml ? - "Host the generated documentation HTML on our servers for easy access" : - "HTML format must be selected to enable online hosting" -}> +<Tooltip title={getTooltipTitle(isPrivate, generateHtml)}> Suggestion importance[1-10]: 6 Why: Extracting the tooltip title logic into a separate function can improve maintainability, but it may not be crucial for readability in this context.	6
	Refactor the rendering of severity tags for better maintainability Use a more structured approach to handle the rendering of severity tags to avoid repetition and improve maintainability. src/pages/DashboardPages/DocGenDashboardPage/RepoPages/SecurityPage.tsx [220] -<Tag color={severityProps.color}>{item.severity}</Tag> +<Tag color={getSeverityProps(item.severity).color}>{item.severity}</Tag> Suggestion importance[1-10]: 5 Why: While refactoring the rendering of severity tags can improve maintainability, the suggested change does not significantly reduce complexity or repetition in the code.	5
	Change the optional isPrivate prop to a required prop with a default value Ensure that the isPrivate prop is validated to prevent potential issues if it is not provided, as it defaults to false. src/components/dashboard/DashboardTerminal/ArchConfigModal.tsx [98] -isPrivate?: boolean; +isPrivate: boolean = false; Suggestion importance[1-10]: 4 Why: Changing isPrivate from an optional to a required prop with a default value may not be necessary, as the current implementation handles it well with a default of false.	4
Readability	Rename the rest variable to otherValues for better clarity Consider using a more descriptive variable name instead of rest in the handleFinish function to improve code readability. src/components/dashboard/DashboardTerminal/ArchConfigModal.tsx [153] -const { commitToGit, branch, path, ...rest } = values; +const { commitToGit, branch, path, ...otherValues } = values; Suggestion importance[1-10]: 7 Why: Renaming rest to otherValues improves clarity, making the code more readable and understandable.	7