Skip to content

Commit febd150

Browse files
elijah-potterelijah-potter
committed
Created Dockerfile and fly config + fixed Flexbox issue
1 parent 309d840 commit febd150

16 files changed

+441
-54
lines changed

Diff for: ‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
target
2+
build

Diff for: ‎Dockerfile

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
FROM rust:latest as wasm-build
2+
3+
RUN mkdir -p /usr/build/
4+
WORKDIR /usr/build/
5+
6+
RUN curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh
7+
8+
COPY . .
9+
10+
WORKDIR /usr/build/harper-wasm
11+
RUN wasm-pack build --release
12+
13+
FROM node:slim as node-build
14+
15+
RUN mkdir -p /usr/build/
16+
WORKDIR /usr/build/
17+
18+
RUN mkdir harper-wasm
19+
20+
COPY --from=wasm-build /usr/build/harper-wasm/pkg /usr/build/harper-wasm/pkg
21+
COPY web web
22+
COPY alice.txt .
23+
24+
WORKDIR /usr/build/web
25+
26+
RUN yarn install && yarn build
27+
28+
FROM node:slim
29+
30+
COPY --from=node-build /usr/build/web/build /usr/build/web/build
31+
COPY --from=node-build /usr/build/web/package.json /usr/build/web/package.json
32+
COPY --from=node-build /usr/build/web/yarn.lock /usr/build/web/yarn.lock
33+
COPY --from=node-build /usr/build/web/node_modules /usr/build/web/node_modules
34+
35+
WORKDIR /usr/build/web
36+
37+
RUN yarn install
38+
39+
ENV HOST=0.0.0.0
40+
ENV PORT=3000
41+
42+
ENTRYPOINT ["node", "build"]

Diff for: ‎build.sh

-12
This file was deleted.

Diff for: ‎english_words.txt

-1
Original file line numberDiff line numberDiff line change
@@ -6841,7 +6841,6 @@ aionial
68416841
ayont
68426842
ayous
68436843
air
6844-
aira
68456844
airable
68466845
airampo
68476846
airan

Diff for: ‎fly.toml

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
app = "writewithharper"
2+
primary_region = "den"
3+
4+
[build]
5+
6+
[http_service]
7+
internal_port = 3000
8+
force_https = true
9+
auto_stop_machines = true
10+
auto_start_machines = true
11+
min_machines_running = 1
12+
processes = ["app"]
13+
14+
[[vm]]
15+
cpu_kind = "shared"
16+
cpus = 1
17+
memory_mb = 256

Diff for: ‎harper-wasm/Cargo.toml

+4
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ edition = "2021"
66
[lib]
77
crate-type = ["cdylib", "rlib"]
88

9+
[profile.release]
10+
opt-level = "s"
11+
strip = true
12+
913
[dependencies]
1014
console_error_panic_hook = "0.1.7"
1115
tracing = "0.1.40"

Diff for: ‎web/.dockerignore

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.env
7+
.env.*
8+
!.env.example
9+
vite.config.js.timestamp-*
10+
vite.config.ts.timestamp-*

Diff for: ‎web/package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@
1212
"format": "prettier --plugin-search-dir . --write ."
1313
},
1414
"devDependencies": {
15-
"@sveltejs/adapter-auto": "^2.0.0",
15+
"@flydotio/dockerfile": "^0.5.0",
16+
"@sveltejs/adapter-node": "^3.0.0",
1617
"@sveltejs/kit": "^1.20.4",
1718
"@typescript-eslint/eslint-plugin": "^6.0.0",
1819
"@typescript-eslint/parser": "^6.0.0",

Diff for: ‎web/src/app.css

+24-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
position: relative;
1717
}
1818

19-
.underlinespecial:after {
19+
.underlinespecial::after {
2020
transition-property: all;
2121
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2222
transition-duration: 150ms;
@@ -30,3 +30,26 @@
3030
bottom: -3px;
3131
left: 0;
3232
}
33+
34+
textarea {
35+
--tw-ring-shadow: 0 0 #000 !important;
36+
}
37+
38+
.animate-bigbounce{
39+
animation: bigbounce 1s infinite;
40+
}
41+
42+
.animate-after-bigbounce::after {
43+
animation: bigbounce 1s infinite;
44+
}
45+
46+
@keyframes bigbounce {
47+
0%, 100% {
48+
transform: translateY(-40%);
49+
animation-timing-function: cubic-bezier(0.8,0,1,1);
50+
}
51+
50% {
52+
transform: none;
53+
animation-timing-function: cubic-bezier(0,0,0.2,1);
54+
}
55+
}

Diff for: ‎web/src/app.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
%sveltekit.head%
99
</head>
1010

11-
<body data-sveltekit-preload-data="hover">
12-
<div style="display: contents">%sveltekit.body%</div>
11+
<body data-sveltekit-preload-data="hover" class="m-0 p-0 w-full h-full">
12+
<div style="display: contents" class="m-0 p-0 w-full h-full">%sveltekit.body%</div>
1313
</body>
1414

1515
</html>

Diff for: ‎web/src/lib/Editor.svelte

+32-20
Original file line numberDiff line numberDiff line change
@@ -10,26 +10,36 @@
1010
1111
let lints: Lint[] = [];
1212
let focused: number | undefined;
13+
let editor: HTMLTextAreaElement | null;
1314
1415
$: lintText(content).then((newLints) => (lints = newLints));
16+
$: boxHeight = calcHeight(content);
1517
16-
$: console.log(focused);
18+
function calcHeight(boxContent: string): number {
19+
let numberOfLineBreaks = (boxContent.match(/\n/g) || []).length;
20+
let newHeight = 20 + numberOfLineBreaks * 30 + 12 + 2;
21+
console.log(newHeight);
22+
return newHeight;
23+
}
1724
</script>
1825

19-
<div class="flex flex-row w-full h-full [&>*]:m-5">
20-
<Card class="flex-auto max-w-full p-5 grid z-10 text-lg overflow-auto">
26+
<div class="flex flex-row w-full h-full p-5">
27+
<Card
28+
class="flex-grow h-full p-5 grid z-10 max-w-full text-lg overflow-auto mr-5"
29+
on:click={() => editor && editor.focus()}
30+
>
2131
<div class="m-0 p-0" style="grid-row: 1; grid-column: 1">
2232
<Underlines {content} focusLintIndex={focused} />
2333
</div>
2434
<textarea
25-
class="w-full m-0 rounded-none p-0 z-0 bg-transparent border-none text-lg resize-none"
26-
rows={content.length - content.replaceAll('\n', '').length + 1}
35+
bind:this={editor}
36+
class="w-full m-0 rounded-none p-0 z-0 bg-transparent border-none text-lg resize-none focus:border-0"
2737
spellcheck="false"
28-
style="grid-row: 1; grid-column: 1"
38+
style={`grid-row: 1; grid-column: 1; height: ${boxHeight}px`}
2939
bind:value={content}
3040
></textarea>
3141
</Card>
32-
<Card class="flex flex-col flex-grow overflow-auto h-full">
42+
<Card class="flex flex-col flex-none basis-[400px] overflow-auto h-full">
3343
<h2 class="text-2xl font-bold m-1">Suggestions</h2>
3444
{#each lints as lint, i}
3545
<Card class="m-1 hover:translate-x-3 transition-all" on:click={() => (focused = i)}>
@@ -49,19 +59,21 @@
4959
>
5060
<p style="height: 50px">{lint.message}</p>
5161
{#each lint.suggestions as suggestion}
52-
<Button
53-
color="primary"
54-
class="w-full mb-1"
55-
style="height: 40px; margin: 5px 0px;"
56-
on:click={() =>
57-
applySuggestion(content, suggestion, lint.span).then(
58-
(edited) => (content = edited)
59-
)}
60-
>
61-
Replace "{content.substring(lint.span.start, lint.span.end)}" with "{suggestion.ReplaceWith.reduce(
62-
(p, c) => p + c
63-
)}"
64-
</Button>
62+
<div class="w-full p-[4px]">
63+
<Button
64+
color="primary"
65+
class="w-full"
66+
style="height: 40px; margin: 5px 0px;"
67+
on:click={() =>
68+
applySuggestion(content, suggestion, lint.span).then(
69+
(edited) => (content = edited)
70+
)}
71+
>
72+
Replace "{content.substring(lint.span.start, lint.span.end)}" with "{suggestion.ReplaceWith.reduce(
73+
(p, c) => p + c
74+
)}"
75+
</Button>
76+
</div>
6577
{/each}
6678
</div>
6779
</div>

Diff for: ‎web/src/lib/Underlines.svelte

+3-3
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
let lintContent = [
5353
spanContent(lint.span, content).replaceAll(' ', '\u00A0'),
5454
'red',
55-
lintIndex === focusLintIndex ? '4px' : '2px'
55+
lintIndex === focusLintIndex
5656
];
5757
5858
return [...prevContent, lintContent];
@@ -88,8 +88,8 @@
8888
{:else}
8989
<span style={`margin-right: -4px;`}>
9090
<span
91-
class="underlinespecial"
92-
style={`--bg-color: ${chunk[1]}; --line-width: ${chunk[2]};`}
91+
class={`underlinespecial ${chunk[2] ? 'animate-after-bigbounce' : ''}`}
92+
style={`--bg-color: ${chunk[1]}; --line-width: ${chunk[2] ? '4px' : '2px'};`}
9393
>
9494
{chunk[0]}
9595
</span>

Diff for: ‎web/src/routes/+page.svelte

+3-3
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
import Editor from '$lib/Editor.svelte';
33
</script>
44

5-
<div class="w-full h-screen flex flex-col items-center">
6-
<div class="p-24">
5+
<div class="w-full h-screen flex flex-col items-center m-0 p-0">
6+
<div class="p-8 flex-initial">
77
<h1 class="text-5xl font-bold text-center">Hi. I'm Harper.</h1>
88
<h2 class="text-3xl text-center">The Grammar Checker for Artists</h2>
99
<h2 class="text-2xl font-light italic text-center">Private. Free. Unobtrusive.</h2>
@@ -16,7 +16,7 @@
1616
>
1717
</div>
1818
</div>
19-
<div class="w-full 2xl:w-3/4 h-1/2">
19+
<div class="w-full 2xl:w-3/4 flex-shrink flex-grow overflow-hidden">
2020
<Editor />
2121
</div>
2222
</div>

Diff for: ‎web/svelte.config.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
1-
import adapter from '@sveltejs/adapter-auto';
1+
import adapter from '@sveltejs/adapter-node';
22
import { vitePreprocess } from '@sveltejs/kit/vite';
33

44
/** @type {import('@sveltejs/kit').Config} */
55
const config = {
66
preprocess: vitePreprocess(),
77

88
kit: {
9-
adapter: adapter()
9+
adapter: adapter({
10+
out: 'build'
11+
})
1012
}
1113
};
1214

Diff for: ‎web/tailwind.config.js

-3
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,8 @@ export default {
33
'./src/**/*.{html,js,svelte,ts}',
44
'./node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}'
55
],
6-
76
plugins: [require('flowbite/plugin')],
8-
97
darkMode: 'class',
10-
118
theme: {
129
extend: {
1310
colors: {

0 commit comments

Comments
 (0)