fix(connectors): align connector scopes with oauth config and fix kb modal UX

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/add-connector-modal/add-connector-modal.tsx

@@ -57,6 +57,7 @@ export function AddConnectorModal({ open, onOpenChange, knowledgeBaseId }: AddCo
   const [showOAuthModal, setShowOAuthModal] = useState(false)
 
   const [apiKeyValue, setApiKeyValue] = useState('')
+  const [apiKeyFocused, setApiKeyFocused] = useState(false)
   const [searchTerm, setSearchTerm] = useState('')
 
   const { workspaceId } = useParams<{ workspaceId: string }>()
@@ -235,10 +236,12 @@ export function AddConnectorModal({ open, onOpenChange, knowledgeBaseId }: AddCo
                         : 'API Key'}
                     </Label>
                     <Input
-                      type='password'
+                      type={apiKeyFocused ? 'text' : 'password'}
                       autoComplete='new-password'
                       value={apiKeyValue}
                       onChange={(e) => setApiKeyValue(e.target.value)}
+                      onFocus={() => setApiKeyFocused(true)}
+                      onBlur={() => setApiKeyFocused(false)}
                       placeholder={
                         connectorConfig.auth.mode === 'apiKey' && connectorConfig.auth.placeholder
                           ? connectorConfig.auth.placeholder
@@ -345,17 +348,7 @@ export function AddConnectorModal({ open, onOpenChange, knowledgeBaseId }: AddCo
                       >
                         <Checkbox
                           checked={!disabledTagIds.has(tagDef.id)}
-                          onCheckedChange={(checked) => {
-                            setDisabledTagIds((prev) => {
-                              const next = new Set(prev)
-                              if (checked) {
-                                next.delete(tagDef.id)
-                              } else {
-                                next.add(tagDef.id)
-                              }
-                              return next
-                            })
-                          }}
+                          onCheckedChange={() => {}}
                         />
                         <span className='text-[var(--text-primary)]'>{tagDef.displayName}</span>
                         <span className='text-[11px] text-[var(--text-muted)]'>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/connectors-section/connectors-section.tsx

@@ -130,8 +130,6 @@ export function ConnectorsSection({
 
   return (
     <div className='mt-[16px]'>
-      <h2 className='font-medium text-[14px] text-[var(--text-secondary)]'>Connected Sources</h2>
-
       {error && (
         <p className='mt-[8px] text-[12px] text-[var(--text-error)] leading-tight'>{error}</p>
       )}

apps/sim/connectors/github/github.ts

@@ -158,7 +158,11 @@ export const githubConnector: ConnectorConfig = {
   version: '1.0.0',
   icon: GithubIcon,
 
-  auth: { mode: 'oauth', provider: 'github', requiredScopes: ['repo'] },
+  auth: {
+    mode: 'apiKey',
+    label: 'Personal Access Token',
+    placeholder: 'ghp_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
+  },
 
   configFields: [
     {

apps/sim/connectors/gmail/gmail.ts

@@ -291,7 +291,7 @@ export const gmailConnector: ConnectorConfig = {
   auth: {
     mode: 'oauth',
     provider: 'google-email',
-    requiredScopes: ['https://www.googleapis.com/auth/gmail.readonly'],
+    requiredScopes: ['https://www.googleapis.com/auth/gmail.modify'],
   },
 
   configFields: [

apps/sim/connectors/google-calendar/google-calendar.ts

@@ -237,7 +237,7 @@ export const googleCalendarConnector: ConnectorConfig = {
   auth: {
     mode: 'oauth',
     provider: 'google-calendar',
-    requiredScopes: ['https://www.googleapis.com/auth/calendar.readonly'],
+    requiredScopes: ['https://www.googleapis.com/auth/calendar'],
   },
 
   configFields: [

apps/sim/connectors/google-sheets/google-sheets.ts

@@ -171,7 +171,7 @@ export const googleSheetsConnector: ConnectorConfig = {
   auth: {
     mode: 'oauth',
     provider: 'google-sheets',
-    requiredScopes: ['https://www.googleapis.com/auth/spreadsheets.readonly'],
+    requiredScopes: ['https://www.googleapis.com/auth/drive'],
   },
 
   configFields: [

apps/sim/connectors/reddit/reddit.ts

@@ -241,6 +241,7 @@ export const redditConnector: ConnectorConfig = {
   auth: {
     mode: 'oauth',
     provider: 'reddit',
+    requiredScopes: ['read'],
   },
 
   configFields: [