Mercurial > code > home > repos > sco-bot
comparison web/src/main.ts @ 14:b9c2b7fedbcd
fix up deployment and connect ui to server again
author | drewp@bigasterisk.com |
---|---|
date | Thu, 11 Jul 2024 22:11:41 -0700 |
parents | f23b21bd0fce |
children |
comparison
equal
deleted
inserted
replaced
13:403eff4a16c8 | 14:b9c2b7fedbcd |
---|---|
2 import "@shoelace-style/shoelace/dist/themes/light.css"; | 2 import "@shoelace-style/shoelace/dist/themes/light.css"; |
3 import { LitElement, PropertyValueMap, css, html } from "lit"; | 3 import { LitElement, PropertyValueMap, css, html } from "lit"; |
4 import { customElement, queryAsync, state } from "lit/decorators.js"; | 4 import { customElement, queryAsync, state } from "lit/decorators.js"; |
5 import { unsafeHTML } from "lit/directives/unsafe-html.js"; | 5 import { unsafeHTML } from "lit/directives/unsafe-html.js"; |
6 setBasePath("@fs/opt/node_modules/@shoelace-style/shoelace/dist"); | 6 setBasePath("@fs/opt/node_modules/@shoelace-style/shoelace/dist"); |
7 | |
8 interface Doc { | |
9 sourceTitle: string | |
10 phrase: string | |
11 snippetHtml: string | |
12 } | |
7 | 13 |
8 @customElement("sco-search-page") | 14 @customElement("sco-search-page") |
9 export class ScoSearchPage extends LitElement { | 15 export class ScoSearchPage extends LitElement { |
10 static styles = [ | 16 static styles = [ |
11 css` | 17 css` |
50 margin-bottom: 25px; | 56 margin-bottom: 25px; |
51 } | 57 } |
52 `, | 58 `, |
53 ]; | 59 ]; |
54 @state() query: string = "climate"; | 60 @state() query: string = "climate"; |
55 @state() results: Object[] = []; | 61 @state() results: Doc[] = []; |
56 @state() queryError: string = ""; | 62 @state() queryError: string = ""; |
57 @queryAsync("sl-textarea") queryEl?: Promise<SlTextarea>; | 63 @queryAsync("sl-textarea") queryEl?: Promise<SlTextarea>; |
58 protected async firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>) { | 64 protected async firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>) { |
59 super.firstUpdated(_changedProperties); | 65 super.firstUpdated(_changedProperties); |
60 | 66 |
112 </form> | 118 </form> |
113 </section> | 119 </section> |
114 <section id="results"> | 120 <section id="results"> |
115 <dl> | 121 <dl> |
116 ${this.results.map( | 122 ${this.results.map( |
117 (r) => | 123 (r: Doc) => |
118 html`<dt>${r.title}</dt> | 124 html`<dt>${r.sourceTitle}</dt> |
119 <dd>${unsafeHTML(r.snippetHtml)}</dd>` | 125 <dd>${unsafeHTML(r.snippetHtml)}</dd>` |
120 )} | 126 )} |
121 </dl> | 127 </dl> |
122 <div>Matching results: ${this.results.length}</div> | 128 <div>Matching results: ${this.results.length}</div> |
123 </section> | 129 </section> |
124 `; | 130 `; |
125 } | 131 } |