refactor: remove the deprecated web resource configuration and use the script component (#81)

.env.dev

@@ -1,2 +1,2 @@
-DATABASE_URL=postgres://app:app@localhost:5432/todo_baggins
+DATABASE_URL=postgres://app:app@db/todo_baggins
 LANGUAGE_CODE=en-US

.gitignore

@@ -8,3 +8,5 @@
 
 .env
 .env.prod
+
+docker-compose.yaml

.idea/icon.svg

@@ -0,0 +1,203 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="512"
+   height="512"
+   viewBox="0 0 512 512"
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="icon.svg"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="px"
+     inkscape:zoom="1.1020922"
+     inkscape:cx="188.27826"
+     inkscape:cy="204.15715"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs1">
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect2"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect1"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+  </defs>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="display:inline;fill:#27272a;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+       id="rect1"
+       width="512"
+       height="512"
+       x="0"
+       y="0"
+       sodipodi:insensitive="true"
+       inkscape:label="background"
+       ry="128.00018"
+       sodipodi:type="rect"
+       rx="129.98714" />
+    <g
+       id="g17"
+       inkscape:label="logo"
+       transform="translate(8)">
+      <g
+         id="g8"
+         inkscape:label="ring">
+        <g
+           id="g7"
+           inkscape:label="back">
+          <circle
+             style="fill:#d97706;fill-opacity:1;stroke:#d97706;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="path1"
+             cx="224"
+             cy="256"
+             r="128"
+             inkscape:label="ring back" />
+          <rect
+             style="fill:#d97706;fill-opacity:1;stroke:none;stroke-width:21.8936;stroke-dasharray:none;stroke-opacity:1"
+             id="rect2"
+             width="48"
+             height="288"
+             x="224"
+             y="112"
+             inkscape:label="rect2" />
+        </g>
+        <g
+           id="g1"
+           transform="translate(-4.163147,-0.69235229)"
+           inkscape:label="front">
+          <circle
+             style="fill:#27272a;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="path1-5-2"
+             cx="276.16315"
+             cy="256.69235"
+             r="128" />
+          <circle
+             style="fill:none;fill-opacity:1;stroke:#fbbf24;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="path1-5"
+             cx="276.16315"
+             cy="256.69235"
+             r="128" />
+        </g>
+      </g>
+      <g
+         id="g16"
+         inkscape:label="tick"
+         transform="translate(16.000231,-8.3918418e-5)">
+        <g
+           id="g6"
+           transform="rotate(45,-57.96574,415.4208)"
+           style="fill:#d97706;fill-opacity:1;stroke:none;stroke-opacity:1"
+           inkscape:label="back">
+          <rect
+             style="fill:#d97706;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="rect9"
+             width="32.000458"
+             height="32"
+             x="273.94067"
+             y="210.74516"
+             transform="rotate(-45,-57.96574,415.4208)" />
+          <rect
+             style="fill:#d97706;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="rect8"
+             width="32.000458"
+             height="32"
+             x="206.05841"
+             y="233.37257"
+             transform="rotate(-45,-57.96574,415.4208)" />
+          <rect
+             style="fill:#d97706;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="rect7"
+             height="16"
+             x="228.686"
+             y="285.255"
+             width="32"
+             transform="rotate(-45,-57.96574,415.4208)" />
+          <rect
+             style="fill:#d97706;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="rect5"
+             width="64"
+             height="32"
+             x="0"
+             y="100" />
+          <rect
+             style="fill:#d97706;fill-opacity:1;stroke:none;stroke-width:39.1918;stroke-dasharray:none;stroke-opacity:1"
+             id="rect6"
+             width="32"
+             height="96"
+             x="32"
+             y="36" />
+        </g>
+        <g
+           id="g4"
+           transform="rotate(45,-41.965512,454.04877)"
+           style="fill:#fbbf24;fill-opacity:1;stroke:none;stroke-opacity:1"
+           inkscape:label="front">
+          <rect
+             style="fill:#fbbf24;fill-opacity:1;stroke:none;stroke-width:32;stroke-dasharray:none;stroke-opacity:1"
+             id="rect3"
+             width="64"
+             height="32"
+             x="0"
+             y="100" />
+          <rect
+             style="fill:#fbbf24;fill-opacity:1;stroke:none;stroke-width:39.1918;stroke-dasharray:none;stroke-opacity:1"
+             id="rect4"
+             width="32"
+             height="96"
+             x="32"
+             y="36" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

Cargo.lock

@@ -3677,15 +3677,6 @@ version = "0.1.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ff011a302c396a5197692431fc1948019154afc178baf7d8e37367442a4601cf"
 
-[[package]]
-name = "openssl-src"
-version = "300.4.1+3.4.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "faa4eac4138c62414b5622d1b31c5c304f34b406b013c079c2bbc652fdd6678c"
-dependencies = [
- "cc",
-]
-
 [[package]]
 name = "openssl-sys"
 version = "0.9.104"
@@ -3694,7 +3685,6 @@ checksum = "45abf306cbf99debc8195b66b7346498d7b10c210de50418b5ccd7ceba08c741"
 dependencies = [
  "cc",
  "libc",
- "openssl-src",
  "pkg-config",
  "vcpkg",
 ]
@@ -5143,7 +5133,6 @@ dependencies = [
  "dioxus-query",
  "dotenvy",
  "feruca",
- "openssl",
  "serde",
  "serde_json",
  "serde_with",

Cargo.toml

@@ -1,7 +1,7 @@
 [package]
 name = "todo-baggins"
 version = "0.1.0"
-authors = ["Matouš Volf <66163112+matous-volf@users.noreply.github.com>"]
+authors = ["Matouš Volf <git@matousvolf.cz>"]
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
@@ -22,22 +22,21 @@ diesel_migrations = { version = "2.2.0", features = ["postgres"], optional = tru
 dotenvy = { version = "0.15.7", optional = true }
 time = { version = "0.3.36", optional = true }
 
-async-std = { version = "1.12.0" }
-dioxus-i18n = { version = "0.3.0" }
-dioxus-query = { version = "0.6.0" }
-voca_rs = { version = "1.15.2" }
-
-[target.'cfg(target_os = "android")'.dependencies]
-openssl = { version = "0.10", features = ["vendored"] }
+async-std = { version = "1.12.0", optional = true }
+dioxus-i18n = { version = "0.3.0", optional = true }
+dioxus-query = { version = "0.6.0", optional = true }
+voca_rs = { version = "1.15.2", optional = true }
 
 [features]
-default = ["mobile"]
+default = ["web"]
 desktop = ["dioxus/desktop"]
-mobile = [
-    "dioxus/mobile",
-]
+mobile = ["dioxus/mobile"]
 web = [
     "dioxus/web",
+    "dep:async-std",
+    "dep:dioxus-query",
+    "dep:dioxus-i18n",
+    "dep:voca_rs"
 ]
 server = [
     "dioxus/server",

Dioxus.toml

@@ -25,18 +25,3 @@ reload_html = true
 
 # which files or dirs will be watcher monitoring
 watch_path = ["src", "assets"]
-
-# include `assets` in web platform
-[web.resource]
-
-# CSS style file
-style = []
-
-# Javascript code file
-script = ["https://kit.fontawesome.com/3c1b409f8f.js"]
-
-[web.resource.dev]
-
-# Javascript code file
-# serve: [dev-server] only
-script = []

docker/dev/app/supervisord.conf

@@ -13,11 +13,11 @@ stdout_logfile=/dev/fd/1
 stdout_logfile_maxbytes=0
 redirect_stderr=true
 
-# [program:dx]
-# command=dx serve --addr 0.0.0.0 --port 8000
-# directory=/srv/app
-# autostart=true
-# autorestart=true
-# stdout_logfile=/dev/fd/1
-# stdout_logfile_maxbytes=0
-# redirect_stderr=true
+[program:dx]
+command=dx serve --addr 0.0.0.0 --port 8000
+directory=/srv/app
+autostart=true
+autorestart=true
+stdout_logfile=/dev/fd/1
+stdout_logfile_maxbytes=0
+redirect_stderr=true

src/components/app.rs

@@ -39,6 +39,7 @@ pub(crate) fn App() -> Element {
         document::Link { rel: "stylesheet", href: FONTS_CSS }
         document::Link { rel: "stylesheet", href: INPUT_NUMBER_ARROWS_CSS }
         document::Link { rel: "stylesheet", href: INPUT_RANGE_CSS }
+        document::Script { src: "https://kit.fontawesome.com/3c1b409f8f.js" }
 
         div {
             class: "min-h-screen text-zinc-200 bg-zinc-800 pt-4 pb-36",