Skip to content

Initial UI #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Feb 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .github/workflows/test.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,10 @@ jobs:
test:
runs-on: ubuntu-22.04
steps:
- uses: actions/checkout@v3
- uses: actions/checkout@v4
with:
fetch-depth: 1
- uses: actions/setup-go@v4
- uses: actions/setup-go@v5
with:
cache: false
go-version: "1.21"
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
/bin
/.idea
/static/ui
16 changes: 16 additions & 0 deletions .vscode/launch.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Launch file",
"type": "go",
"request": "launch",
"mode": "debug",
"program": "main.go",
"args": ["--server"]
}
]
}
5 changes: 5 additions & 0 deletions Makefile
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
all: build-ui build

build-ui:
$(MAKE) -C ui

build:
CGO_ENABLED=0 go build -o bin/gptscript -tags "${GO_TAGS}" -ldflags "-s -w" .

Expand Down
17 changes: 16 additions & 1 deletion pkg/server/server.go
Original file line number Diff line number Diff line change
Expand Up @@ -234,6 +234,21 @@ func (s *Server) Connect(session *melody.Session) {
}

func (s *Server) ServeHTTP(rw http.ResponseWriter, req *http.Request) {
isUpgrade := strings.Contains(strings.ToLower(req.Header.Get("Connection")), "upgrade")
isBrowser := strings.Contains(strings.ToLower(req.Header.Get("User-Agent")), "mozilla")
isAjax := req.Header.Get("X-Requested-With") != ""

if req.URL.Path == "/" && isBrowser && !isAjax && !isUpgrade {
rw.Header().Set("Location", "/ui/")
rw.WriteHeader(302)
return
}

if req.URL.Path == "/favicon.ico" {
http.ServeFileFS(rw, req, static.UI, "/ui/favicon.ico")
return
}

if strings.HasPrefix(req.URL.Path, "/ui") {
path := req.URL.Path
if path == "/ui" || path == "/ui/" {
Expand All @@ -250,7 +265,7 @@ func (s *Server) ServeHTTP(rw http.ResponseWriter, req *http.Request) {
case http.MethodPost:
s.run(rw, req)
case http.MethodGet:
if req.URL.Path == "/" && strings.Contains(strings.ToLower(req.Header.Get("Connection")), "upgrade") {
if req.URL.Path == "/" && isUpgrade {
err := s.melody.HandleRequest(rw, req)
if err != nil {
http.Error(rw, err.Error(), http.StatusInternalServerError)
Expand Down
14 changes: 14 additions & 0 deletions ui/.ackrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
--ignore-dir=.git
--ignore-dir=.nuxt
--ignore-dir=.nuxt-prod
--ignore-dir=.nyc_output
--ignore-dir=.output
--ignore-dir=.vscode
--ignore-dir=coverage
--ignore-dir=dist
--ignore-dir=node_modules
--ignore-dir=tmp
--ignore-dir=vendor
--ignore-file=ext:svg
--ignore-file=is:selection.json
--ignore-file=is:yarn.lock
8 changes: 8 additions & 0 deletions ui/.dockerignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
node_modules
.nuxt
.nuxt-prod
.env
.nuxt
.nyc_output
coverage
node_modules
24 changes: 24 additions & 0 deletions ui/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# Nuxt dev/build outputs
.output
.data
.nuxt
.nitro
.cache
dist

# Node dependencies
node_modules

# Logs
logs
*.log

# Misc
.DS_Store
.fleet
.idea

# Local env files
.env
.env.*
!.env.example
58 changes: 58 additions & 0 deletions ui/.vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit"
},
"editor.detectIndentation": false,
"editor.insertSpaces": true,
"editor.quickSuggestions": {
"strings": true
},
"editor.tabSize": 2,
"eslint.format.enable": true,
"eslint.run": "onSave",
"eslint.validate": [
"vue",
"html",
"javascript",
"typescript"
],
"files.associations": {
"*.css": "tailwindcss"
},
"files.exclude": {
".ackrc": true,
".dockerignore": true,
".drone.yml": true,
".editorconfig": true,
".eslintcache": true,
".eslintignore": true,
".eslintrc.js": true,
".gitignore": true,
".nuxt*": true,
".nyc_output": true,
"babel.config.js": true,
"coverage": true,
"jsconfig.json": true,
"LICENSE": true,
"yarn-error.log": true
},
"javascript.preferences.importModuleSpecifier": "non-relative",
"prettier.enable": false,
"tailwindCSS.classAttributes": [
"class",
"className",
"ui"
],
"tailwindCSS.experimental.classRegex": [
[
"ui:\\s*{([^)]*)\\s*}",
"[\"'`]([^\"'`]*).*?[\"'`]"
],
[
"/\\*ui\\*/\\s*{([^;]*)}",
":\\s*[\"'`]([^\"'`]*).*?[\"'`]"
]
],
"tailwindCSS.experimental.configFile": "tailwind.config.ts",
"typescript.preferences.importModuleSpecifier": "non-relative"
}
25 changes: 25 additions & 0 deletions ui/Acornfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
args: {
// Number of replicas
replicas: 1

// API Endpoint
api: "https://localhost:9090/v1"
}

services: default: {
default: true
ports: ["80/http"]
container: "ui"
}

containers: ui: {
scale: args.replicas
build: context: "."

env: {
NUXT_PUBLIC_API: args.api
}

ports: publish: "80/http"
probes: "http://localhost/healthz"
}
19 changes: 19 additions & 0 deletions ui/Dockerfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
FROM node:18-alpine as builder
ENV NODE_OPTIONS --max_old_space_size=8192
WORKDIR /src
COPY package.json .
COPY yarn.lock .
RUN yarn --pure-lockfile install
COPY . .
ENV NUXT_PUBLIC_APP_VERSION=${NUXT_PUBLIC_APP_VERSION:-dev}
RUN yarn build

FROM node:18-alpine
ENV HOST 0.0.0.0
ENV PORT 80
EXPOSE 80
WORKDIR /src
COPY package.json .
COPY --from=builder /src/.output /src/.output
ENV NUXT_PUBLIC_APP_VERSION=${NUXT_PUBLIC_APP_VERSION:-dev}
CMD ["yarn","start"]
9 changes: 9 additions & 0 deletions ui/Makefile
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
build: clean
yarn
yarn generate
rm -rf ../static/ui/_nuxt
cp -rp .output/public/* ../static/ui/
touch ../static/ui/_nuxt/_placeholder

clean:
yarn clean
25 changes: 25 additions & 0 deletions ui/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
# GPTScript UI

Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.

## Setup

```bash
yarn install
```

## Development Server

Start the development server on `http://localhost:9091`:

```bash
yarn dev
```

## Production

Build the application for embedding into GPTScript:

```bash
yarn run generate
```
6 changes: 6 additions & 0 deletions ui/app.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default defineAppConfig({
ui: {
primary: 'slate',
gray: 'cool',
},
})
54 changes: 54 additions & 0 deletions ui/app.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
<script lang="ts" setup>
import '@/styles/app.scss'

const sock = useSocket()
</script>
<template>
<div class="root bg-slate-100 dark:bg-slate-950">
<nav class="bg-slate-200 dark:bg-slate-900">
<LeftNav />
</nav>
<aside class="bg-slate-200 dark:bg-slate-900">
<ThemeToggle />
{{sock.status}}
</aside>
<main>
<NuxtPage />
</main>
</div>
</template>

<style lang="scss" scoped>
.root {
--nav-width: 300px;
--aside-height: 50px;

display: grid;
grid-template-areas: "nav main"
"aside main";
grid-template-columns: var(--nav-width) 1fr;
grid-template-rows: 1fr var(--aside-height);
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;

NAV {
grid-area: nav;
overflow: auto;
}

ASIDE {
grid-area: aside;
line-height: var(--aside-height);
}

MAIN {
grid-area: main;
overflow: auto;
position: relative;
padding: 1rem;
}
}
</style>
Loading