feat(clients): make client add/edit dialog prettier

Blarc · Blarc · commit 43983aa1a473 · 2024-07-19T18:58:36.000+02:00
diff --git a/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/LLMClientPanel.kt b/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/LLMClientPanel.kt
@@ -35,7 +35,7 @@ abstract class LLMClientPanel(
                 .widthGroup("label")
             textField()
                 .bindText(clientConfiguration::name)
-                .widthGroup("input")
+                .align(Align.FILL)
                 .validationOnInput { notBlank(it.text) }
         }
     }
@@ -49,7 +49,7 @@ abstract class LLMClientPanel(
                     isEditable = true
                 }
                 .bindItem(property)
-                .widthGroup("input")
+                .align(Align.FILL)
                 .onApply { clientConfiguration.addHost(hostComboBox.item) }
         }
     }
@@ -61,7 +61,7 @@ abstract class LLMClientPanel(
                 .applyToComponent { minimumWidth = 400 }
                 .bindIntText(property)
                 .resizableColumn()
-                .widthGroup("input")
+                .align(Align.FILL)
                 .validationOnInput { isInt(it.text) }
         }
     }
@@ -80,7 +80,7 @@ abstract class LLMClientPanel(
                         clientConfiguration.modelId = it
                     }
                 })
-                .widthGroup("input")
+                .align(Align.FILL)
                 .resizableColumn()
                 .onApply { clientConfiguration.addModelId(modelComboBox.item) }
 
@@ -103,12 +103,11 @@ abstract class LLMClientPanel(
                 .bindText(clientConfiguration::temperature)
                 .applyToComponent { minimumWidth = 400 }
                 .resizableColumn()
-                .widthGroup("input")
+                .align(Align.FILL)
                 .validationOnInput { temperatureValid(it.text) }
 
             contextHelp(message("settings.llmClient.temperature.comment"))
                 .resizableColumn()
-                .align(AlignX.LEFT)
         }
     }
 
diff --git a/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/LLMClientTable.kt b/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/LLMClientTable.kt
@@ -150,7 +150,6 @@ class LLMClientTable {
             return Splitter(false, 0.25f).apply {
 
                 val cardPanel = JPanel(cardLayout).apply {
-                    preferredSize = JBUI.size(640, 480)
                     llmClientConfigurations.forEach {
                         add(it.getClientName(), it.panel().create())
                     }
diff --git a/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/gemini/GeminiClientPanel.kt b/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/gemini/GeminiClientPanel.kt
@@ -4,6 +4,7 @@ import com.github.blarc.ai.commits.intellij.plugin.AICommitsBundle.message
 import com.github.blarc.ai.commits.intellij.plugin.notBlank
 import com.github.blarc.ai.commits.intellij.plugin.settings.clients.LLMClientPanel
 import com.intellij.ui.components.JBTextField
+import com.intellij.ui.dsl.builder.Align
 import com.intellij.ui.dsl.builder.Panel
 import com.intellij.ui.dsl.builder.bindText
 import com.intellij.ui.dsl.builder.panel
@@ -35,7 +36,7 @@ class GeminiClientPanel private constructor(
             cell(projectIdTextField)
                 .bindText(clientConfiguration::projectId)
                 .resizableColumn()
-                .widthGroup("input")
+                .align(Align.FILL)
                 .validationOnInput { notBlank(it.text) }
                 .comment(message("settings.gemini.project-id.comment"))
         }
@@ -50,7 +51,7 @@ class GeminiClientPanel private constructor(
                 .bindText(clientConfiguration::location)
                 .resizableColumn()
                 .validationOnInput { notBlank(it.text) }
-                .widthGroup("input")
+                .align(Align.FILL)
         }
     }
 
diff --git a/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/openAi/OpenAiClientPanel.kt b/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/openAi/OpenAiClientPanel.kt
@@ -6,7 +6,6 @@ import com.github.blarc.ai.commits.intellij.plugin.settings.clients.LLMClientPan
 import com.intellij.ui.components.JBPasswordField
 import com.intellij.ui.components.JBTextField
 import com.intellij.ui.dsl.builder.*
-import com.intellij.ui.util.minimumWidth
 
 class OpenAiClientPanel(private val clientConfiguration: OpenAiClientConfiguration) : LLMClientPanel(clientConfiguration) {
     private val proxyTextField = JBTextField()
@@ -30,10 +29,9 @@ class OpenAiClientPanel(private val clientConfiguration: OpenAiClientConfigurati
             label(message("settings.llmClient.proxy"))
                 .widthGroup("label")
             cell(proxyTextField)
-                .applyToComponent { minimumWidth = 400 }
                 .bindText(clientConfiguration::proxyUrl.toNonNullableProperty(""))
                 .resizableColumn()
-                .widthGroup("input")
+                .align(Align.FILL)
                 .comment(message("settings.llmClient.proxy.comment"))
         }
     }
@@ -48,8 +46,9 @@ class OpenAiClientPanel(private val clientConfiguration: OpenAiClientConfigurati
                 })
                 .emptyText(if (clientConfiguration.tokenIsStored) message("settings.openAI.token.stored") else message("settings.openAI.token.example"))
                 .resizableColumn()
-                .widthGroup("input")
-                .comment(message("settings.openAi.token.comment"))
+                .align(Align.FILL)
+                // maxLineLength was eye-balled, but prevents the dialog getting wider
+                .comment(message("settings.openAi.token.comment"), 50)
         }
     }
 
@@ -59,7 +58,8 @@ class OpenAiClientPanel(private val clientConfiguration: OpenAiClientConfigurati
                 .widthGroup("label")
             textField()
                 .bindText(clientConfiguration::organizationId.toNonNullableProperty(""))
-                .widthGroup("input")
+                .align(Align.FILL)
+                .resizableColumn()
         }
     }
 
diff --git a/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/qianfan/QianfanClientPanel.kt b/src/main/kotlin/com/github/blarc/ai/commits/intellij/plugin/settings/clients/qianfan/QianfanClientPanel.kt
@@ -3,6 +3,7 @@ import com.github.blarc.ai.commits.intellij.plugin.AICommitsBundle.message
 import com.github.blarc.ai.commits.intellij.plugin.emptyText
 import com.github.blarc.ai.commits.intellij.plugin.settings.clients.LLMClientPanel
 import com.intellij.ui.components.JBPasswordField
+import com.intellij.ui.dsl.builder.Align
 import com.intellij.ui.dsl.builder.bindText
 import com.intellij.ui.dsl.builder.panel
 import com.intellij.ui.dsl.builder.toNullableProperty
@@ -26,7 +27,7 @@ class QianfanClientPanel(private val clientConfiguration: QianfanClientConfigura
                 })
                 .emptyText(if (clientConfiguration.apiKeyIsStored) message("settings.openAI.token.stored") else "JzRxxxxxxxxxxxxxxxxxxxxx")
                 .resizableColumn()
-                .widthGroup("input")
+                .align(Align.FILL)
         }
         row {
             label(message("settings.qianfan.secretKey"))
@@ -37,7 +38,7 @@ class QianfanClientPanel(private val clientConfiguration: QianfanClientConfigura
                 })
                 .emptyText(if (clientConfiguration.secretKeyIsStored) message("settings.openAI.token.stored") else "kSlxxxxxxxxxxxxxxxxxxxxxxxxxxxxx")
                 .resizableColumn()
-                .widthGroup("input")
+                .align(Align.FILL)
         }
 
         temperatureRow()
diff --git a/src/main/resources/messages/AiCommitsBundle.properties b/src/main/resources/messages/AiCommitsBundle.properties
@@ -73,8 +73,7 @@ settings.llmClient.temperature.comment=What sampling temperature to use, between
 
 settings.openAI.token.example=sk-ABCdefgHIjKlxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 settings.openAI.token.stored=<hidden>
-settings.openAi.token.comment=\
-  <p>You can get your token <a href="https://platform.openai.com/account/api-keys">here.</a/></p>
+settings.openAi.token.comment=You can get your token <a href="https://platform.openai.com/account/api-keys">here.</a>
 settings.openAi.organizationId=Organization ID
 settings.qianfan.apiKey=API key
 settings.qianfan.secretKey=Secret key

Original file line number	Diff line number	Diff line change
`@@ -35,7 +35,7 @@ abstract class LLMClientPanel(`
`35`	`35`	`.widthGroup("label")`
`36`	`36`	`textField()`
`37`	`37`	`.bindText(clientConfiguration::name)`
`38`		`- .widthGroup("input")`
	`38`	`+ .align(Align.FILL)`
`39`	`39`	`.validationOnInput { notBlank(it.text) }`
`40`	`40`	`}`
`41`	`41`	`}`
`@@ -49,7 +49,7 @@ abstract class LLMClientPanel(`
`49`	`49`	`isEditable = true`
`50`	`50`	`}`
`51`	`51`	`.bindItem(property)`
`52`		`- .widthGroup("input")`
	`52`	`+ .align(Align.FILL)`
`53`	`53`	`.onApply { clientConfiguration.addHost(hostComboBox.item) }`
`54`	`54`	`}`
`55`	`55`	`}`
`@@ -61,7 +61,7 @@ abstract class LLMClientPanel(`
`61`	`61`	`.applyToComponent { minimumWidth = 400 }`
`62`	`62`	`.bindIntText(property)`
`63`	`63`	`.resizableColumn()`
`64`		`- .widthGroup("input")`
	`64`	`+ .align(Align.FILL)`
`65`	`65`	`.validationOnInput { isInt(it.text) }`
`66`	`66`	`}`
`67`	`67`	`}`
`@@ -80,7 +80,7 @@ abstract class LLMClientPanel(`
`80`	`80`	`clientConfiguration.modelId = it`
`81`	`81`	`}`
`82`	`82`	`})`
`83`		`- .widthGroup("input")`
	`83`	`+ .align(Align.FILL)`
`84`	`84`	`.resizableColumn()`
`85`	`85`	`.onApply { clientConfiguration.addModelId(modelComboBox.item) }`
`86`	`86`
`@@ -103,12 +103,11 @@ abstract class LLMClientPanel(`
`103`	`103`	`.bindText(clientConfiguration::temperature)`
`104`	`104`	`.applyToComponent { minimumWidth = 400 }`
`105`	`105`	`.resizableColumn()`
`106`		`- .widthGroup("input")`
	`106`	`+ .align(Align.FILL)`
`107`	`107`	`.validationOnInput { temperatureValid(it.text) }`
`108`	`108`
`109`	`109`	`contextHelp(message("settings.llmClient.temperature.comment"))`
`110`	`110`	`.resizableColumn()`
`111`		`- .align(AlignX.LEFT)`
`112`	`111`	`}`
`113`	`112`	`}`
`114`	`113`
Original file line number	Diff line number	Diff line change
`@@ -150,7 +150,6 @@ class LLMClientTable {`
`150`	`150`	`return Splitter(false, 0.25f).apply {`
`151`	`151`
`152`	`152`	`val cardPanel = JPanel(cardLayout).apply {`
`153`		`- preferredSize = JBUI.size(640, 480)`
`154`	`153`	`llmClientConfigurations.forEach {`
`155`	`154`	`add(it.getClientName(), it.panel().create())`
`156`	`155`	`}`