Skip to content

Commit fc76ff9

Browse files
fix(copilot): Fix merge conflict resolution issues
- Restored missing #send method in input.element.ts - Removed duplicate method implementations in copilot.context.ts - All TypeScript files now compile successfully
1 parent a0c43bb commit fc76ff9

4 files changed

Lines changed: 339 additions & 521 deletions

File tree

Umbraco.AI.Agent.Copilot/src/Umbraco.AI.Agent.Copilot/Client/src/copilot/components/chat/input.element.ts

Lines changed: 130 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -33,25 +33,27 @@ export class UaiCopilotInputElement extends UmbLitElement {
3333
#copilotContext?: UaiCopilotContext;
3434
#textareaRef = createRef<HTMLElement>();
3535

36-
get #isDisabled(): boolean {
37-
return this.disabled || this._agents.length === 0;
38-
}
39-
40-
constructor() {
41-
super();
42-
this.consumeContext(UAI_COPILOT_CONTEXT, (context) => {
43-
if (context) {
44-
this.#copilotContext = context;
45-
this.observe(context.agents, (agents) => (this._agents = agents));
46-
this.observe(context.selectedAgent, (agent) => (this._selectedAgentId = agent?.id ?? ""));
47-
this.observe(context.agentsLoading, (loading) => (this._agentsLoading = loading));
48-
this.observe(context.isOpen, (isOpen) => {
49-
if (isOpen) {
50-
// Focus input when sidebar opens (after transition completes)
51-
setTimeout(() => {
52-
this.#textareaRef.value?.focus();
53-
}, 350); // Slightly longer than the 0.3s CSS transition
54-
}
36+
get #isDisabled(): boolean {
37+
return this.disabled || this._agents.length === 0;
38+
}
39+
40+
constructor() {
41+
super();
42+
this.consumeContext(UAI_COPILOT_CONTEXT, (context) => {
43+
if (context) {
44+
this.#copilotContext = context;
45+
this.observe(context.agents, (agents) => (this._agents = agents));
46+
this.observe(context.selectedAgent, (agent) => (this._selectedAgentId = agent?.id ?? ""));
47+
this.observe(context.agentsLoading, (loading) => (this._agentsLoading = loading));
48+
this.observe(context.isOpen, (isOpen) => {
49+
if (isOpen) {
50+
// Focus input when sidebar opens (after transition completes)
51+
setTimeout(() => {
52+
this.#textareaRef.value?.focus();
53+
}, 350); // Slightly longer than the 0.3s CSS transition
54+
}
55+
});
56+
}
5557
});
5658
}
5759

@@ -90,115 +92,127 @@ export class UaiCopilotInputElement extends UmbLitElement {
9092
this._value = (e.target as HTMLTextAreaElement).value;
9193
}
9294

93-
override render() {
94-
const hasNoAgents = this._agents.length === 0 && !this._agentsLoading;
95-
96-
return html`
97-
<div class="input-wrapper">
98-
<div class="input-box">
99-
<uui-textarea
100-
${ref(this.#textareaRef)}
101-
.value=${this._value}
102-
placeholder=${hasNoAgents
103-
? "Create a copilot agent to start chatting"
104-
: this.placeholder}
105-
?disabled=${this.#isDisabled}
106-
auto-height
107-
@input=${this.#handleInput}
108-
@keydown=${this.#handleKeydown}
109-
></uui-textarea>
110-
<hr class="divider" />
111-
<div class="actions-row">
112-
<div class="left-actions">
113-
${this._agentsLoading
114-
? html`<span class="agent-loading">Loading...</span>`
115-
: hasNoAgents
116-
? html`<span class="no-agents-message">No agents configured</span>`
117-
: html`
118-
<uui-select
119-
class="agent-select"
120-
.value=${this._selectedAgentId}
121-
.options=${this.#getAgentOptions()}
122-
@change=${this.#handleAgentChange}
123-
></uui-select>
124-
`}
95+
#send() {
96+
if (!this._value.trim() || this.disabled) return;
97+
98+
this.dispatchEvent(
99+
new CustomEvent("send", {
100+
detail: this._value,
101+
bubbles: true,
102+
composed: true,
103+
}),
104+
);
105+
106+
this._value = "";
107+
}
108+
109+
override render() {
110+
const hasNoAgents = this._agents.length === 0 && !this._agentsLoading;
111+
112+
return html`
113+
<div class="input-wrapper">
114+
<div class="input-box">
115+
<uui-textarea
116+
${ref(this.#textareaRef)}
117+
.value=${this._value}
118+
placeholder=${hasNoAgents ? "Create a copilot agent to start chatting" : this.placeholder}
119+
?disabled=${this.#isDisabled}
120+
auto-height
121+
@input=${this.#handleInput}
122+
@keydown=${this.#handleKeydown}
123+
></uui-textarea>
124+
<hr class="divider" />
125+
<div class="actions-row">
126+
<div class="left-actions">
127+
${this._agentsLoading
128+
? html`<span class="agent-loading">Loading...</span>`
129+
: hasNoAgents
130+
? html`<span class="no-agents-message">No agents configured</span>`
131+
: html`
132+
<uui-select
133+
class="agent-select"
134+
.value=${this._selectedAgentId}
135+
.options=${this.#getAgentOptions()}
136+
@change=${this.#handleAgentChange}
137+
></uui-select>
138+
`}
139+
</div>
140+
<uui-button
141+
look="primary"
142+
compact
143+
?disabled=${this.#isDisabled || !this._value.trim()}
144+
@click=${this.#send}
145+
>
146+
<uui-icon name="icon-navigation-right"></uui-icon>
147+
</uui-button>
148+
</div>
149+
</div>
125150
</div>
126-
<uui-button
127-
look="primary"
128-
compact
129-
?disabled=${this.#isDisabled || !this._value.trim()}
130-
@click=${this.#send}
131-
>
132-
<uui-icon name="icon-navigation-right"></uui-icon>
133-
</uui-button>
134-
</div>
135-
</div>
136-
</div>
137-
`;
138-
}
139-
140-
static override styles = css`
141-
:host {
142-
display: block;
151+
`;
143152
}
144153

145-
.input-wrapper {
146-
padding: var(--uui-size-space-4);
147-
}
154+
static override styles = css`
155+
:host {
156+
display: block;
157+
}
148158
149-
.input-box {
150-
display: flex;
151-
flex-direction: column;
152-
gap: var(--uui-size-space-2);
153-
padding: var(--uui-size-space-3);
154-
background: var(--uui-color-surface);
155-
border: 1px solid var(--uui-color-border);
156-
border-radius: var(--uui-border-radius);
157-
}
159+
.input-wrapper {
160+
padding: var(--uui-size-space-4);
161+
}
158162
159-
uui-textarea {
160-
--uui-textarea-min-height: 24px;
161-
--uui-textarea-max-height: 200px;
162-
--uui-textarea-background-color: transparent;
163-
--uui-textarea-border-color: transparent;
164-
}
163+
.input-box {
164+
display: flex;
165+
flex-direction: column;
166+
gap: var(--uui-size-space-2);
167+
padding: var(--uui-size-space-3);
168+
background: var(--uui-color-surface);
169+
border: 1px solid var(--uui-color-border);
170+
border-radius: var(--uui-border-radius);
171+
}
165172
166-
uui-textarea:focus-within {
167-
--uui-textarea-border-color: transparent;
168-
}
173+
uui-textarea {
174+
--uui-textarea-min-height: 24px;
175+
--uui-textarea-max-height: 200px;
176+
--uui-textarea-background-color: transparent;
177+
--uui-textarea-border-color: transparent;
178+
}
169179
170-
.divider {
171-
border: none;
172-
border-top: 1px solid var(--uui-color-border);
173-
margin: 0;
174-
}
180+
uui-textarea:focus-within {
181+
--uui-textarea-border-color: transparent;
182+
}
175183
176-
.actions-row {
177-
display: flex;
178-
justify-content: space-between;
179-
align-items: center;
180-
}
184+
.divider {
185+
border: none;
186+
border-top: 1px solid var(--uui-color-border);
187+
margin: 0;
188+
}
181189
182-
.left-actions {
183-
display: flex;
184-
gap: var(--uui-size-space-2);
185-
}
190+
.actions-row {
191+
display: flex;
192+
justify-content: space-between;
193+
align-items: center;
194+
}
186195
187-
.agent-select {
188-
min-width: 120px;
189-
max-width: 180px;
190-
}
196+
.left-actions {
197+
display: flex;
198+
gap: var(--uui-size-space-2);
199+
}
191200
192-
.agent-loading {
193-
font-size: var(--uui-type-small-size);
194-
color: var(--uui-color-text-alt);
195-
}
201+
.agent-select {
202+
min-width: 120px;
203+
max-width: 180px;
204+
}
196205
197-
.no-agents-message {
198-
font-size: var(--uui-type-small-size);
199-
color: var(--uui-color-danger);
200-
}
201-
`;
206+
.agent-loading {
207+
font-size: var(--uui-type-small-size);
208+
color: var(--uui-color-text-alt);
209+
}
210+
211+
.no-agents-message {
212+
font-size: var(--uui-type-small-size);
213+
color: var(--uui-color-danger);
214+
}
215+
`;
202216
}
203217

204218
export default UaiCopilotInputElement;

0 commit comments

Comments
 (0)