diff --git a/.github/workflows/docker-publish.yml b/.github/workflows/docker-publish.yml new file mode 100644 index 0000000..c765d0e --- /dev/null +++ b/.github/workflows/docker-publish.yml @@ -0,0 +1,59 @@ +name: Docker + +on: + push: + branches: ['master'] + +env: + REGISTRY: ghcr.io + IMAGE_NAME: ${{ github.repository }} + +jobs: + build-and-push-image: + runs-on: ubuntu-latest + permissions: + contents: read + packages: write + attestations: write + id-token: write + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + + - name: Log in to the Container registry + uses: docker/login-action@v3 + with: + registry: ${{ env.REGISTRY }} + username: ${{ github.actor }} + password: ${{ secrets.GITHUB_TOKEN }} + + - name: Extract metadata (tags, labels) for Docker + id: meta + uses: docker/metadata-action@v5 + with: + images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }} + tags: | + type=raw,value=latest,enable=${{ github.ref == 'refs/heads/master' }} + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v3 + with: + driver: docker-container + + - name: Build and push Docker image + id: push + uses: docker/build-push-action@v5 + with: + context: . + push: true + platforms: linux/amd64,linux/arm64 + tags: ${{ steps.meta.outputs.tags }} + labels: ${{ steps.meta.outputs.labels }} + + - name: Generate artifact attestation + uses: actions/attest-build-provenance@v2 + with: + subject-name: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME}} + subject-digest: ${{ steps.push.outputs.digest }} + push-to-registry: true diff --git a/Dockerfile b/Dockerfile index def60ef..52435e7 100644 --- a/Dockerfile +++ b/Dockerfile @@ -18,3 +18,7 @@ COPY . . # Build the application ENV NODE_OPTIONS=--max_old_space_size=16384 RUN pnpm run build + +# Default to serving the build directory +CMD ["npx", "serve", "build"] + diff --git a/README.md b/README.md index 9fadf41..848a4b1 100644 --- a/README.md +++ b/README.md @@ -8,9 +8,24 @@ If you would like to be interoperable with Flotilla, please check out this guide To run your own Flotilla, it's as simple as: -- `pnpm install` -- `pnpm run build` -- `npx serve build` +```sh +pnpm install +pnpm run build +npx serve build +``` + +Or, if you prefer to use a container: + +```sh +podman run -d -p 3000:3000 ghcr.io/coracle-social/flotilla:latest +``` + +Alternatively, you can copy the build files into a directory of your choice and serve it yourself: + +```sh +mkdir ./mount +podman run -v ./mount:/app/mount ghcr.io/coracle-social/flotilla:latest bash -c 'cp -r build/* mount' +``` ## Environment @@ -28,84 +43,6 @@ You can also optionally create an `.env` file and populate it with the following If you're deploying a custom version of flotilla, be sure to remove the `plausible.coracle.social` script from `app.html`. This sends analytics to a server hosted by the developer. -## Nginx/TLS (optional) - -If you'd like to set up flotilla on a server you control, you'll want to set up a reverse proxy and provision a TSL certificate for the domain you'll be using. You should also make sure to add swap to your server. - -There will be some parts of the following templates, for example ``, which you'll need to fill in before running the code. - -First, create an `A` record with your DNS provider pointing to the IP of your server. This will allow certbot to create your certificate later. - -Next install `nginx`, `git`, and `certbot`. If you're on a debian- or ubuntu-based distro, run `sudo apt-get update && sudo apt-get install nginx git certbot python3-certbot-nginx`. - -Now, create a new user where your code will be stored, clone the repository, fill in your `.env` file, and build the app. - -```sh -# Replace with your password -PASSWORD= - -# Add the user and set a password -adduser flotilla -echo flotilla:$PASSWORD | chpasswd - -# Login as flotilla -sudo su flotilla - -# Go to flotilla's home directory -cd ~ - -# Install nvm, yarn, clone repos -wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash - -# Update PATH -. ~/.bashrc - -# Clone repository and install dependencies -git clone https://github.com/coracle-social/flotilla.git -cd ~/flotilla -nvm install -nvm use -pnpm i - -# Optionally create and populate .env to suit your use case - -# Build the app -NODE_OPTIONS=--max_old_space_size=16384 pnpm run build - -# Exit back to root -exit -``` - -Once you've exited back to root, you can set up nginx. Place the following in a file named after your domain in the `/etc/nginx/sites-available` directory, for example, `flotilla.example.com`. This should match the `A` record you registered above. - -```conf -server { - listen 80; - server_name ; - root /home/flotilla/flotilla/build; - index index.html; - - location / { - try_files $uri /index.html; - } -} -``` - -Now you can run `certbot`, which will provision a TLS certificate for your domain and update your nginx configuration. - -``` -certbot --nginx -d -``` - -Now, enable the site and restart nginx. If you want to be careful, run `nginx -t` before restarting nginx. - -``` -ln -s /etc/nginx/sites-{available,enabled}/ -service nginx restart -``` - -Now, visit your domain. You should be all set up! - # Development -Run `pnpm run dev` to get a dev server, and `pnpm run check:watch` to watch for typescript errors. When you're ready to commit, run `pnpm run format && pnpm run lint` and fix any errors that come up. +Run `pnpm run dev` to get a dev server, and `pnpm run check:watch` to watch for typescript errors. When you're ready to commit, a pre-commit hook will run to lint and typecheck your work. diff --git a/src/assets/icons/Heart.svg b/src/assets/icons/Heart.svg new file mode 100644 index 0000000..6fd2564 --- /dev/null +++ b/src/assets/icons/Heart.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/lib/components/Icon.svelte b/src/lib/components/Icon.svelte index 40618a7..a486aef 100644 --- a/src/lib/components/Icon.svelte +++ b/src/lib/components/Icon.svelte @@ -43,6 +43,7 @@ import Hashtag from "@assets/icons/Hashtag.svg?dataurl" import HamburgerMenu from "@assets/icons/Hamburger Menu.svg?dataurl" import HandPills from "@assets/icons/Hand Pills.svg?dataurl" + import Heart from "@assets/icons/Heart.svg?dataurl" import HomeSmile from "@assets/icons/Home Smile.svg?dataurl" import Inbox from "@assets/icons/Inbox.svg?dataurl" import InfoCircle from "@assets/icons/Info Circle.svg?dataurl" @@ -136,6 +137,7 @@ hashtag: Hashtag, "hamburger-menu": HamburgerMenu, "hand-pills": HandPills, + heart: Heart, "home-smile": HomeSmile, inbox: Inbox, "info-circle": InfoCircle,