Initial App

.devcontainer/Dockerfile

@@ -0,0 +1,47 @@
+FROM mcr.microsoft.com/devcontainers/base:jammy
+
+RUN apt update 
+RUN apt install -y git curl inotify-tools wget 
+
+# Erlang Deps
+RUN apt-get -y install build-essential autoconf m4 libncurses5-dev libwxgtk3.0-gtk3-dev libwxgtk-webview3.0-gtk3-dev libgl1-mesa-dev libglu1-mesa-dev libpng-dev libssh-dev unixodbc-dev xsltproc fop libxml2-utils libncurses-dev openjdk-11-jdk
+
+# Install Postgres
+ENV PGUSER=postgres
+ENV PGHOST=127.0.0.1
+RUN sudo sh -c 'echo "deb https://apt.postgresql.org/pub/repos/apt $(lsb_release -cs)-pgdg main" > /etc/apt/sources.list.d/pgdg.list'
+RUN curl -fsSL https://www.postgresql.org/media/keys/ACCC4CF8.asc|sudo gpg --dearmor -o /etc/apt/trusted.gpg.d/postgresql.gpg
+RUN apt update
+RUN apt install -y postgresql-16
+# Postgres from anywhere!
+RUN sh -c 'echo "host all all all trust" > /etc/postgresql/16/main/pg_hba.conf'
+
+# Install ASDF
+RUN git clone https://github.com/asdf-vm/asdf.git /opt/asdf --branch v0.13.1
+
+# install Fly
+RUN curl -L https://fly.io/install.sh | sudo -u vscode sh
+RUN sh -c 'echo "export FLYCTL_INSTALL=/home/vscode/.fly" >> /home/vscode/.bashrc'
+RUN sh -c 'echo "export PATH=\"/home/vscode/.fly/bin:$PATH\"" >> /home/vscode/.bashrc'
+
+# install Elixir and Erlang
+ARG ELIXIR_VERSION=1.16.0
+ARG ERLANG_VERSION=26.2.1
+RUN sh -c 'echo "source /opt/asdf/asdf.sh" >> /home/vscode/.bashrc'
+RUN sudo -u vscode bash -c 'source /opt/asdf/asdf.sh && asdf plugin-add erlang https://github.com/asdf-vm/asdf-erlang.git'
+RUN sudo -u vscode bash -c "source /opt/asdf/asdf.sh && asdf install erlang $ERLANG_VERSION && asdf global erlang $ERLANG_VERSION"
+RUN sudo -u vscode bash -c 'source /opt/asdf/asdf.sh && asdf plugin-add elixir https://github.com/asdf-vm/asdf-elixir.git'
+RUN sudo -u vscode bash -c "source /opt/asdf/asdf.sh && asdf install elixir $ELIXIR_VERSION && asdf global elixir $ELIXIR_VERSION"
+
+# install NodeJS and Yarn
+ARG NODEJS_VERSION=21.6.1
+RUN sudo -u vscode bash -c 'source /opt/asdf/asdf.sh && asdf plugin-add nodejs https://github.com/asdf-vm/asdf-nodejs.git'
+RUN sudo -u vscode bash -c "source /opt/asdf/asdf.sh && asdf install nodejs $NODEJS_VERSION && asdf global nodejs $NODEJS_VERSION"
+RUN sudo -u vscode bash -c 'source /opt/asdf/asdf.sh && npm install --global yarn'
+
+# locale
+ENV LANG en_US.UTF-8
+ENV LC_ALL en_US.UTF-8
+ENV LANGUAGE en_US:en
+
+CMD ["/bin/bash"]

.devcontainer/devcontainer.json

@@ -0,0 +1,22 @@
+{
+	"name": "Ubuntu",
+	"build": {"dockerfile": "Dockerfile"},
+	"postCreateCommand": ". .devcontainer/init.sh",
+	"forwardPorts": [4000, 5432],
+
+	"customizations": {
+        "vscode": {
+            "extensions": [
+				"github.codespaces",
+				"tamasfe.even-better-toml",
+				"phoenixframework.phoenix",
+				"JakeBecker.elixir-ls",
+				"mechatroner.rainbow-csv",
+				"Arsen.darcula-theme-for-elixir",
+				"bradlc.vscode-tailwindcss",
+				"ms-azuretools.vscode-docker",
+				"ckolkman.vscode-postgres"
+			]
+        }
+	}
+}

.devcontainer/init.sh

@@ -0,0 +1,3 @@
+sudo service postgresql start
+cd assets && yarn install && cd ..
+mix setup

.formatter.exs

@@ -0,0 +1,6 @@
+[
+  import_deps: [:ecto, :ecto_sql, :phoenix],
+  subdirectories: ["priv/*/migrations"],
+  plugins: [Phoenix.LiveView.HTMLFormatter],
+  inputs: ["*.{heex,ex,exs}", "{config,lib,test}/**/*.{heex,ex,exs}", "priv/*/seeds.exs"]
+]

.github/workflows/fly.yml

@@ -0,0 +1,37 @@
+name: Fly Deploy
+on:
+  push:
+    branches:
+      - main
+jobs:
+
+  test:
+    name: Test
+    runs-on: ubuntu-latest
+    services:
+      db:
+        image: postgres:latest
+        ports: ['5432:5432']
+        env:
+          POSTGRES_PASSWORD: postgres
+        options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5
+    steps:
+      - uses: actions/checkout@v2
+      - uses: erlef/setup-beam@v1
+        with:
+          otp-version: '26.2.1'
+          elixir-version: '1.16.0'
+      - run: mix deps.get
+      - run: mix test
+
+  deploy:
+    name: Deploy app
+    runs-on: ubuntu-latest
+    needs: 
+      - test
+    steps:
+      - uses: actions/checkout@v3
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}

.gitignore

@@ -0,0 +1,37 @@
+# The directory Mix will write compiled artifacts to.
+/_build/
+
+# If you run "mix test --cover", coverage assets end up here.
+/cover/
+
+# The directory Mix downloads your dependencies sources to.
+/deps/
+
+# Where 3rd-party dependencies like ExDoc output generated docs.
+/doc/
+
+# Ignore .fetch files in case you like to edit your project deps locally.
+/.fetch
+
+# If the VM crashes, it generates a dump, let's ignore it too.
+erl_crash.dump
+
+# Also ignore archive artifacts (built via "mix archive.build").
+*.ez
+
+# Temporary files, for example, from tests.
+/tmp/
+
+# Ignore package tarball (built via "mix hex.build").
+multi_tenant-*.tar
+
+# Ignore assets that are produced by build tools.
+/priv/static/assets/
+
+# Ignore digested assets cache.
+/priv/static/cache_manifest.json
+
+# In case you use Node.js/npm, you want to ignore these.
+npm-debug.log
+/assets/node_modules/
+

.vscode/launch.json

@@ -0,0 +1,31 @@
+{
+    // 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": [
+        {
+            "type": "mix_task",
+            "name": "mix (Default task)",
+            "request": "launch",
+            "exitAfterTaskReturns": false,
+            "task": "phx.server",
+            "projectDir": "${workspaceRoot}"
+        },
+        {
+            "type": "mix_task",
+            "name": "mix test",
+            "request": "launch",
+            "task": "test",
+            "taskArgs": [
+                "--trace"
+            ],
+            "startApps": true,
+            "projectDir": "${workspaceRoot}",
+            "requireFiles": [
+                "test/**/test_helper.exs",
+                "test/**/*_test.exs"
+            ]
+        }
+    ]
+}

.vscode/settings.json

@@ -0,0 +1,52 @@
+{
+    "workbench.startupEditor": "newUntitledFile",
+    "files.associations": {
+      "*.csv": "plaintext",
+      "*.heex": "phoenix-heex"
+    },
+    "editor.columnSelection": false,
+    "redhat.telemetry.enabled": false,
+    "[xml]": {
+      "editor.defaultFormatter": "redhat.vscode-xml"
+    },
+    "git.confirmSync": false,
+    "editor.inlineSuggest.enabled": true,
+    "[markdown]": {
+      "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "workbench.colorTheme": "Darcula theme for Elixir",
+
+    "elixirLS.suggestSpecs": false,
+    "elixirLS.dialyzerEnabled": true,
+    "elixirLS.signatureAfterComplete": false,
+    "elixirLS.fetchDeps": false,
+
+    "files.exclude": {
+      "**/_build": true,
+      "**/deps": true,
+      "**/priv/static": true,
+      "**/.elixir_ls": true
+    },
+
+    "[elixir]": {
+      "editor.formatOnSave": true,
+      "editor.defaultFormatter": "JakeBecker.elixir-ls"
+    },
+
+    "[phoenix-heex]": {
+      "editor.formatOnSave": true,
+      "editor.defaultFormatter": "JakeBecker.elixir-ls"
+    },
+
+    "emmet.includeLanguages": {
+      "elixir": "html",
+      "phoenix-heex": "html"
+    },
+    "emmet.triggerExpansionOnTab": true,
+    "tailwindCSS.includeLanguages": {
+      "phoenix-heex": "html",
+      "elixir": "html",
+    // ...
+    },
+  }
+

README.md

@@ -0,0 +1,18 @@
+# MultiTenant
+
+To start your Phoenix server:
+
+  * Run `mix setup` to install and setup dependencies
+  * Start Phoenix endpoint with `mix phx.server` or inside IEx with `iex -S mix phx.server`
+
+Now you can visit [`localhost:4000`](http://localhost:4000) from your browser.
+
+Ready to run in production? Please [check our deployment guides](https://hexdocs.pm/phoenix/deployment.html).
+
+## Learn more
+
+  * Official website: https://www.phoenixframework.org/
+  * Guides: https://hexdocs.pm/phoenix/overview.html
+  * Docs: https://hexdocs.pm/phoenix
+  * Forum: https://elixirforum.com/c/phoenix-forum
+  * Source: https://github.com/phoenixframework/phoenix

assets/css/app.css

@@ -0,0 +1,5 @@
+@import "tailwindcss/base";
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+
+/* This file is for your main application CSS */

assets/js/app.js

@@ -0,0 +1,41 @@
+// If you want to use Phoenix channels, run `mix help phx.gen.channel`
+// to get started and then uncomment the line below.
+// import "./user_socket.js"
+
+// You can include dependencies in two ways.
+//
+// The simplest option is to put them in assets/vendor and
+// import them using relative paths:
+//
+//     import "../vendor/some-package.js"
+//
+// Alternatively, you can `npm install some-package --prefix assets` and import
+// them using a path starting with the package name:
+//
+//     import "some-package"
+//
+
+// Include phoenix_html to handle method=PUT/DELETE in forms and buttons.
+import "phoenix_html"
+// Establish Phoenix Socket and LiveView configuration.
+import {Socket} from "phoenix"
+import {LiveSocket} from "phoenix_live_view"
+import topbar from "../vendor/topbar"
+
+let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
+let liveSocket = new LiveSocket("/live", Socket, {params: {_csrf_token: csrfToken}})
+
+// Show progress bar on live navigation and form submits
+topbar.config({barColors: {0: "#29d"}, shadowColor: "rgba(0, 0, 0, .3)"})
+window.addEventListener("phx:page-loading-start", _info => topbar.show(300))
+window.addEventListener("phx:page-loading-stop", _info => topbar.hide())
+
+// connect if there are any LiveViews on the page
+liveSocket.connect()
+
+// expose liveSocket on window for web console debug logs and latency simulation:
+// >> liveSocket.enableDebug()
+// >> liveSocket.enableLatencySim(1000)  // enabled for duration of browser session
+// >> liveSocket.disableLatencySim()
+window.liveSocket = liveSocket
+

assets/tailwind.config.js

@@ -0,0 +1,68 @@
+// See the Tailwind configuration guide for advanced usage
+// https://tailwindcss.com/docs/configuration
+
+const plugin = require("tailwindcss/plugin")
+const fs = require("fs")
+const path = require("path")
+
+module.exports = {
+  content: [
+    "./js/**/*.js",
+    "../lib/multi_tenant_web.ex",
+    "../lib/multi_tenant_web/**/*.*ex"
+  ],
+  theme: {
+    extend: {
+      colors: {
+        brand: "#FD4F00",
+      }
+    },
+  },
+  plugins: [
+    require("@tailwindcss/forms"),
+    // Allows prefixing tailwind classes with LiveView classes to add rules
+    // only when LiveView classes are applied, for example:
+    //
+    //     <div class="phx-click-loading:animate-ping">
+    //
+    plugin(({addVariant}) => addVariant("phx-no-feedback", [".phx-no-feedback&", ".phx-no-feedback &"])),
+    plugin(({addVariant}) => addVariant("phx-click-loading", [".phx-click-loading&", ".phx-click-loading &"])),
+    plugin(({addVariant}) => addVariant("phx-submit-loading", [".phx-submit-loading&", ".phx-submit-loading &"])),
+    plugin(({addVariant}) => addVariant("phx-change-loading", [".phx-change-loading&", ".phx-change-loading &"])),
+
+    // Embeds Heroicons (https://heroicons.com) into your app.css bundle
+    // See your `CoreComponents.icon/1` for more information.
+    //
+    plugin(function({matchComponents, theme}) {
+      let iconsDir = path.join(__dirname, "./vendor/heroicons/optimized")
+      let values = {}
+      let icons = [
+        ["", "/24/outline"],
+        ["-solid", "/24/solid"],
+        ["-mini", "/20/solid"]
+      ]
+      icons.forEach(([suffix, dir]) => {
+        fs.readdirSync(path.join(iconsDir, dir)).forEach(file => {
+          let name = path.basename(file, ".svg") + suffix
+          values[name] = {name, fullPath: path.join(iconsDir, dir, file)}
+        })
+      })
+      matchComponents({
+        "hero": ({name, fullPath}) => {
+          let content = fs.readFileSync(fullPath).toString().replace(/\r?\n|\r/g, "")
+          return {
+            [`--hero-${name}`]: `url('data:image/svg+xml;utf8,${content}')`,
+            "-webkit-mask": `var(--hero-${name})`,
+            "mask": `var(--hero-${name})`,
+            "mask-repeat": "no-repeat",
+            "background-color": "currentColor",
+            "vertical-align": "middle",
+            "display": "inline-block",
+            "width": theme("spacing.5"),
+            "height": theme("spacing.5")
+          }
+        }
+      }, {values})
+    })
+  ]
+}