@shareai-lab/kode 1.0.70 → 1.0.73

package/src/components/Bug.tsx

@@ -0,0 +1,367 @@
+import { Box, Text, useInput } from 'ink'
+import * as React from 'react'
+import { useState, useCallback, useEffect } from 'react'
+import { getTheme } from '../utils/theme'
+import { getMessagesGetter } from '../messages'
+import type { Message } from '../query'
+import TextInput from './TextInput'
+import { logError, getInMemoryErrors } from '../utils/log'
+import { env } from '../utils/env'
+import { getGitState, getIsGit, GitRepoState } from '../utils/git'
+import { useTerminalSize } from '../hooks/useTerminalSize'
+import { getAnthropicApiKey, getGlobalConfig } from '../utils/config'
+import { USER_AGENT } from '../utils/http'
+import { logEvent } from '../services/statsig'
+import { PRODUCT_NAME } from '../constants/product'
+import { API_ERROR_MESSAGE_PREFIX, queryQuick } from '../services/claude'
+import { openBrowser } from '../utils/browser'
+import { useExitOnCtrlCD } from '../hooks/useExitOnCtrlCD'
+import { MACRO } from '../constants/macros'
+import { GITHUB_ISSUES_REPO_URL } from '../constants/product'
+
+type Props = {
+  onDone(result: string): void
+}
+
+type Step = 'userInput' | 'consent' | 'submitting' | 'done'
+
+type FeedbackData = {
+  // Removing because of privacy concerns. Add this back in when we have a more
+  // robust tool for viewing feedback data that can de-identify users
+  // user_id: string
+  // session_id: string
+  message_count: number
+  datetime: string
+  description: string
+  platform: string
+  gitRepo: boolean
+  version: string | null
+  transcript: Message[]
+}
+
+export function Bug({ onDone }: Props): React.ReactNode {
+  const [step, setStep] = useState<Step>('userInput')
+  const [cursorOffset, setCursorOffset] = useState(0)
+  const [description, setDescription] = useState('')
+  const [feedbackId, setFeedbackId] = useState<string | null>(null)
+  const [error, setError] = useState<string | null>(null)
+  const [envInfo, setEnvInfo] = useState<{
+    isGit: boolean
+    gitState: GitRepoState | null
+  }>({ isGit: false, gitState: null })
+  const [title, setTitle] = useState<string | null>(null)
+  const textInputColumns = useTerminalSize().columns - 4
+  const messages = getMessagesGetter()()
+
+  useEffect(() => {
+    async function loadEnvInfo() {
+      const isGit = await getIsGit()
+      let gitState: GitRepoState | null = null
+      if (isGit) {
+        gitState = await getGitState()
+      }
+      setEnvInfo({ isGit, gitState })
+    }
+    void loadEnvInfo()
+  }, [])
+
+  const exitState = useExitOnCtrlCD(() => process.exit(0))
+
+  const submitReport = useCallback(async () => {
+    setStep('done')
+    // setStep('submitting')
+    // setError(null)
+    // setFeedbackId(null)
+
+    // const reportData = {
+    //   message_count: messages.length,
+    //   datetime: new Date().toISOString(),
+    //   description,
+    //   platform: env.platform,
+    //   gitRepo: envInfo.isGit,
+    //   terminal: env.terminal,
+    //   version: MACRO.VERSION,
+    //   transcript: messages,
+    //   errors: getInMemoryErrors(),
+    // }
+
+    // const [result, t] = await Promise.all([
+    //   submitFeedback(reportData),
+    //   generateTitle(description),
+    // ])
+
+    // setTitle(t)
+
+    // if (result.success) {
+    //   if (result.feedbackId) {
+    //     setFeedbackId(result.feedbackId)
+    //     logEvent('tengu_bug_report_submitted', {
+    //       feedback_id: result.feedbackId,
+    //     })
+    //   }
+    //   setStep('done')
+    // } else {
+    //   console.log(result)
+    //   setError('Could not submit feedback. Please try again later.')
+    //   setStep('userInput')
+    // }
+  }, [description, envInfo.isGit, messages])
+
+  useInput((input, key) => {
+    // Allow any key press to close the dialog when done or when there's an error
+    // if (step === 'done') {
+    //   if (key.return && feedbackId && title) {
+    //     // Open GitHub issue URL when Enter is pressed
+    //     const issueUrl = createGitHubIssueUrl(feedbackId, title, description)
+    //     void openBrowser(issueUrl)
+    //   }
+    //   onDone('<bash-stdout>Bug report submitted</bash-stdout>')
+    //   return
+    // }
+
+    if (error) {
+      onDone('<bash-stderr>Error submitting bug report</bash-stderr>')
+      return
+    }
+
+    if (key.escape) {
+      onDone('<bash-stderr>Bug report cancelled</bash-stderr>')
+      return
+    }
+
+    if (step === 'consent' && (key.return || input === ' ')) {
+      const issueUrl = createGitHubIssueUrl(
+        feedbackId,
+        description.slice(0, 80),
+        description,
+      )
+      void openBrowser(issueUrl)
+      onDone('<bash-stdout>Bug report submitted</bash-stdout>')
+    }
+  })
+
+  const theme = getTheme()
+
+  return (
+    <>
+      <Box
+        flexDirection="column"
+        borderStyle="round"
+        borderColor={theme.permission}
+        paddingX={1}
+        paddingBottom={1}
+        gap={1}
+      >
+        <Text bold color={theme.permission}>
+          Submit Bug Report
+        </Text>
+        {step === 'userInput' && (
+          <Box flexDirection="column" gap={1}>
+            <Text>
+              Describe the issue below and copy/paste any errors you see:
+            </Text>
+            <TextInput
+              value={description}
+              onChange={setDescription}
+              columns={textInputColumns}
+              onSubmit={() => setStep('consent')}
+              onExitMessage={() =>
+                onDone('<bash-stderr>Bug report cancelled</bash-stderr>')
+              }
+              cursorOffset={cursorOffset}
+              onChangeCursorOffset={setCursorOffset}
+            />
+            {error && (
+              <Box flexDirection="column" gap={1}>
+                <Text color="red">{error}</Text>
+                <Text dimColor>Press any key to close</Text>
+              </Box>
+            )}
+          </Box>
+        )}
+
+        {step === 'consent' && (
+          <Box flexDirection="column">
+            <Text>This report will include:</Text>
+            <Box marginLeft={2} flexDirection="column">
+              <Text>
+                - Your bug description: <Text dimColor>{description}</Text>
+              </Text>
+              <Text>
+                - Environment info:{' '}
+                <Text dimColor>
+                  {env.platform}, {env.terminal}, v{MACRO.VERSION}
+                </Text>
+              </Text>
+              {/* {envInfo.gitState && (
+                <Text>
+                  - Git repo metadata:{' '}
+                  <Text dimColor>
+                    {envInfo.gitState.branchName}
+                    {envInfo.gitState.commitHash
+                      ? `, ${envInfo.gitState.commitHash.slice(0, 7)}`
+                      : ''}
+                    {envInfo.gitState.remoteUrl
+                      ? ` @ ${envInfo.gitState.remoteUrl}`
+                      : ''}
+                    {!envInfo.gitState.isHeadOnRemote && ', not synced'}
+                    {!envInfo.gitState.isClean && ', has local changes'}
+                  </Text>
+                </Text>
+              )} */}
+              <Text>- Model settings (no api keys)</Text>
+            </Box>
+            {/* <Box marginTop={1}>
+              <Text wrap="wrap" dimColor>
+                We will use your feedback to debug related issues or to improve{' '}
+                {PRODUCT_NAME}&apos;s functionality (eg. to reduce the risk of
+                bugs occurring in the future). Anthropic will not train
+                generative models using feedback from {PRODUCT_NAME}.
+              </Text>
+            </Box>
+            <Box marginTop={1}>
+              <Text>
+                Press <Text bold>Enter</Text> to confirm and submit.
+              </Text>
+            </Box> */}
+          </Box>
+        )}
+
+        {step === 'submitting' && (
+          <Box flexDirection="row" gap={1}>
+            <Text>Submitting report…</Text>
+          </Box>
+        )}
+
+        {step === 'done' && (
+          <Box flexDirection="column">
+            <Text color={getTheme().success}>Thank you for your report!</Text>
+            {feedbackId && <Text dimColor>Feedback ID: {feedbackId}</Text>}
+            <Box marginTop={1}>
+              <Text>Press </Text>
+              <Text bold>Enter </Text>
+              <Text>
+                to also create a GitHub issue, or any other key to close.
+              </Text>
+            </Box>
+          </Box>
+        )}
+      </Box>
+
+      <Box marginLeft={3}>
+        <Text dimColor>
+          {exitState.pending ? (
+            <>Press {exitState.keyName} again to exit</>
+          ) : step === 'userInput' ? (
+            <>Enter to continue · Esc to cancel</>
+          ) : step === 'consent' ? (
+            <>Enter to open browser to create GitHub issue · Esc to cancel</>
+          ) : null}
+        </Text>
+      </Box>
+    </>
+  )
+}
+
+function createGitHubIssueUrl(
+  feedbackId: string,
+  title: string,
+  description: string,
+): string {
+  const globalConfig = getGlobalConfig()
+
+  // Get ModelProfile information instead of legacy model info
+  const modelProfiles = globalConfig.modelProfiles || []
+  const activeProfiles = modelProfiles.filter(p => p.isActive)
+
+  let modelInfo = '## Models\n'
+  if (activeProfiles.length === 0) {
+    modelInfo += '- No model profiles configured\n'
+  } else {
+    activeProfiles.forEach(profile => {
+      modelInfo += `- ${profile.name}\n`
+      modelInfo += `    - provider: ${profile.provider}\n`
+      modelInfo += `    - model: ${profile.modelName}\n`
+      modelInfo += `    - baseURL: ${profile.baseURL}\n`
+      modelInfo += `    - maxTokens: ${profile.maxTokens}\n`
+      modelInfo += `    - contextLength: ${profile.contextLength}\n`
+      if (profile.reasoningEffort) {
+        modelInfo += `    - reasoning effort: ${profile.reasoningEffort}\n`
+      }
+    })
+  }
+
+  const body = encodeURIComponent(`
+## Bug Description
+${description}
+
+## Environment Info
+- Platform: ${env.platform}
+- Terminal: ${env.terminal}
+- Version: ${MACRO.VERSION || 'unknown'}
+
+${modelInfo}`)
+  return `${GITHUB_ISSUES_REPO_URL}/new?title=${encodeURIComponent(title)}&body=${body}&labels=user-reported,bug`
+}
+
+async function generateTitle(description: string): Promise<string> {
+  const response = await queryQuick({
+    systemPrompt: [
+      'Generate a concise issue title (max 80 chars) that captures the key point of this feedback. Do not include quotes or prefixes like "Feedback:" or "Issue:". If you cannot generate a title, just use "User Feedback".',
+    ],
+    userPrompt: description,
+  })
+  const title =
+    response.message.content[0]?.type === 'text'
+      ? response.message.content[0].text
+      : 'Bug Report'
+  if (title.startsWith(API_ERROR_MESSAGE_PREFIX)) {
+    return `Bug Report: ${description.slice(0, 60)}${description.length > 60 ? '...' : ''}`
+  }
+  return title
+}
+
+async function submitFeedback(
+  data: FeedbackData,
+): Promise<{ success: boolean; feedbackId?: string }> {
+  return { success: true, feedbackId: '123' }
+  // try {
+  //   const apiKey = getAnthropicApiKey()
+  //   if (!apiKey) {
+  //     return { success: false }
+  //   }
+
+  //   const response = await fetch(
+  //     'https://api.anthropic.com/api/claude_cli_feedback',
+  //     {
+  //       method: 'POST',
+  //       headers: {
+  //         'Content-Type': 'application/json',
+  //         'User-Agent': USER_AGENT,
+  //         'x-api-key': apiKey,
+  //       },
+  //       body: JSON.stringify({
+  //         content: JSON.stringify(data),
+  //       }),
+  //     },
+  //   )
+
+  //   if (response.ok) {
+  //     const result = await response.json()
+  //     if (result?.feedback_id) {
+  //       return { success: true, feedbackId: result.feedback_id }
+  //     }
+  //     logError('Failed to submit feedback: request did not return feedback_id')
+  //     return { success: false }
+  //   }
+
+  //   logError('Failed to submit feedback:' + response.status)
+  //   return { success: false }
+  // } catch (err) {
+  //   logError(
+  //     'Error submitting feedback: ' +
+  //       (err instanceof Error ? err.message : 'Unknown error'),
+  //   )
+  //   return { success: false }
+  // }
+}

package/src/components/Config.tsx

@@ -0,0 +1,293 @@
+import { Box, Text, useInput } from 'ink'
+import * as React from 'react'
+import { useState } from 'react'
+import figures from 'figures'
+import { getTheme } from '../utils/theme'
+import {
+  GlobalConfig,
+  saveGlobalConfig,
+  getGlobalConfig,
+} from '../utils/config.js'
+import chalk from 'chalk'
+import { useExitOnCtrlCD } from '../hooks/useExitOnCtrlCD'
+import { getModelManager } from '../utils/model'
+
+type Props = {
+  onClose: () => void
+}
+
+type Setting =
+  | {
+      id: string
+      label: string
+      value: boolean
+      onChange(value: boolean): void
+      type: 'boolean'
+      disabled?: boolean
+    }
+  | {
+      id: string
+      label: string
+      value: string
+      options: string[]
+      onChange(value: string): void
+      type: 'enum'
+      disabled?: boolean
+    }
+  | {
+      id: string
+      label: string
+      value: string
+      onChange(value: string): void
+      type: 'string'
+      disabled?: boolean
+    }
+  | {
+      id: string
+      label: string
+      value: number
+      onChange(value: number): void
+      type: 'number'
+      disabled?: boolean
+    }
+
+export function Config({ onClose }: Props): React.ReactNode {
+  const [globalConfig, setGlobalConfig] = useState(getGlobalConfig())
+  const initialConfig = React.useRef(getGlobalConfig())
+  const [selectedIndex, setSelectedIndex] = useState(0)
+  const exitState = useExitOnCtrlCD(() => process.exit(0))
+  const [editingString, setEditingString] = useState(false)
+  const [currentInput, setCurrentInput] = useState('')
+  const [inputError, setInputError] = useState<string | null>(null)
+
+  const modelManager = getModelManager()
+  const activeProfiles = modelManager.getAvailableModels()
+
+  const settings: Setting[] = [
+    // Global settings
+    {
+      id: 'theme',
+      label: 'Theme',
+      value: globalConfig.theme ?? 'dark',
+      options: ['dark', 'light'],
+      onChange(theme: string) {
+        const config = { ...getGlobalConfig(), theme: theme as any }
+        saveGlobalConfig(config)
+        setGlobalConfig(config)
+      },
+      type: 'enum',
+    },
+    {
+      id: 'verbose',
+      label: 'Verbose mode',
+      value: globalConfig.verbose ?? false,
+      onChange(verbose: boolean) {
+        const config = { ...getGlobalConfig(), verbose }
+        saveGlobalConfig(config)
+        setGlobalConfig(config)
+      },
+      type: 'boolean',
+    },
+    {
+      id: 'stream',
+      label: 'Stream responses',
+      value: globalConfig.stream ?? true,
+      onChange(stream: boolean) {
+        const config = { ...getGlobalConfig(), stream }
+        saveGlobalConfig(config)
+        setGlobalConfig(config)
+      },
+      type: 'boolean',
+    },
+  ]
+
+  const theme = getTheme()
+
+  useInput((input, key) => {
+    if (editingString) {
+      if (key.return) {
+        const currentSetting = settings[selectedIndex]
+        if (currentSetting?.type === 'string') {
+          try {
+            currentSetting.onChange(currentInput)
+            setEditingString(false)
+            setCurrentInput('')
+            setInputError(null)
+          } catch (error) {
+            setInputError(
+              error instanceof Error ? error.message : 'Invalid input',
+            )
+          }
+        } else if (currentSetting?.type === 'number') {
+          const numValue = parseFloat(currentInput)
+          if (isNaN(numValue)) {
+            setInputError('Please enter a valid number')
+          } else {
+            try {
+              ;(currentSetting as any).onChange(numValue)
+              setEditingString(false)
+              setCurrentInput('')
+              setInputError(null)
+            } catch (error) {
+              setInputError(
+                error instanceof Error ? error.message : 'Invalid input',
+              )
+            }
+          }
+        }
+      } else if (key.escape) {
+        setEditingString(false)
+        setCurrentInput('')
+        setInputError(null)
+      } else if (key.delete || key.backspace) {
+        setCurrentInput(prev => prev.slice(0, -1))
+      } else if (input) {
+        setCurrentInput(prev => prev + input)
+      }
+      return
+    }
+
+    if (key.upArrow && !exitState.pending) {
+      setSelectedIndex(prev => Math.max(0, prev - 1))
+    } else if (key.downArrow && !exitState.pending) {
+      setSelectedIndex(prev => Math.min(settings.length - 1, prev + 1))
+    } else if (key.return && !exitState.pending) {
+      const currentSetting = settings[selectedIndex]
+      if (currentSetting?.disabled) return
+
+      if (currentSetting?.type === 'boolean') {
+        currentSetting.onChange(!currentSetting.value)
+      } else if (currentSetting?.type === 'enum') {
+        const currentIndex = currentSetting.options.indexOf(
+          currentSetting.value,
+        )
+        const nextIndex = (currentIndex + 1) % currentSetting.options.length
+        currentSetting.onChange(currentSetting.options[nextIndex])
+      } else if (
+        currentSetting?.type === 'string' ||
+        currentSetting?.type === 'number'
+      ) {
+        setCurrentInput(String(currentSetting.value))
+        setEditingString(true)
+        setInputError(null)
+      }
+    } else if (key.escape && !exitState.pending) {
+      // Check if config has changed
+      const currentConfigString = JSON.stringify(getGlobalConfig())
+      const initialConfigString = JSON.stringify(initialConfig.current)
+
+      if (currentConfigString !== initialConfigString) {
+        // Config has changed, save it
+        saveGlobalConfig(getGlobalConfig())
+      }
+
+      onClose()
+    }
+  })
+
+  return (
+    <Box flexDirection="column" gap={1}>
+      <Box
+        flexDirection="column"
+        borderStyle="round"
+        borderColor={theme.secondaryBorder}
+        paddingX={2}
+        paddingY={1}
+        gap={1}
+      >
+        <Text bold>
+          Configuration{' '}
+          {exitState.pending
+            ? `(press ${exitState.keyName} again to exit)`
+            : ''}
+        </Text>
+
+        {/* Model Configuration Summary */}
+        <Box flexDirection="column" marginY={1}>
+          <Text bold color={theme.success}>
+            Model Configuration:
+          </Text>
+          {activeProfiles.length === 0 ? (
+            <Text color={theme.secondaryText}>
+              No models configured. Use /model to add models.
+            </Text>
+          ) : (
+            <Box flexDirection="column" marginLeft={2}>
+              {activeProfiles.map(profile => (
+                <React.Fragment key={profile.modelName}>
+                  <Text color={theme.secondaryText}>
+                    • {profile.name} ({profile.provider})
+                  </Text>
+                </React.Fragment>
+              ))}
+              <Box marginTop={1}>
+                <Text color={theme.suggestion}>
+                  Use /model to manage model configurations
+                </Text>
+              </Box>
+            </Box>
+          )}
+        </Box>
+
+        {/* Settings List */}
+        <Box flexDirection="column">
+          {settings.map((setting, index) => (
+            <Box key={setting.id} flexDirection="column">
+              <Box flexDirection="row" gap={1}>
+                <Text
+                  color={
+                    index === selectedIndex
+                      ? theme.success
+                      : setting.disabled
+                        ? theme.secondaryText
+                        : theme.text
+                  }
+                >
+                  {index === selectedIndex ? figures.pointer : ' '}{' '}
+                  {setting.label}
+                </Text>
+                <Text
+                  color={
+                    setting.disabled ? theme.secondaryText : theme.suggestion
+                  }
+                >
+                  {setting.type === 'boolean'
+                    ? setting.value
+                      ? 'enabled'
+                      : 'disabled'
+                    : setting.type === 'enum'
+                      ? setting.value
+                      : String(setting.value)}
+                </Text>
+              </Box>
+              {index === selectedIndex && editingString && (
+                <Box flexDirection="column" marginLeft={2}>
+                  <Text color={theme.suggestion}>
+                    Enter new value: {currentInput}
+                  </Text>
+                  {inputError && <Text color="red">{inputError}</Text>}
+                </Box>
+              )}
+            </Box>
+          ))}
+        </Box>
+
+        <Box marginTop={1}>
+          <Text dimColor>
+            {editingString ? (
+              'Enter to save · Esc to cancel'
+            ) : (
+              <>
+                ↑/↓ to navigate · Enter to change · Esc to close
+                <Text color={theme.suggestion}>
+                  {' '}
+                  · Use /model for model config
+                </Text>
+              </>
+            )}
+          </Text>
+        </Box>
+      </Box>
+    </Box>
+  )
+}