sidebar: fancy placeholder text

.config/ags/widgets/sideleft/apiwidgets.js

@@ -70,7 +70,7 @@ export const chatEntry = TextView({
     hexpand: true,
     wrapMode: Gtk.WrapMode.WORD_CHAR,
     acceptsTab: false,
-    className: 'sidebar-chat-entry',
+    className: 'sidebar-chat-entry txt txt-smallie',
     setup: (self) => self
         .hook(ChatGPT, (self) => {
             if (APIS[currentApiId].name != 'Assistant (ChatGPT 3.5)') return;
@@ -104,13 +104,16 @@ export const chatEntry = TextView({
 chatEntry.get_buffer().connect("changed", (buffer) => {
     const bufferText = buffer.get_text(buffer.get_start_iter(), buffer.get_end_iter(), true);
     chatSendButton.toggleClassName('sidebar-chat-send-available', bufferText.length > 0);
+    chatPlaceholderRevealer.revealChild = (bufferText.length == 0);
     if (buffer.get_line_count() > 1 || bufferText.length > EXPAND_INPUT_THRESHOLD) {
         chatEntryWrapper.toggleClassName('sidebar-chat-wrapper-extended', true);
         chatEntry.set_valign(Gtk.Align.FILL);
+        chatPlaceholder.set_valign(Gtk.Align.FILL);
     }
     else {
         chatEntryWrapper.toggleClassName('sidebar-chat-wrapper-extended', false);
         chatEntry.set_valign(Gtk.Align.CENTER);
+        chatPlaceholder.set_valign(Gtk.Align.CENTER);
     }
 });
 
@@ -132,12 +135,27 @@ const chatSendButton = Button({
     },
 });
 
+const chatPlaceholder = Label({
+    className: 'txt-subtext txt-smallie margin-left-5',
+    hpack: 'start',
+    vpack: 'center',
+    label: APIS[currentApiId].placeholderText,
+});
+
+const chatPlaceholderRevealer = Revealer({
+    revealChild: true,
+    transition: 'crossfade',
+    transitionDuration: 200,
+    child: chatPlaceholder,
+});
+
 const textboxArea = Box({ // Entry area
     className: 'sidebar-chat-textarea',
     children: [
         Overlay({
             passThrough: true,
             child: chatEntryWrapper,
+            overlays: [chatPlaceholderRevealer],
         }),
         Box({ className: 'width-10' }),
         chatSendButton,
@@ -160,7 +178,7 @@ function switchToTab(id) {
     APIS[id].tabIcon.toggleClassName('sidebar-chat-apiswitcher-icon-enabled', true);
     apiContentStack.shown = APIS[id].name;
     apiCommandStack.shown = APIS[id].name;
-    chatEntry.placeholderText = APIS[id].placeholderText;
+    chatPlaceholder.label = APIS[id].placeholderText;
     currentApiId = id;
 }