Skip to content

Commit f992b57

Browse files
willschippwillschipp
committed
WIP: tooltip work and build into the embabel server
1 parent 6517eaf commit f992b57

File tree

10 files changed

+75
-21
lines changed

10 files changed

+75
-21
lines changed

‎.gitignore

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,4 +10,5 @@ node_modules
1010

1111
embabel-database-agent/data
1212
# embabel-database-core/data
13-
embabel-database-server/data
13+
embabel-database-server/data
14+
embabel-database-server/src/main/resources/static

‎embabel-database-agent/src/test/resources/json/README 2.md

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎embabel-database-ui/public/github-mark-white.svg

Lines changed: 1 addition & 0 deletions
Loading

‎embabel-database-ui/public/vite.svg

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎embabel-database-ui/src/components/data/ResultsTable.jsx

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,12 @@ import { Cell, ColumnHeaderCell, Column, Table } from "@blueprintjs/table";
44

55
import { formatPrice } from "../../utils/formatPrice";
66

7+
8+
const columnNames = ["Name","Provider","Tokens","Pricing per 1m Token","Tags"];
9+
710
function renderColumnHeader(index) {
8-
const name = ["Name","Provider","Tokens","Pricing per 1m Token","Tags"][index];
11+
// const name = ["Name","Provider","Tokens","Pricing per 1m Token","Tags"][index];
12+
const name = columnNames[index];
913
const keyVal = name + "-" + index
1014
return <ColumnHeaderCell key={keyVal} name={name} index={index} nameRenderer={renderName}/>;
1115
}
@@ -70,6 +74,10 @@ function renderCell(rowIndex, columnIndex, data) {
7074

7175
function ResultsTable({ data, selectionCallback }) {
7276

77+
const selectedColumns = [0,1,2,3,4]
78+
const columnWidths = [200,100,100,200,500];
79+
const totalWidth = columnWidths.reduce((a,b) => a + b, 0);
80+
7381
const handleSelection = (region) => {
7482
if (selectionCallback) {
7583
//invoke selection callback
@@ -78,7 +86,7 @@ function ResultsTable({ data, selectionCallback }) {
7886
}
7987

8088
return (
81-
<Table numRows={data.length} onSelection={handleSelection} enableMultipleSelection={false} enableColumnResizing={true} columnWidths={[200,100,100,200,500]} style={{ height: '100vh', width: '90vw'}}>
89+
<Table numRows={data.length} onSelection={handleSelection} enableMultipleSelection={false} enableColumnResizing={true} columnWidths={columnWidths} defaultColumnWidth={100} style={{ height: '100vh'}}>
8290
<Column key="col-0" cellRenderer={(rowIndex) => renderCell(rowIndex,0,data)} columnHeaderCellRenderer={renderColumnHeader}/>
8391
<Column key="col-1" cellRenderer={(rowIndex) => renderCell(rowIndex,1,data)} columnHeaderCellRenderer={renderColumnHeader}/>
8492
<Column key="col-2" cellRenderer={(rowIndex) => renderCell(rowIndex,2,data)} columnHeaderCellRenderer={renderColumnHeader}/>
@@ -88,4 +96,4 @@ function ResultsTable({ data, selectionCallback }) {
8896
);
8997
}
9098

91-
export default ResultsTable
99+
export default ResultsTable

‎embabel-database-ui/src/components/forms/SearchByName.jsx

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useState } from "react";
2-
import { Button,ControlGroup,InputGroup } from "@blueprintjs/core";
2+
import { Button,ControlGroup,InputGroup, Tooltip } from "@blueprintjs/core";
33
import { Search, Reset } from "@blueprintjs/icons";
44

55

@@ -28,9 +28,23 @@ function SearchByName({ onSearch, onReset }) {
2828
return (
2929
<>
3030
<ControlGroup>
31-
<InputGroup type="text" placeholder="Search by name..." inputSize={50} onChange={(e) => setValue(e.target.value)} onKeyDown={handleKeyDown}/>
31+
<Tooltip
32+
content={<span>Enter a model name to search by or just hit 'enter' to see all</span>}
33+
openOnTargetFocus={false}
34+
placement="bottom"
35+
usePortal={false}>
36+
<InputGroup type="text" placeholder="Search by name..." inputSize={50} onChange={(e) => setValue(e.target.value)} onKeyDown={handleKeyDown}/>
37+
</Tooltip>
3238
<Button onClick={handleSearch}><Search/></Button>
33-
{ (onReset) ? (<Button onClick={handleReset}><Reset/></Button>) : (<></>) }
39+
{ (onReset) ? (
40+
<Tooltip
41+
content={<span>Click here to 'reset' your search and see all models.</span>}
42+
openOnTargetFocus={false}
43+
placement="right"
44+
usePortal={false}>
45+
<Button onClick={handleReset}><Reset/></Button>
46+
</Tooltip>
47+
) : (<></>) }
3448
</ControlGroup>
3549
</>
3650
);

‎embabel-database-ui/src/components/forms/SearchByProviders.jsx

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useState } from "react";
2-
import { Button,ControlGroup,InputGroup } from "@blueprintjs/core";
2+
import { Button,ControlGroup,InputGroup, Tooltip } from "@blueprintjs/core";
33
import { Search, Reset } from "@blueprintjs/icons";
44

55
function SearchByProviders({ onSearch, onReset }) {
@@ -27,9 +27,23 @@ function SearchByProviders({ onSearch, onReset }) {
2727
return (
2828
<>
2929
<ControlGroup>
30-
<InputGroup type="text" placeholder="Search by provider..." inputSize={50} onChange={(e) => setValue(e.target.value)} onKeyDown={handleKeyDown}/>
30+
<Tooltip
31+
content={<span>Enter a provider name to search by or just hit 'enter' to see all</span>}
32+
openOnTargetFocus={false}
33+
placement="bottom"
34+
usePortal={false}>
35+
<InputGroup type="text" placeholder="Search by provider..." inputSize={50} onChange={(e) => setValue(e.target.value)} onKeyDown={handleKeyDown}/>
36+
</Tooltip>
3137
<Button onClick={handleSearch}><Search/></Button>
32-
{ (onReset) ? (<Button onClick={handleReset}><Reset/></Button>) : (<></>) }
38+
{ (onReset) ? (
39+
<Tooltip
40+
content={<span>Click here to 'reset' your search and see all models.</span>}
41+
openOnTargetFocus={false}
42+
placement="right"
43+
usePortal={false}>
44+
<Button onClick={handleReset}><Reset/></Button>
45+
</Tooltip>
46+
) : (<></>) }
3347
</ControlGroup>
3448
</>
3549
);

‎embabel-database-ui/src/components/forms/SearchByTags.jsx

Lines changed: 21 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useEffect, useState } from "react";
2-
import { Button,ControlGroup,MenuItem } from "@blueprintjs/core";
2+
import { Button,ControlGroup,MenuItem,Tooltip } from "@blueprintjs/core";
33
import { Search, Reset } from "@blueprintjs/icons";
44
import { MultiSelect } from "@blueprintjs/select";
55

@@ -52,13 +52,27 @@ function SearchByTags({ onSearch, onReset }) {
5252
return (
5353
<>
5454
<ControlGroup>
55-
<MultiSelect items={tags}
56-
itemRenderer={itemRenderer}
57-
onItemSelect={item => setSelectedTags([...selectedTags, item])}
58-
selectedItems={selectedTags}
59-
tagRenderer={tags => tags.tag}/>
55+
<Tooltip
56+
content={<span>Choose a tag from the drop down list. You can add multiple tags. Click on the button to then filter.</span>}
57+
openOnTargetFocus={false}
58+
placement="bottom"
59+
usePortal={false}>
60+
<MultiSelect items={tags}
61+
itemRenderer={itemRenderer}
62+
onItemSelect={item => setSelectedTags([...selectedTags, item])}
63+
selectedItems={selectedTags}
64+
tagRenderer={tags => tags.tag}/>
65+
</Tooltip>
6066
<Button onClick={handleSearch}><Search/></Button>
61-
{ (onReset) ? (<Button onClick={handleReset}><Reset/></Button>) : (<></>) }
67+
{ (onReset) ? (
68+
<Tooltip
69+
content={<span>Click here to 'reset' your search and see all models.</span>}
70+
openOnTargetFocus={false}
71+
placement="right"
72+
usePortal={false}>
73+
<Button onClick={handleReset}><Reset/></Button>
74+
</Tooltip>
75+
) : (<></>) }
6276
</ControlGroup>
6377
</>
6478
);

‎embabel-database-ui/src/components/layout/AppData.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ function AppData() {
3333
<p>{formatDate(lastUpdated)}</p>
3434
<p><strong>Version:</strong></p>
3535
<p> v{version}</p>
36+
<p><a href="https://github.com/embabel" target="_blank"><img src="/github-mark-white.svg" style={{height: "20px"}}/></a></p>
3637
</div>
3738
</>
3839
);

‎embabel-database-ui/vite.config.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,18 @@
11
import { defineConfig } from 'vite'
22
import react from '@vitejs/plugin-react-swc'
33
import { mockDevServerPlugin } from 'vite-plugin-mock-dev-server'
4+
import { resolve } from 'path'
45

56
// https://vite.dev/config/
67
export default defineConfig({
78
plugins: [
89
react(),
910
mockDevServerPlugin()
1011
],
12+
build: {
13+
outDir: resolve(__dirname, '../embabel-database-server/src/main/resources/static'),
14+
emptyOutDir: true // ensures old builds are cleared
15+
},
1116
server: {
1217
proxy: {
1318
'^/api': 'http://embabel.com'

0 commit comments

Comments
 (0)