Skip to content

Commit c6fc92d

Browse files
WenjiaoYuepre-commit-ci[bot]
WenjiaoYue
and
pre-commit-ci[bot]
authored
Add Text2Image UI, UI tests, Readme, and Docker support (#927)
Signed-off-by: Yue, Wenjiao <wenjiao.yue@intel.com> Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
1 parent c0643b7 commit c6fc92d

32 files changed

+1054
-0
lines changed

‎Text2Image/assets/img/text2img_init.png

29.3 KB
Loading

‎Text2Image/assets/img/text2img_response.png

178 KB
Loading

‎Text2Image/ui/docker/Dockerfile

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# Copyright (C) 2024 Intel Corporation
2+
# SPDX-License-Identifier: Apache-2.0
3+
4+
# Use node 20.11.1 as the base image
5+
FROM node:20.11.1
6+
7+
# Update package manager and install Git
8+
RUN apt-get update -y && apt-get install -y git
9+
10+
# Copy the front-end code repository
11+
COPY svelte /home/user/svelte
12+
13+
# Set the working directory
14+
WORKDIR /home/user/svelte
15+
16+
# Install front-end dependencies
17+
RUN npm install
18+
19+
# Build the front-end application
20+
RUN npm run build
21+
22+
# Expose the port of the front-end application
23+
EXPOSE 5173
24+
25+
# Run the front-end application in preview mode
26+
CMD ["npm", "run", "preview", "--", "--port", "5173", "--host", "0.0.0.0"]

‎Text2Image/ui/svelte/.editorconfig

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
[*]
2+
indent_style = tab
3+
4+
[package.json]
5+
indent_style = space
6+
indent_size = 2
7+
8+
[*.md]
9+
indent_style = space
10+
indent_size = 2

‎Text2Image/ui/svelte/.env

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
BASE_URL = '/v1/text2image'
2+

‎Text2Image/ui/svelte/.eslintignore

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example
9+
10+
# Ignore files for PNPM, NPM and YARN
11+
pnpm-lock.yaml
12+
package-lock.json
13+
yarn.lock

‎Text2Image/ui/svelte/.eslintrc.cjs

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
// Copyright (c) 2024 Intel Corporation
2+
//
3+
// Licensed under the Apache License, Version 2.0 (the "License");
4+
// you may not use this file except in compliance with the License.
5+
// You may obtain a copy of the License at
6+
//
7+
// http://www.apache.org/licenses/LICENSE-2.0
8+
//
9+
// Unless required by applicable law or agreed to in writing, software
10+
// distributed under the License is distributed on an "AS IS" BASIS,
11+
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
// See the License for the specific language governing permissions and
13+
// limitations under the License.
14+
15+
module.exports = {
16+
root: true,
17+
parser: "@typescript-eslint/parser",
18+
extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended", "prettier"],
19+
plugins: ["svelte3", "@typescript-eslint", "neverthrow"],
20+
ignorePatterns: ["*.cjs"],
21+
overrides: [{ files: ["*.svelte"], processor: "svelte3/svelte3" }],
22+
settings: {
23+
"svelte3/typescript": () => require("typescript"),
24+
},
25+
parserOptions: {
26+
sourceType: "module",
27+
ecmaVersion: 2020,
28+
},
29+
env: {
30+
browser: true,
31+
es2017: true,
32+
node: true,
33+
},
34+
};

‎Text2Image/ui/svelte/.prettierignore

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example
9+
10+
# Ignore files for PNPM, NPM and YARN
11+
pnpm-lock.yaml
12+
package-lock.json
13+
yarn.lock

‎Text2Image/ui/svelte/.prettierrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{"pluginSearchDirs": ["."], "overrides": [{"files": "*.svelte", "options": {"parser": "svelte"}}]}

‎Text2Image/ui/svelte/README.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# Text2Image Customized UI
2+
3+
## 📸 Project Screenshots
4+
5+
![project-screenshot](../../assets/img/text2img_init.png)
6+
![project-screenshot](../../assets/img/text2img_response.png)
7+
8+
## 🧐 Features
9+
10+
Here're some of the project's features:
11+
12+
- Generate Images from Text: Enter the image description and the desired number of images, then wait for them to be generated.
13+
14+
## 🛠️ Get it Running
15+
16+
1. Clone the repo.
17+
18+
2. cd command to the current folder.
19+
20+
3. Modify the required .env variables.
21+
22+
```
23+
BACKEND_BASE_URL = ''
24+
25+
```
26+
27+
4. Execute `npm install` to install the corresponding dependencies.
28+
29+
5. Execute `npm run dev` in both environments

‎Text2Image/ui/svelte/package.json

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
{
2+
"name": "sveltekit-auth-example",
3+
"version": "0.0.1",
4+
"private": true,
5+
"scripts": {
6+
"dev": "vite dev",
7+
"build": "vite build",
8+
"preview": "vite preview",
9+
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
10+
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
11+
"lint": "prettier --check . && eslint .",
12+
"format": "prettier --write ."
13+
},
14+
"devDependencies": {
15+
"@fortawesome/free-solid-svg-icons": "6.2.0",
16+
"@playwright/test": "^1.48.0",
17+
"@sveltejs/adapter-auto": "1.0.0-next.75",
18+
"@sveltejs/adapter-static": "^3.0.0",
19+
"@sveltejs/kit": "^2.0.0",
20+
"@tailwindcss/typography": "0.5.7",
21+
"@types/debug": "4.1.7",
22+
"@types/node": "^20.12.13",
23+
"@typescript-eslint/eslint-plugin": "^5.27.0",
24+
"@typescript-eslint/parser": "^5.27.0",
25+
"autoprefixer": "^10.4.7",
26+
"daisyui": "3.5.1",
27+
"date-picker-svelte": "^2.6.0",
28+
"debug": "4.3.4",
29+
"eslint": "^8.16.0",
30+
"eslint-config-prettier": "^8.3.0",
31+
"eslint-plugin-neverthrow": "1.1.4",
32+
"postcss": "^8.4.31",
33+
"postcss-load-config": "^4.0.1",
34+
"postcss-preset-env": "^8.3.2",
35+
"prettier": "^2.8.8",
36+
"prettier-plugin-svelte": "^2.7.0",
37+
"prettier-plugin-tailwindcss": "^0.3.0",
38+
"svelte": "^4.0.0",
39+
"svelte-check": "^3.0.0",
40+
"svelte-fa": "3.0.3",
41+
"svelte-preprocess": "^6.0.2",
42+
"tailwindcss": "^3.1.5",
43+
"tslib": "^2.3.1",
44+
"typescript": "^5.0.0",
45+
"vite": "^5.0.0"
46+
},
47+
"type": "module",
48+
"dependencies": {
49+
"date-fns": "^2.30.0",
50+
"driver.js": "^1.3.0",
51+
"flowbite-svelte": "^0.38.5",
52+
"flowbite-svelte-icons": "^1.4.0",
53+
"fuse.js": "^6.6.2",
54+
"lodash": "^4.17.21",
55+
"playwright": "^1.44.0",
56+
"ramda": "^0.29.0",
57+
"sse.js": "^0.6.1",
58+
"svelte-notifications": "^0.9.98",
59+
"svrollbar": "^0.12.0"
60+
}
61+
}

‎Text2Image/ui/svelte/playwright.config.ts

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
// Copyright (C) 2024 Intel Corporation
2+
// SPDX-License-Identifier: Apache-2.0
3+
4+
import { defineConfig, devices } from "@playwright/test";
5+
6+
/**
7+
* Read environment variables from file.
8+
* https://github.com/motdotla/dotenv
9+
*/
10+
// require('dotenv').config();
11+
12+
/**
13+
* See https://playwright.dev/docs/test-configuration.
14+
*/
15+
export default defineConfig({
16+
testDir: "./tests",
17+
/* Maximum time one test can run for. */
18+
timeout: 10 * 60 * 1000,
19+
expect: {
20+
/**
21+
* Maximum time expect() should wait for the condition to be met.
22+
* For example in `await expect(locator).toHaveText();`
23+
*/
24+
timeout: 5000,
25+
},
26+
/* Run tests in files in parallel */
27+
fullyParallel: true,
28+
/* Fail the build on CI if you accidentally left test.only in the source code. */
29+
forbidOnly: !!process.env.CI,
30+
/* Retry on CI only */
31+
retries: process.env.CI ? 2 : 0,
32+
/* Opt out of parallel tests on CI. */
33+
workers: process.env.CI ? 1 : undefined,
34+
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
35+
reporter: [["html", { open: "never" }]],
36+
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
37+
use: {
38+
/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
39+
actionTimeout: 0,
40+
/* Base URL to use in actions like `await page.goto('/')`. */
41+
baseURL: "http://localhost:5173",
42+
43+
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
44+
trace: "on-first-retry",
45+
},
46+
47+
/* Configure projects for major browsers */
48+
projects: [
49+
{
50+
name: "webkit",
51+
use: { ...devices["Desktop Safari"] },
52+
},
53+
],
54+
});

‎Text2Image/ui/svelte/postcss.config.cjs

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
// Copyright (c) 2024 Intel Corporation
2+
//
3+
// Licensed under the Apache License, Version 2.0 (the "License");
4+
// you may not use this file except in compliance with the License.
5+
// You may obtain a copy of the License at
6+
//
7+
// http://www.apache.org/licenses/LICENSE-2.0
8+
//
9+
// Unless required by applicable law or agreed to in writing, software
10+
// distributed under the License is distributed on an "AS IS" BASIS,
11+
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
// See the License for the specific language governing permissions and
13+
// limitations under the License.
14+
15+
const tailwindcss = require("tailwindcss");
16+
const autoprefixer = require("autoprefixer");
17+
18+
const config = {
19+
plugins: [
20+
//Some plugins, like tailwindcss/nesting, need to run before Tailwind,
21+
tailwindcss(),
22+
//But others, like autoprefixer, need to run after,
23+
autoprefixer,
24+
],
25+
};
26+
27+
module.exports = config;

‎Text2Image/ui/svelte/src/app.d.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// Copyright (c) 2024 Intel Corporation
2+
//
3+
// Licensed under the Apache License, Version 2.0 (the "License");
4+
// you may not use this file except in compliance with the License.
5+
// You may obtain a copy of the License at
6+
//
7+
// http://www.apache.org/licenses/LICENSE-2.0
8+
//
9+
// Unless required by applicable law or agreed to in writing, software
10+
// distributed under the License is distributed on an "AS IS" BASIS,
11+
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
// See the License for the specific language governing permissions and
13+
// limitations under the License.
14+
15+
// See: https://kit.svelte.dev/docs/types#app
16+
// import { Result} from "neverthrow";

‎Text2Image/ui/svelte/src/app.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!--
2+
Copyright (c) 2024 Intel Corporation
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
-->
16+
17+
<!doctype html>
18+
<html lang="en">
19+
<head>
20+
<meta charset="utf-8" />
21+
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
22+
<meta name="viewport" content="width=device-width" />
23+
%sveltekit.head%
24+
</head>
25+
<body>
26+
<div class="h-full w-full">%sveltekit.body%</div>
27+
</body>
28+
</html>

0 commit comments

Comments
 (0)