Trim prompt instructions across handlers, remove configuration dimming, and update status bar gradients

- should dim configurations in API target, when instructions are empty
- should trim current instructions upon use
- istead of static '40px', calculate with formula: character count * 3 + 20

├── .prettierrc
├── apps
│   └── editor
│       └── src
│           ├── utils
│           │   └── changes-integration
│           │       └── diff-processor
│           │           └── test-cases
│           │               └── generic-6
│           │                   ├── expected.txt
│           │                   └── original.txt
│           └── views
│               └── prompt
│                   ├── backend
│                   │   ├── message-handlers
│                   │   │   ├── handle-agentic-search
│                   │   │   │   ├── agentic-search.ts
│                   │   │   │   └── handle-agentic-search.ts
│                   │   │   ├── handle-at-sign-quick-pick
│                   │   │   │   └── handle-at-sign-quick-pick.ts
│                   │   │   ├── handle-autofill.ts
│                   │   │   ├── handle-hash-sign-quick-pick
│                   │   │   │   └── handle-hash-sign-quick-pick.ts
│                   │   │   ├── handle-make-api-call.ts
│                   │   │   ├── handle-preview-web-configuration.ts
│                   │   │   ├── handle-template-quick-pick.ts
│                   │   │   └── utils
│                   │   │       └── build-prompt-payload.ts
│                   │   └── prompt-view-provider.ts
│                   └── frontend
│                       ├── Main
│                       │   ├── Main.tsx
│                       │   └── MainView
│                       │       └── MainView.tsx
│                       ├── Prompt.tsx
│                       └── hooks
│                           └── use-prompt
│                               └── hooks
│                                   └── use-instructions.ts
└── packages
    └── ui
        └── src
            └── components
                └── editor
                    └── prompt
                        └── StatusBar
                            ├── StatusBar.module.scss
                            └── StatusBar.tsx

Author: robertpiosik

apps/editor/src/views/prompt/backend/message-handlers/handle-agentic-search/handle-agentic-search.ts

@@ -15,7 +15,7 @@ export const handle_agentic_search = async (
     return
   }
 
-  const current_instructions = prompt_view_provider.current_instructions
+  const current_instructions = prompt_view_provider.current_instructions.trim()
 
   const last_query_state =
     prompt_view_provider.extension_context.workspaceState.get<{

apps/editor/src/views/prompt/backend/message-handlers/handle-autofill.ts

@@ -54,7 +54,8 @@ export const handle_autofill = async (params: {
 
   let sent = false
 
-  const current_instructions = params.prompt_view_provider.current_instructions
+  const current_instructions =
+    params.prompt_view_provider.current_instructions.trim()
 
   const {
     other_files,

apps/editor/src/views/prompt/backend/message-handlers/handle-make-api-call.ts

@@ -154,7 +154,7 @@ export const handle_make_api_call = async (
     prompt_view_provider.extension_context
   )
 
-  const current_instructions = prompt_view_provider.current_instructions
+  const current_instructions = prompt_view_provider.current_instructions.trim()
 
   if (!current_instructions) {
     vscode.window.showInformationMessage(

apps/editor/src/views/prompt/backend/message-handlers/handle-preview-web-configuration.ts

@@ -18,7 +18,7 @@ export const handle_preview_web_configuration = async (
 ): Promise<void> => {
   await vscode.workspace.saveAll()
 
-  const current_instructions = prompt_view_provider.current_instructions
+  const current_instructions = prompt_view_provider.current_instructions.trim()
 
   const {
     other_files,

apps/editor/src/views/prompt/backend/message-handlers/utils/build-prompt-payload.ts

@@ -27,7 +27,7 @@ export const build_prompt_payload = async (params: {
 
   const { instructions: processed_instructions, skill_definitions } =
     await replace_symbols({
-      instructions: prompt_view_provider.current_instructions || '',
+      instructions: prompt_view_provider.current_instructions.trim() || '',
       extension_context: prompt_view_provider.extension_context,
       workspace_provider: prompt_view_provider.workspace_provider,
       remove_images

apps/editor/src/views/prompt/backend/prompt-view-provider.ts

@@ -515,14 +515,14 @@ export class PromptViewProvider implements vscode.WebviewViewProvider {
 
   public async send_token_count() {
     const edit_instructions_result = await replace_symbols({
-      instructions: this.current_edit_files_instruction,
+      instructions: this.current_edit_files_instruction.trim(),
       extension_context: this.extension_context,
       workspace_provider: this.workspace_provider,
       remove_images: true,
       symbols_cache: this.symbols_cache
     })
     const ask_instructions_result = await replace_symbols({
-      instructions: this.current_ask_about_context_instruction,
+      instructions: this.current_ask_about_context_instruction.trim(),
       extension_context: this.extension_context,
       workspace_provider: this.workspace_provider,
       remove_images: true,

apps/editor/src/views/prompt/frontend/Main/Main.tsx

@@ -168,7 +168,8 @@ export const Main: React.FC<Props> = (props) => {
     props.target == TARGET.WEB ? props.web_prompt_type : props.api_prompt_type
 
   const update_chat_history = (instruction: string) => {
-    if (!instruction.trim()) {
+    const trimmed_instruction = instruction.trim()
+    if (!trimmed_instruction) {
       return
     }
 
@@ -188,10 +189,13 @@ export const Main: React.FC<Props> = (props) => {
     }
 
     const is_duplicate =
-      history && history.length > 0 && history[0] === instruction
+      history && history.length > 0 && history[0] == trimmed_instruction
 
     if (!is_duplicate) {
-      const new_history = [instruction, ...(history || [])].slice(0, 100)
+      const new_history = [trimmed_instruction, ...(history || [])].slice(
+        0,
+        100
+      )
       set_history(new_history)
 
       post_message(props.vscode, {

apps/editor/src/views/prompt/frontend/Main/MainView/MainView.tsx

@@ -558,7 +558,6 @@ export const MainView: React.FC<Props> = (props) => {
         <UiConfigurations
           configurations={web_configurations}
           empty_landscape_placeholder_above={configurations_placeholder_above}
-          is_dimmed={is_context_empty || !props.is_connected}
           on_create={(params) => {
             props.on_create_web_configuration(params)
           }}
@@ -599,7 +598,6 @@ export const MainView: React.FC<Props> = (props) => {
       {props.target == TARGET.API && (
         <UiConfigurations
           configurations={api_configurations_ui}
-          is_dimmed={is_context_empty || !props.api_configurations.length}
           on_configuration_click={props.on_api_configuration_click}
           on_reorder={(reordered) =>
             props.on_api_configurations_reorder(reordered)

packages/ui/src/components/editor/prompt/Configurations/Configurations.module.scss

@@ -32,13 +32,6 @@
       }
     }
 
-    &--dimmed {
-      .configurations__item__left__icon,
-      .configurations__item__left__text {
-        opacity: var(--dimmed-opacity);
-      }
-    }
-
     &--highlighted {
       background-color: var(--vscode-list-inactiveSelectionBackground);
 

packages/ui/src/components/editor/prompt/Configurations/Configurations.tsx

@@ -26,7 +26,6 @@ export namespace Configurations {
     }) => void
     on_edit: (id: string) => void
     on_delete: (id: string) => void
-    is_dimmed?: boolean
     empty_landscape_placeholder_above?: React.ReactNode
     empty_landscape_placeholder_below?: React.ReactNode
     translations: {
@@ -55,8 +54,7 @@ export const Configurations: React.FC<Configurations.Props> = (props) => {
         key={configuration.id}
         className={cn(styles.configurations__item, {
           [styles['configurations__item--highlighted']]:
-            active_configuration_id == configuration.id,
-          [styles['configurations__item--dimmed']]: props.is_dimmed
+            active_configuration_id == configuration.id
         })}
         onClick={() => props.on_configuration_click(configuration.id)}
         role="button"