Feat/edit provider #372
Feat/edit provider #372
Conversation
WalkthroughThis pull request enhances the OAuth integration functionality across both the frontend and backend. In the frontend, the Changes
Sequence Diagram(s)sequenceDiagram
participant U as User
participant T as OAuthTab
participant F as OAuthForm
participant API as Server API (/oauth/update)
participant DB as Database
U->>T: Click "Edit" (Pencil Icon)
T->>F: Render OAuthForm (enter editing mode)
U->>F: Submit updated OAuth credentials
F->>API: Call updateOAuthForm (PUT request)
API->>DB: Validate and update OAuth provider info
DB-->>API: Return update confirmation
API-->>F: Send success response
F-->>T: Trigger onSuccess, exit editing mode
sequenceDiagram
participant S as Server (Google Ingestion)
participant Drive as Google Drive API
participant Gmail as Gmail API
participant Tracker as Stats Tracker
S->>Drive: Call countDriveFiles(oauth2Client)
S->>Gmail: Call getGmailCounts(oauth2Client)
Drive-->>S: Return totalFiles
Gmail-->>S: Return messagesExcludingPromotions
S->>Tracker: Update stats with file & message counts
Tracker-->>S: Confirm update
Possibly related PRs
Poem
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hello @SahilKumar000, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
Summary of Changes
This pull request introduces an edit button for OAuth providers, specifically for Google Drive. It allows users to update their OAuth integration settings (client ID, client secret, and scopes) after the initial setup. The changes involve modifying the OAuthTab component to include an edit button and updating the OAuthForm component to handle both creation and updating of OAuth provider settings. A new API endpoint /oauth/update is added to handle the update request.
Highlights
- Edit Functionality: Adds an edit button to the OAuthTab component, allowing users to modify existing OAuth provider settings.
- OAuth Form Update: Modifies the OAuthForm component to handle both creating and updating OAuth provider settings, based on the
isEditingprop. - API Endpoint: Introduces a new API endpoint
/oauth/updateto handle the update request for OAuth provider settings. - UI Changes: Updates the button text in the OAuthForm to reflect whether the user is creating or updating the integration.
Changelog
Click here to see the changelog
- frontend/src/components/OAuthTab.tsx
- Imported
useState,Dispatch, andSetStateActionfrom 'react'. - Imported the
Pencilicon from 'lucide-react'. - Added
isEditingstate to control the form's edit mode. - Implemented
handleEditfunction to toggle theisEditingstate and set the OAuth integration status. - Implemented
handleFormSuccessfunction to update the OAuth integration status after a successful form submission. - Added a conditional rendering block to display either the OAuthForm in edit mode or the connect button with the edit pencil icon.
- Passed
isEditingandconnectorIdprops to the OAuthForm component.
- Imported
- frontend/src/routes/_authenticated/admin/integrations/google.tsx
- Added
connectorIdto theOAuthFormDatatype. - Modified the
OAuthFormcomponent to acceptisEditingandconnectorIdprops. - Implemented the
updateOAuthFormfunction to handle the API call for updating OAuth provider settings. - Updated the form submission logic to call either
submitOAuthFormorupdateOAuthFormbased on theisEditingprop. - Updated the button text to display 'Update Integration' when editing and 'Create Integration' when creating.
- Added a useEffect hook to log the fetched stats.
- Added
- server/api/admin.ts
- Imported
UpdateOAuthProviderFormfrom '@/types'. - Imported schema and drizzle functions for database interaction.
- Implemented the
UpdateOAuthProviderfunction to handle the update request for OAuth provider settings. - Added validation and error handling for the update request.
- Updated the database with the new OAuth provider settings.
- Imported
- server/db/user.ts
- Imported
connectorsfrom './schema'. - Imported
Appsfrom '@/shared/types'.
- Imported
- server/integrations/google/index.ts
- Added logic to update total mail and drive counts after OAuth ingestion.
- server/server.ts
- Imported
updateOAuthProviderfrom '@/types'. - Imported
UpdateOAuthProviderfrom '@/api/admin'. - Added a new PUT route
/oauth/updateto handle the update request for OAuth provider settings. - Added a GET route
/oauth/.
- Imported
- server/types.ts
- Added
updateOAuthProviderschema. - Added
UpdateOAuthProviderFormtype.
- Added
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist is currently in preview and may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments to provide feedback.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
A form to edit,
Secrets and IDs to knit,
Update the OAuth,
A digital growth,
New settings, submit!
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
There was a problem hiding this comment.
Code Review
The pull request introduces the ability to edit OAuth providers, enhancing the admin interface for managing integrations. The changes include frontend components for editing OAuth configurations and backend API endpoints for updating the provider details. Overall, the code seems well-structured, but there are a few areas that could be improved for clarity and robustness.
Summary of Findings
- Missing Error Handling: The
handleEditfunction inOAuthTab.tsxdoes not handle the case whereconnectorIdis undefined or null, potentially leading to unexpected behavior. A more robust check or error message would improve the user experience. - Unnecessary useEffect: The
useEffecthook ingoogle.tsxwithin theUserStatsTablecomponent seems unnecessary as it only logs thestatsprop. This can be removed to reduce unnecessary re-renders and improve performance. - Inconsistent Naming: The naming of variables and functions could be more consistent. For example, using
isEditingand then passingisEditing?: booleancan be confusing. Standardizing the naming conventions would improve readability. - Potential Type Assertion Issue: The type assertion
connectorId as stringinOAuthTab.tsxwithin thehandleEditfunction could lead to runtime errors ifconnectorIdis actually undefined. A safer approach would involve a conditional check before the assertion.
Merge Readiness
The pull request is almost ready for merging. However, addressing the error handling in handleEdit, removing the unnecessary useEffect, ensuring consistent naming, and handling the type assertion more safely would significantly improve the code's robustness and maintainability. I am unable to approve this pull request, and recommend that others review and approve this code before merging. At a minimum, the high severity issues should be addressed before merging.
frontend/src/components/OAuthTab.tsx
Outdated
| <Pencil | ||
| className="flex justify-end cursor-pointer text-muted-foreground hover:text-gray-800" | ||
| onClick={() => { | ||
| handleEdit(connectorId as string) |
There was a problem hiding this comment.
Consider adding a check to ensure connectorId is not null or undefined before asserting it as a string. This can prevent runtime errors if connectorId is unexpectedly missing.
handleEdit(connectorId ?? "")
frontend/src/components/OAuthTab.tsx
Outdated
| const handleEdit = (connectorId: string) => { | ||
| if (!connectorId) { | ||
| setOAuthIntegrationStatus(OAuthIntegrationStatus.Provider) | ||
| setIsEditing(false) | ||
| } else { | ||
| setIsEditing(true) | ||
| } |
There was a problem hiding this comment.
The handleEdit function doesn't handle the case where connectorId is undefined or null after the if condition. Consider adding a default case or logging an error if connectorId is unexpectedly missing.
const handleEdit = (connectorId: string | undefined) => {
if (!connectorId) {
setOAuthIntegrationStatus(OAuthIntegrationStatus.Provider)
setIsEditing(false)
console.warn("Connector ID is missing."); // Add this line
} else {
setIsEditing(true)
}
}![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (3)
server/integrations/google/index.ts (1)
661-669: Verify handling of potential API failures in Promise.all.While the implementation is generally good, consider adding error handling for API call failures within the Promise.all. Currently, if any of these API calls fail, the entire function might fail, preventing other functionality from working.
Consider implementing more robust error handling:
-const [totalFiles, { messagesExcludingPromotions }] = await Promise.all([ - countDriveFiles(oauth2Client), - getGmailCounts(oauth2Client), -]); +let totalFiles = 0; +let messagesExcludingPromotions = 0; +try { + const [fileCount, gmailResults] = await Promise.all([ + countDriveFiles(oauth2Client).catch(err => { + Logger.error(err, "Failed to count Drive files"); + return 0; + }), + getGmailCounts(oauth2Client).catch(err => { + Logger.error(err, "Failed to get Gmail counts"); + return { messagesExcludingPromotions: 0 }; + }) + ]); + totalFiles = fileCount; + messagesExcludingPromotions = gmailResults.messagesExcludingPromotions; +} catch (error) { + Logger.error(error, "Failed to get file and message counts"); +}server/api/admin.ts (1)
140-140: Remove debugging console.log statement.This log statement outputs sensitive user data to the console, which could expose PII. It appears to be left over from debugging.
- console.log(userRes)frontend/src/routes/_authenticated/admin/integrations/google.tsx (1)
454-457: Remove useEffect with console.log.This appears to be debugging code that was left in the production code.
- useEffect(() => { - console.log("Fetched stats:", stats) - }, [stats]) - const totalCount: number = stats.totalDrive + stats.totalMail + const totalCount: number = stats.totalDrive + stats.totalMail
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
frontend/src/components/OAuthTab.tsx(4 hunks)frontend/src/routes/_authenticated/admin/integrations/google.tsx(6 hunks)server/api/admin.ts(4 hunks)server/db/user.ts(1 hunks)server/integrations/google/index.ts(1 hunks)server/server.ts(4 hunks)server/types.ts(2 hunks)
🧰 Additional context used
🧬 Code Definitions (4)
server/server.ts (2)
server/types.ts (1)
updateOAuthProvider(90-96)server/api/admin.ts (1)
UpdateOAuthProvider(186-221)
server/types.ts (1)
server/shared/types.ts (1)
Apps(25-25)
frontend/src/components/OAuthTab.tsx (1)
frontend/src/routes/_authenticated/admin/integrations/google.tsx (2)
OAuthForm(138-260)OAuthButton(367-391)
frontend/src/routes/_authenticated/admin/integrations/google.tsx (4)
frontend/src/api.ts (1)
api(3-3)server/shared/types.ts (1)
Apps(25-25)frontend/src/hooks/use-toast.ts (1)
toast(188-188)frontend/src/components/ui/button.tsx (1)
Button(57-57)
🔇 Additional comments (21)
server/db/user.ts (1)
14-15: New imports enhance OAuth provider editing functionality.These imports support the new OAuth provider update functionality. The
connectorsimport is used in theUpdateOAuthProviderfunction for database operations, while theAppstype is used for type validation in the OAuth provider schemas.server/server.ts (3)
25-25: Added import for OAuth provider update schema.The
updateOAuthProviderschema is correctly imported from@/typesto validate requests to the new update endpoint.
35-35: Added import for OAuth provider update handler.The
UpdateOAuthProviderhandler is correctly imported to handle the new update endpoint.
206-210: Added new endpoint for updating OAuth providers.This new PUT endpoint at
/oauth/updateuses the correct validation schema and handler for updating OAuth provider configurations.server/integrations/google/index.ts (1)
661-669: Enhanced functionality to track Drive files and Gmail counts.This improvement adds asynchronous operations to count total files in Google Drive and Gmail messages (excluding promotions). The use of
Promise.allfor parallel execution is efficient.server/types.ts (2)
90-96: Added schema for OAuth provider updates.The schema properly defines the required fields for updating an OAuth provider. This structure aligns well with the existing
createOAuthProviderschema while adding the necessaryconnectorIdfield to identify which provider to update.
108-108: Added type definition for Update OAuth Provider form.This type definition correctly infers the type from the Zod schema, maintaining type safety throughout the application.
server/api/admin.ts (2)
19-19: Added necessary imports for UpdateOAuthProvider function.The imports for
UpdateOAuthProviderFormtype,schema, and the drizzle-orm functionseqandandsupport the new functionality for updating OAuth providers.Also applies to: 38-39
186-221: Implementation of UpdateOAuthProvider function looks solid.This function handles updating an existing OAuth provider's details. It properly:
- Extracts user information from JWT payload
- Validates user exists in the database
- Validates form input
- Verifies connector exists before updating
- Updates the provider data with proper database constraints
One minor improvement suggestion for line 188:
- console.log("Full JWT Payload:", payload)This debugging statement should be removed as it logs sensitive JWT information.
frontend/src/components/OAuthTab.tsx (6)
1-3: Updated imports to support new edit functionality.Added necessary imports for React useState, Dispatch, SetStateAction, and the Pencil icon from lucide-react to support the new editing capability.
19-25: Props interface updated with proper typing.Good improvements to the TypeScript interface:
- Changed
setOAuthIntegrationStatusto use proper React state management types- Made
connectorIdoptional with the?modifier
27-32: Component parameter destructuring updated.The component now properly accepts the optional connectorId parameter.
56-59: Updated form properties to support edit mode.The OAuthForm now receives:
- The
handleFormSuccesscallback for successful submissions- The edit mode state
- The connectorId for the provider being edited
67-88: Added conditional rendering for edit mode.This implementation nicely handles:
- Showing the edit form when in edit mode
- Showing the OAuth button with an edit icon when not in edit mode
- Providing the pencil icon to trigger edit mode
The UI now supports both viewing and editing the OAuth configuration.
97-102: Improved connection status display.The connection status message is now displayed more clearly, using a paragraph element for the "Connected" status.
frontend/src/routes/_authenticated/admin/integrations/google.tsx (6)
99-124: Well-implemented updateOAuthForm function.The function appropriately:
- Makes a PUT request to the update endpoint
- Handles form data including the connectorId
- Handles authentication and error cases
- Provides detailed error information
135-135: Updated OAuthFormData type to support editing.Added optional connectorId field to the type definition, which is necessary for the update functionality.
138-142: Enhanced OAuthForm component with new props.The component now accepts additional props:
isEditing: to determine the current modeconnectorId: to identify which provider to updateThese props are properly documented with TypeScript types.
151-166: Updated form submission logic for edit mode.The onSubmit handler now:
- Checks if in editing mode
- Calls the appropriate function (update or create)
- Shows a contextual toast message based on the action
- Calls the success callback on completion
255-257: Dynamic button text based on edit mode.The submit button now displays "Update Integration" or "Create Integration" depending on whether the form is in editing mode, providing clear context to the user.
749-754: Pass connectorId to OAuthTab component.Properly fetches the connector ID from the data array based on app type and auth type, enabling the edit functionality.
server/server.ts
Outdated
| @@ -210,6 +217,7 @@ app.get( | |||
| StartOAuth, | |||
| ) | |||
|
|
|||
| app.get("/oauth/") | |||
There was a problem hiding this comment.
Added GET endpoint without handler implementation.
This GET endpoint at /oauth/ is missing a handler implementation, which could lead to runtime errors when accessed.
Either implement a handler for this endpoint or remove it if not needed. Example:
-app.get("/oauth/")
+app.get("/oauth/", async (c) => {
+ // Return a list of OAuth providers for the authenticated user
+ return c.json({ providers: await getOAuthProviders(c) })
+})Alternatively, if this was added by mistake:
-app.get("/oauth/")📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| app.get("/oauth/") | |
| app.get("/oauth/", async (c) => { | |
| // Return a list of OAuth providers for the authenticated user | |
| return c.json({ providers: await getOAuthProviders(c) }) | |
| }) |
frontend/src/components/OAuthTab.tsx
Outdated
| const [isEditing, setIsEditing] = useState(false) | ||
|
|
||
| const handleEdit = (connectorId: string) => { | ||
| if (!connectorId) { | ||
| setOAuthIntegrationStatus(OAuthIntegrationStatus.Provider) | ||
| setIsEditing(false) | ||
| } else { | ||
| setIsEditing(true) | ||
| } | ||
| } | ||
|
|
||
| const handleFormSuccess = () => { | ||
| // After updating, trigger the OAuth connection process | ||
| setOAuthIntegrationStatus(OAuthIntegrationStatus.OAuth) | ||
| setIsEditing(false) | ||
| } |
There was a problem hiding this comment.
Added state management and handlers for edit mode.
The implementation adds:
- State tracking for edit mode with
isEditing - A handler to toggle edit mode based on connector presence
- A success handler to reset state after form submission
The logic in handleEdit on line 36 has a potential issue:
- const handleEdit = (connectorId: string) => {
- if (!connectorId) {
+ const handleEdit = (connectorId?: string) => {
+ if (!connectorId) {The function should accept optional connectorId to match how it's used in the onClick handler at line 83 where connectorId could potentially be undefined.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const [isEditing, setIsEditing] = useState(false) | |
| const handleEdit = (connectorId: string) => { | |
| if (!connectorId) { | |
| setOAuthIntegrationStatus(OAuthIntegrationStatus.Provider) | |
| setIsEditing(false) | |
| } else { | |
| setIsEditing(true) | |
| } | |
| } | |
| const handleFormSuccess = () => { | |
| // After updating, trigger the OAuth connection process | |
| setOAuthIntegrationStatus(OAuthIntegrationStatus.OAuth) | |
| setIsEditing(false) | |
| } | |
| const [isEditing, setIsEditing] = useState(false) | |
| const handleEdit = (connectorId?: string) => { | |
| if (!connectorId) { | |
| setOAuthIntegrationStatus(OAuthIntegrationStatus.Provider) | |
| setIsEditing(false) | |
| } else { | |
| setIsEditing(true) | |
| } | |
| } | |
| const handleFormSuccess = () => { | |
| // After updating, trigger the OAuth connection process | |
| setOAuthIntegrationStatus(OAuthIntegrationStatus.OAuth) | |
| setIsEditing(false) | |
| } |
server/server.ts
Outdated
| @@ -210,6 +217,7 @@ app.get( | |||
| StartOAuth, | |||
| ) | |||
|
|
|||
| app.get("/oauth/") | |||
server/api/admin.ts
Outdated
| @@ -134,6 +137,7 @@ export const CreateOAuthProvider = async (c: Context) => { | |||
| if (!userRes || !userRes.length) { | |||
| throw new NoUserFound({}) | |||
| } | |||
| console.log(userRes) | |||
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (3)
server/api/admin.ts (1)
185-220: Remove or Mask Sensitive Logging
Logging the entire JWT payload (console.log("Full JWT Payload:", payload)) might inadvertently expose sensitive user data in logs. Consider removing it or masking sensitive properties, especially in production.Additionally, there's a
// @ts-ignorebefore readingc.req.valid("form"). It’s best to avoid@ts-ignoreif possible by properly typing the request or narrowing the form type safely. Otherwise, the update logic appears correct and well-restricted by thewhereclause.console.log("Full JWT Payload:", payload) - console.log("Full JWT Payload:", payload)frontend/src/routes/_authenticated/admin/integrations/google.tsx (2)
99-124: Reduce Duplication Between submitOAuthForm and updateOAuthForm
This newupdateOAuthFormfunction very closely mirrorssubmitOAuthForm; if both processes share significant logic, consider extracting the common logic into a helper function to adhere to DRY principles. Otherwise, this is a fine approach for clarity.
138-148: Strengthen Types for Form Props
The propsonSuccess,refetch, andisEditingare typed loosely asanyor optional. Consider explicitly typing them (e.g.,(data?: unknown) => voidor similar). This improves clarity and maintainability.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
frontend/src/components/OAuthTab.tsx(4 hunks)frontend/src/routes/_authenticated/admin/integrations/google.tsx(6 hunks)frontend/src/routes/_authenticated/integrations/google.tsx(1 hunks)server/api/admin.ts(3 hunks)server/server.ts(3 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- server/server.ts
- frontend/src/components/OAuthTab.tsx
🧰 Additional context used
🧬 Code Graph Analysis (1)
frontend/src/routes/_authenticated/integrations/google.tsx (1)
server/shared/types.ts (1)
Apps(25-25)
🔇 Additional comments (5)
frontend/src/routes/_authenticated/integrations/google.tsx (1)
122-134: Confirm Handling of Multiple Connectors
If a user has more than one Google Drive OAuth connector, the expressiondata?.find(...)?.idwill select only the first match. This may be acceptable if only one connector is expected, but if multiple connectors can exist, consider handling that scenario more explicitly (e.g., filtering by an additional unique identifier). Otherwise, this approach looks good.server/api/admin.ts (1)
19-19: Type Import Looks Good
You’ve introducedtype UpdateOAuthProviderFormhere. It appears to be used properly below without conflicts. No immediate issues.frontend/src/routes/_authenticated/admin/integrations/google.tsx (3)
159-174: Editing Logic Looks Good
Switching between “add” and “update” paths based onisEditingis cleanly implemented. The toast messages also help guide the user. Nice work!
262-264: Clearer Button Label
Dynamically rendering “Update Integration” or “Create Integration” aligns with theisEditingstate, improving user feedback. This is a neat improvement.
755-761: Prop Assignments Appear Correct
PassingconnectorIdandrefetch={refetch}ensures the component can re-fetch data and distinguish which connector is being edited. This is straightforward and aligns with the existing logic.
| // console.log(stats.,stats.totalMail); | ||
| useEffect(() => { | ||
| console.log("Fetched stats:", stats) | ||
| }, [stats]) | ||
| const totalCount: number = stats.totalDrive + stats.totalMail |
There was a problem hiding this comment.
Avoid Hooks Inside a Loop
Calling useEffect within a .map can break React’s “Rules of Hooks,” causing unexpected behavior when the number or order of items changes. Consider moving this logging into a parent-level effect or outside the loop.
Example fix:
- {Object.entries(userStats).map(([email, stats]) => {
- useEffect(() => {
- console.log("Fetched stats:", stats)
- }, [stats])
- ...
- })}
+ useEffect(() => {
+ Object.entries(userStats).forEach(([email, stats]) => {
+ console.log("Fetched stats:", stats)
+ })
+ }, [userStats])
+ {Object.entries(userStats).map(([email, stats]) => {
+ ...
+ })}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| // console.log(stats.,stats.totalMail); | |
| useEffect(() => { | |
| console.log("Fetched stats:", stats) | |
| }, [stats]) | |
| const totalCount: number = stats.totalDrive + stats.totalMail | |
| // Place the logging effect outside of the map | |
| useEffect(() => { | |
| Object.entries(userStats).forEach(([email, stats]) => { | |
| console.log("Fetched stats:", stats) | |
| }) | |
| }, [userStats]) | |
| {Object.entries(userStats).map(([email, stats]) => { | |
| // Removed the inline useEffect hook: | |
| // useEffect(() => { | |
| // console.log("Fetched stats:", stats) | |
| // }, [stats]) | |
| // Existing logic remains | |
| const totalCount: number = stats.totalDrive + stats.totalMail | |
| // ... Other component rendering logic for each user | |
| return ( | |
| <YourComponent key={email} totalCount={totalCount} /* other props */ /> | |
| ) | |
| })} |
zereraz
requested review from
kalpadhwaryu and
junaid-shirur
and removed request for
junaid-shirur
| updateStatus: string | ||
| connectorId?: string | ||
| refetch: any |
There was a problem hiding this comment.
Remove any. Can we type this?
| : "Connecting"} | ||
| {oauthIntegrationStatus === | ||
| OAuthIntegrationStatus.OAuthConnected ? ( | ||
| <p className="mb-4">Connected</p> |
There was a problem hiding this comment.
Why have we added bottom margin here?
| } | ||
| const errorText = await response.text() | ||
| throw new Error( | ||
| `Failed to upload file: ${response.status} ${response.statusText} - ${errorText}`, |
There was a problem hiding this comment.
Error should be Failed to update provider.
| @@ -409,10 +457,15 @@ const UserStatsTable = ({ | |||
| </TableHeader> | |||
| <TableBody> | |||
| {Object.entries(userStats).map(([email, stats]) => { | |||
| // console.log(stats.,stats.totalMail); | |||
| useEffect(() => { | |||
There was a problem hiding this comment.
Remove the log comment as well as the useEffect with the log.
| @@ -179,6 +182,43 @@ export const CreateOAuthProvider = async (c: Context) => { | |||
| }) | |||
| } | |||
|
|
|||
| export const UpdateOAuthProvider = async (c: Context) => { | |||
| const payload = c.get(JwtPayloadKey) | |||
| console.log("Full JWT Payload:", payload) | |||
| @@ -11,6 +11,8 @@ import { | |||
| type PublicUserWorkspace, | |||
| type SelectUser, | |||
| } from "./schema" | |||
| import { connectors } from "./schema" | |||
| import { type Apps } from "@/shared/types" | |||
There was a problem hiding this comment.
Remove both of these unused imports.
| if (!connector) { | ||
| throw new HTTPException(404, { message: "Connector not found" }) | ||
| } | ||
| await db |
There was a problem hiding this comment.
Create a function called updateOAuthProvider in oauthProvider.ts with this code, import and then use it here.
| ) | ||
| return c.json({ | ||
| success: true, | ||
| message: "Connection and Provider updated", |
There was a problem hiding this comment.
Only provider updated.
| onSuccess() | ||
| refetch() |
There was a problem hiding this comment.
refetch is already called via onSuccess in handleFormSuccess, check if it can be removed here.
Description
Added Edit Button for Oauth Provider
Testing
Additional Notes
Summary by CodeRabbit
New Features
Refactor