Add vite react

Fixes #44

.dockerignore

@@ -0,0 +1,8 @@
+.git
+.githooks
+.mypy_cache
+.pytest_cache
+.venv
+.vscode
+node_modules
+src/timetracker/static/*

.drone.yml

@@ -1,21 +1,40 @@
 ---
 kind: pipeline
 type: docker
-name: build image
+name: default
 
 steps:
-- name: build container
+- name: test
+  image: python:3.10
+  commands:
+    - python -m pip install poetry
+    - poetry install
+    - poetry env info
+    - poetry run pytest
+- name: build container (prod)
   image: plugins/docker
   settings:
     repo: registry.kucharczyk.xyz/timetracker
-    environment:
-      VERSION_NUMBER: $(git describe --tags --abbrev=0)
     tags:
       - latest
-      - $VERSION_NUMBER
+  when:
+    branch:
+      - main
+
+- name: build container (non-prod)
+  image: plugins/docker
+  settings:
+    repo: registry.kucharczyk.xyz/timetracker
+    tags:
+      - ${DRONE_COMMIT_REF}
+      - ${DRONE_COMMIT_BRANCH}
+  when:
+    branch:
+      exclude:
+        - main
+    
+    
 trigger:
   event:
   - push
   - cron
-  exclude:
-    - pull_request

.githooks/pre-commit.disabled

@@ -0,0 +1,14 @@
+#!/bin/bash
+set -euo pipefail
+echo "----------------"
+echo "Pre-commit hooks"
+echo "================"
+BASE_VERSION_NUMBER=$(git describe --tags --abbrev=0)
+FULL_VERSION_NUMBER=$(git describe --tags)
+echo "Updating "VERSION_NUMBER" in Dockerfile to $FULL_VERSION_NUMBER"
+sed -i "s/^ENV VERSION_NUMBER.*$/ENV VERSION_NUMBER ${FULL_VERSION_NUMBER}/" Dockerfile
+echo "Updating "version" in pyproject.toml to $BASE_VERSION_NUMBER"
+sed -i "s/^version = \".*\"$/version = \"${BASE_VERSION_NUMBER}\"/" pyproject.toml
+git add Dockerfile
+git add pyproject.toml
+echo "----------------"

.gitignore

@@ -1,5 +1,9 @@
 __pycache__
+.mypy_cache
+.pytest_cache
 .venv
 node_modules
 package-lock.json
 db.sqlite3
+static
+dist/

.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+    "python.testing.pytestArgs": [
+        "tests"
+    ],
+    "python.testing.unittestEnabled": false,
+    "python.testing.pytestEnabled": true,
+    "python.analysis.typeCheckingMode": "basic"
+}

CHANGELOG.md

@@ -0,0 +1,83 @@
+## Unrelease
+
+* Add React
+
+## 1.0.0 / 2023-01-20 19:54+01:00
+
+* Breaking
+  * Due to major re-arranging and re-naming of the folder structure, tables also had to be renamed.
+* Fixed
+  * Sort form fields alphabetically (https://git.kucharczyk.xyz/lukas/timetracker/issues/39, https://git.kucharczyk.xyz/lukas/timetracker/issues/40)
+  * Start session button starts different game than it says (#44)
+
+## 0.2.5 / 2023-01-18 17:01+01:00
+
+* New
+  * When adding session, pre-select game with the last session
+* Fixed
+  * Start session now button would take up 100% width, leading to accidental clicks (https://git.kucharczyk.xyz/lukas/timetracker/issues/37)
+* Removed
+  * Session model property `last` is already implemented by Django method `last()`, thus it was removed (https://git.kucharczyk.xyz/lukas/timetracker/issues/38)
+
+## 0.2.4 / 2023-01-16 19:39+01:00
+
+* Fixed
+  * When filtering by game, the "Filtering by (...)" text would erroneously list an unrelated platform
+  * Playtime graph would display timeline backwards
+  * Playtime graph with many dates would overlap (https://git.kucharczyk.xyz/lukas/timetracker/issues/34)
+  * Manually added times (= without end timestamp) would make graphs look ugly and noisy (https://git.kucharczyk.xyz/lukas/timetracker/issues/35)
+
+## 0.2.3 / 2023-01-15 23:13+01:00
+
+* Allow filtering by platform and game on session list (https://git.kucharczyk.xyz/lukas/timetracker/issues/32)
+* Order session by newest as preparation for https://git.kucharczyk.xyz/lukas/timetracker/issues/33
+
+## 0.2.2 / 2023-01-15 17:59+01:00
+
+* Display playtime graph on session list (https://git.kucharczyk.xyz/lukas/timetracker/issues/29)
+* Fix error when showing session list with no sessions (https://git.kucharczyk.xyz/lukas/timetracker/issues/31)
+
+## 0.2.1 / 2023-01-13 16:53+01:00
+
+* List number of sessions when filtering on session list
+* Start sessions of last purchase from list (https://git.kucharczyk.xyz/lukas/timetracker/issues/19)
+
+## 0.2.0 / 2023-01-09 22:42+01:00
+
+* Show playtime total on session list (https://git.kucharczyk.xyz/lukas/timetracker/issues/6)
+* Make formatting durations more robust, change default duration display to "X hours" (https://git.kucharczyk.xyz/lukas/timetracker/issues/26)
+
+## 0.1.4 / 2023-01-08 15:45+01:00
+
+* Fix collectstaticfiles causing error when restarting container (https://git.kucharczyk.xyz/lukas/timetracker/issues/23)
+
+## 0.1.3 / 2023-01-08 15:23+01:00
+
+* Fix CSRF error (https://git.kucharczyk.xyz/lukas/timetracker/pulls/22)
+
+## 0.1.2 / 2023-01-07 22:05+01:00
+
+* Switch to Uvicorn/Gunicorn + Caddy (https://git.kucharczyk.xyz/lukas/timetracker/pulls/4)
+
+## 0.1.1 / 2023-01-05 23:26+01:00
+* Order by timestamp_start by default
+* Add pre-commit hook to update version
+* Improve the newcomer experience by guiding through each step
+* Fix errors with empty database
+* Fix negative playtimes being considered positive
+* Add %d for days to common.util.time.format_duration
+* Set up tests, add tests for common.util.time
+* Display total hours played on homepage
+* Add format_duration to common.util.time
+* Allow deleting sessions
+* Redirect after adding game/platform/purchase/session
+* Fix display of duration_manual
+* Fix display of duration_calculated, display durations less than a minute
+* Make the "Finish now?" button on session list work
+* Hide navigation bar items if there are no games/purchases/sessions
+* Set default version to "git-main" to indicate development environment
+* Add homepage, link to it from the logo
+* Make it possible to add a new platform
+* Save calculated duration to database if both timestamps are set
+* Improve session listing
+* Set version in the footer to fixed, fix main container height

Caddyfile

@@ -0,0 +1,14 @@
+{
+    auto_https off
+    admin off
+}
+
+:8000 {
+    handle_path /static/* {
+        root * /usr/share/caddy
+        file_server
+    }
+    handle {
+        reverse_proxy backend:8001
+    }
+}

Dockerfile

@@ -1,15 +1,34 @@
-FROM python:3.10-slim-bullseye
+FROM node as css
-ENV VIRTUAL_ENV=/opt/venv
+WORKDIR /app
-RUN python3 -m venv pip $VIRTUAL_ENV
+COPY . /app
-ENV PATH="$VIRTUAL_ENV/bin:$PATH"
+RUN npm install && \
-RUN pip install --no-cache-dir poetry
+    npx tailwindcss -i ./common/input.css -o ./static/base.css --minify
-RUN useradd --create-home --uid 1000 timetracker
+
+FROM python:3.10.9-slim-bullseye
+
+ENV VERSION_NUMBER 1.0.0
+ENV PROD 1
+ENV PYTHONUNBUFFERED=1
+
+RUN apt update && \
+    apt install -y \
+    bash \
+    vim \
+    curl && \
+    rm -rf /var/lib/apt/lists/*
+
+RUN useradd -m --uid 1000 timetracker
 WORKDIR /home/timetracker/app
 COPY . /home/timetracker/app/
 RUN chown -R timetracker:timetracker /home/timetracker/app
-RUN poetry install --without dev
+COPY --from=css ./app/static/base.css /home/timetracker/app/static/base.css
 COPY entrypoint.sh /
 RUN chmod +x /entrypoint.sh
+
 USER timetracker
+ENV PATH="$PATH:/home/timetracker/.local/bin"
+RUN pip install --no-cache-dir poetry
+RUN poetry install --without dev
+
 EXPOSE 8000
-ENTRYPOINT [ "/entrypoint.sh" ]
+CMD [ "/entrypoint.sh" ]

Makefile

@@ -1,37 +1,64 @@
-.PHONY: createsuperuser
-
 all: css migrate
 
-initialize: npm css migrate loadplatforms
+initialize: npm css migrate sethookdir loadplatforms
 
-HTMLFILES := $(shell find src/web/tracker/templates -type f)
+HTMLFILES := $(shell find games/templates -type f)
 
 npm:
 	npm install
 
-css: src/input.css
+css: input.css
-	npx tailwindcss -i ./src/input.css -o  ./src/web/tracker/static/base.css
+	npx tailwindcss -i ./input.css -o  ./games/static/base.css
 
 css-dev: css
-	npx tailwindcss -i ./src/input.css -o  ./src/web/tracker/static/base.css --watch
+	npx tailwindcss -i ./input.css -o  ./games/static/base.css --watch
 
 makemigrations:
-	python src/web/manage.py makemigrations
+	poetry run python manage.py makemigrations
 
 migrate: makemigrations
-	python src/web/manage.py migrate
+	poetry run python manage.py migrate
 
 dev: migrate
-	python src/web/manage.py runserver
+	poetry run python manage.py runserver
 
-dumptracker:
+caddy:
-	python src/web/manage.py dumpdata --format yaml tracker --output tracker_fixture.yaml
+	caddy run --watch
+
+dev-prod: migrate collectstatic
+	PROD=1 poetry run python -m gunicorn --bind 0.0.0.0:8001 timetracker.asgi:application -k uvicorn.workers.UvicornWorker
+
+dumpgames:
+	poetry run python manage.py dumpdata --format yaml games --output tracker_fixture.yaml
 
 loadplatforms:
-	python src/web/manage.py loaddata platforms.yaml
+	poetry run python manage.py loaddata platforms.yaml
+
+loadall:
+	poetry run python manage.py loaddata data.yaml
 
 loadsample:
-	python src/web/manage.py loaddata sample.yaml
+	poetry run python manage.py loaddata sample.yaml
 
 createsuperuser:
-	python src/web/manage.py createsuperuser
+	poetry run python manage.py createsuperuser
+
+shell:
+	poetry run python manage.py shell
+
+collectstatic:
+	poetry run python manage.py collectstatic --clear --no-input
+
+poetry.lock: pyproject.toml
+	poetry install
+
+test: poetry.lock
+	poetry run pytest
+
+date:
+	poetry run python -c 'import datetime; from zoneinfo import ZoneInfo; print(datetime.datetime.isoformat(datetime.datetime.now(ZoneInfo("Europe/Prague")), timespec="minutes", sep=" "))'
+
+cleanstatic:
+	rm -r static/*
+
+clean: cleanstatic

common/import_data.py

@@ -0,0 +1,30 @@
+import csv
+from typing import TypeAlias
+
+from games.models import Game
+
+DataList: TypeAlias = list[dict[str, str]] | None
+
+
+def read_csv(filename: str) -> DataList:
+    with open(filename, "r") as csvfile:
+        writer = csv.DictReader(csvfile)
+        return writer
+
+
+def import_data(data: DataList):
+    matching_names = {}
+    for line in data:
+        name = line["name"]
+        if name not in matching_names:
+            # try exact match first
+            try:
+                game_id = Game.objects.get(name__iexact=name)
+            except:
+                pass
+            matching_names[name] = game_id
+    print(f"Exact matched {len(matching_names)} games.")
+
+
+def import_from_file(filename: str):
+    import_data(read_csv(filename))

common/input.css

@@ -0,0 +1,22 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+form label {
+  @apply dark:text-slate-400;
+}
+
+form input,
+select,
+textarea {
+  @apply dark:border dark:border-slate-900 dark:bg-slate-500 dark:text-slate-100;
+}
+
+#session-table {
+  display: grid;
+  grid-template-columns: 3fr 1fr repeat(2, 2fr) 0.5fr 1fr;
+}
+
+#button-container button {
+  @apply mx-1;
+}

common/plots.py

@@ -0,0 +1,91 @@
+import base64
+from datetime import datetime
+from io import BytesIO
+
+import matplotlib.pyplot as plt
+import matplotlib.dates as mdates
+import pandas as pd
+from django.db.models import F, IntegerField, QuerySet, Sum
+from django.db.models.functions import TruncDay
+from games.models import Session
+
+
+def key_value_to_value_value(data):
+    return {data["date"]: data["hours"]}
+
+
+def playtime_over_time_chart(queryset: QuerySet = Session.objects):
+    microsecond_in_second = 1000000
+    result = (
+        queryset.exclude(timestamp_end__exact=None)
+        .annotate(date=TruncDay("timestamp_start"))
+        .values("date")
+        .annotate(
+            hours=Sum(
+                F("duration_calculated"),
+                output_field=IntegerField(),
+            )
+        )
+        .values("date", "hours")
+    )
+    keys = []
+    values = []
+    running_total = int(0)
+    for item in result:
+        # date_value = datetime.strftime(item["date"], "%d-%m-%Y")
+        date_value = item["date"]
+        keys.append(date_value)
+        running_total += int(item["hours"] / (3600 * microsecond_in_second))
+        values.append(running_total)
+    data = [keys, values]
+    return get_chart(
+        data,
+        title="Playtime over time (manual excluded)",
+        xlabel="Date",
+        ylabel="Hours",
+    )
+
+
+def get_graph():
+    buffer = BytesIO()
+    plt.savefig(buffer, format="svg", transparent=True)
+    buffer.seek(0)
+    image_png = buffer.getvalue()
+    graph = base64.b64encode(image_png)
+    graph = graph.decode("utf-8")
+    buffer.close()
+    return graph
+
+
+def get_chart(data, title="", xlabel="", ylabel=""):
+    x = data[0]
+    y = data[1]
+    plt.style.use("dark_background")
+    plt.switch_backend("SVG")
+    fig, ax = plt.subplots()
+    fig.set_size_inches(10, 4)
+    ax.plot(x, y)
+    first = x[0]
+    last = x[-1]
+    difference = last - first
+    if difference.days <= 14:
+        ax.xaxis.set_major_locator(mdates.DayLocator())
+    elif difference.days < 60 or len(x) < 60:
+        ax.xaxis.set_major_locator(mdates.WeekdayLocator())
+        ax.xaxis.set_minor_locator(mdates.DayLocator())
+    elif difference.days < 720:
+        ax.xaxis.set_major_locator(mdates.MonthLocator())
+        ax.xaxis.set_minor_locator(mdates.WeekdayLocator())
+    else:
+        ax.xaxis.set_major_locator(mdates.YearLocator())
+        ax.xaxis.set_minor_locator(mdates.MonthLocator())
+
+    ax.xaxis.set_major_formatter(mdates.DateFormatter("%Y-%m-%d"))
+    for label in ax.get_xticklabels(which="major"):
+        label.set(rotation=30, horizontalalignment="right")
+    ax.set_xlabel(xlabel)
+    ax.set_ylabel(ylabel)
+    ax.set_title(title)
+    fig.tight_layout()
+    chart = get_graph()
+    return chart

common/time.py

@@ -0,0 +1,63 @@
+import re
+from datetime import datetime, timedelta
+from zoneinfo import ZoneInfo
+
+from django.conf import settings
+
+
+def now() -> datetime:
+    return datetime.now(ZoneInfo(settings.TIME_ZONE))
+
+
+def _safe_timedelta(duration: timedelta | int | None):
+    if duration == None:
+        return timedelta(0)
+    elif isinstance(duration, int):
+        return timedelta(seconds=duration)
+    elif isinstance(duration, timedelta):
+        return duration
+
+
+def format_duration(
+    duration: timedelta | int | None, format_string: str = "%H hours"
+) -> str:
+    """
+    Format timedelta into the specified format_string.
+    Valid format variables:
+    - %H hours
+    - %m minutes
+    - %s seconds
+    - %r total seconds
+    Values don't change into higher units if those units are missing
+    from the formatting string. For example:
+    - 61 seconds as "%s" = 61 seconds
+    - 61 seconds as "%m %s" = 1 minutes 1 seconds"
+    """
+    minute_seconds = 60
+    hour_seconds = 60 * minute_seconds
+    day_seconds = 24 * hour_seconds
+    duration = _safe_timedelta(duration)
+    # we don't need float
+    seconds_total = int(duration.total_seconds())
+    # timestamps where end is before start
+    if seconds_total < 0:
+        seconds_total = 0
+    days = hours = minutes = seconds = 0
+    remainder = seconds = seconds_total
+    if "%d" in format_string:
+        days, remainder = divmod(seconds_total, day_seconds)
+    if "%H" in format_string:
+        hours, remainder = divmod(remainder, hour_seconds)
+    if "%m" in format_string:
+        minutes, seconds = divmod(remainder, minute_seconds)
+    literals = {
+        "%d": str(days),
+        "%H": str(hours),
+        "%m": str(minutes),
+        "%s": str(seconds),
+        "%r": str(seconds_total),
+    }
+    formatted_string = format_string
+    for pattern, replacement in literals.items():
+        formatted_string = re.sub(pattern, replacement, formatted_string)
+    return formatted_string

docker-compose.no-caddy.yml

@@ -0,0 +1,17 @@
+---
+services:
+  timetracker:
+    image: registry.kucharczyk.xyz/timetracker
+    build:
+      context: .
+      dockerfile: Dockerfile
+    container_name: timetracker
+    environment:
+      - TZ=Europe/Prague
+      - CSRF_TRUSTED_ORIGINS="https://tracker.kucharczyk.xyz"
+    user: "1000"
+    # volumes:
+    #   - "db:/home/timetracker/app/src/timetracker/db.sqlite3"
+    ports:
+      - "8000:8000"
+    restart: unless-stopped

docker-compose.yml

@@ -0,0 +1,28 @@
+---
+services:
+  backend:
+    image: registry.kucharczyk.xyz/timetracker
+    build:
+      context: .
+      dockerfile: Dockerfile
+    environment:
+      - TZ=Europe/Prague
+      - CSRF_TRUSTED_ORIGINS="https://tracker.kucharczyk.xyz"
+    user: "1000"
+    volumes:
+      - "static-files:/home/timetracker/app/static"
+    restart: unless-stopped
+
+  frontend:
+    image: caddy
+    volumes:
+      - "static-files:/usr/share/caddy"
+      - "$PWD/Caddyfile:/etc/caddy/Caddyfile"
+    ports:
+      - "8000:8000"
+    depends_on:
+      - backend
+
+volumes:
+  static-files:
+    

entrypoint.sh

@@ -1,8 +1,11 @@
 #!/bin/bash
 # Apply database migrations
+set -euo pipefail
 echo "Apply database migrations"
-python src/web/manage.py migrate
+poetry run python manage.py migrate
 
-# Start server
+echo "Collect static files"
-echo "Starting server"
+poetry run python manage.py collectstatic --clear --no-input
-python src/web/manage.py runserver 0.0.0.0:8000
+
+echo "Starting app"
+poetry run python -m gunicorn --bind 0.0.0.0:8001 timetracker.asgi:application -k uvicorn.workers.UvicornWorker --access-logfile - --error-logfile -

frontend/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

frontend/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>

frontend/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "frontend",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.9",
+    "@vitejs/plugin-react": "^3.0.0",
+    "vite": "^4.0.0"
+  }
+}

frontend/public/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

frontend/src/App.css

@@ -0,0 +1,41 @@
+#root {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+.logo {
+  height: 6em;
+  padding: 1.5em;
+  will-change: filter;
+}
+.logo:hover {
+  filter: drop-shadow(0 0 2em #646cffaa);
+}
+.logo.react:hover {
+  filter: drop-shadow(0 0 2em #61dafbaa);
+}
+
+@keyframes logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  a:nth-of-type(2) .logo {
+    animation: logo-spin infinite 20s linear;
+  }
+}
+
+.card {
+  padding: 2em;
+}
+
+.read-the-docs {
+  color: #888;
+}

frontend/src/App.jsx

@@ -0,0 +1,34 @@
+import { useState } from 'react'
+import reactLogo from './assets/react.svg'
+import './App.css'
+
+function App() {
+  const [count, setCount] = useState(0)
+
+  return (
+    <div className="App">
+      <div>
+        <a href="https://vitejs.dev" target="_blank">
+          <img src="/vite.svg" className="logo" alt="Vite logo" />
+        </a>
+        <a href="https://reactjs.org" target="_blank">
+          <img src={reactLogo} className="logo react" alt="React logo" />
+        </a>
+      </div>
+      <h1>Vite + React</h1>
+      <div className="card">
+        <button onClick={() => setCount((count) => count + 1)}>
+          count is {count}
+        </button>
+        <p>
+          Edit <code>src/App.jsx</code> and save to test HMR
+        </p>
+      </div>
+      <p className="read-the-docs">
+        Click on the Vite and React logos to learn more
+      </p>
+    </div>
+  )
+}
+
+export default App

frontend/src/assets/react.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>

frontend/src/index.css

@@ -0,0 +1,70 @@
+:root {
+  font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-text-size-adjust: 100%;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}

frontend/src/main.jsx

@@ -0,0 +1,10 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App'
+import './index.css'
+
+ReactDOM.createRoot(document.getElementById('root')).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>,
+)

frontend/vite.config.js

@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+})

games/admin.py

@@ -1,5 +1,6 @@
 from django.contrib import admin
-from .models import Game, Purchase, Platform, Session
+
+from games.models import Game, Platform, Purchase, Session
 
 # Register your models here.
 admin.site.register(Game)

games/apps.py

@@ -1,6 +1,6 @@
 from django.apps import AppConfig
 
 
-class TrackerConfig(AppConfig):
+class GamesConfig(AppConfig):
     default_auto_field = "django.db.models.BigAutoField"
-    name = "tracker"
+    name = "games"

games/fixtures/platforms.yaml

@@ -1,28 +1,28 @@
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Steam
     group: PC
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Xbox Gamepass
     group: PC
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Epic Games Store
     group: PC
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Playstation 5
     group: Playstation
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Playstation 4
     group: Playstation
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Nintendo Switch
     group: Nintendo
-- model: tracker.Platform
+- model: games.Platform
   fields:
     name: Nintendo 3DS
     group: Nintendo

games/fixtures/ps-tracker.csv

@@ -0,0 +1,225 @@
+name,platform,start,end
+Nioh 2,PS5,2022-12-17 19:34,2022-12-17 22:53
+Nioh 2,PS5,2022-12-15 02:25,2022-12-15 03:57
+Nioh 2,PS5,2022-12-13 02:41,2022-12-13 04:34
+Nioh 2,PS5,2022-12-11 21:01,2022-12-11 23:21
+VALKYRIE ELYSIUM,PS5,2022-12-11 06:07,2022-12-11 06:20
+Metal: Hellsinger,PS5,2022-12-11 05:50,2022-12-11 06:07
+Nioh 2,PS5,2022-12-11 04:31,2022-12-11 05:50
+Nioh 2,PS5,2022-12-11 04:11,2022-12-11 04:26
+Forspoken,PS5,2022-12-10 22:29,2022-12-10 23:10
+Nioh 2,PS5,2022-12-10 19:44,2022-12-10 22:29
+Nioh 2,PS5,2022-12-09 02:14,2022-12-09 04:16
+Nioh 2,PS5,2022-12-08 01:03,2022-12-08 01:57
+Nioh 2,PS5,2022-12-07 00:43,2022-12-07 04:16
+Nioh 2,PS5,2022-12-04 20:48,2022-12-04 23:31
+Nioh 2,PS5,2022-12-04 04:26,2022-12-04 07:01
+Nioh 2,PS5,2022-12-04 04:20,2022-12-04 04:22
+Nioh 2,PS5,2022-11-26 19:18,2022-11-26 21:28
+Nioh 2,PS5,2022-11-26 19:16,2022-11-26 19:18
+Nioh 2,PS5,2022-11-26 02:46,2022-11-26 03:56
+Nioh 2,PS5,2022-11-26 02:01,2022-11-26 02:43
+God of War Ragnarök,PS5,2022-11-24 23:03,2022-11-25 01:32
+God of War Ragnarök,PS5,2022-11-23 00:41,2022-11-23 07:52
+God of War Ragnarök,PS5,2022-11-21 22:52,2022-11-22 04:51
+God of War Ragnarök,PS5,2022-11-21 02:11,2022-11-21 05:13
+God of War Ragnarök,PS5,2022-11-20 21:34,2022-11-20 22:50
+God of War Ragnarök,PS5,2022-11-20 03:46,2022-11-20 05:52
+God of War Ragnarök,PS5,2022-11-19 14:30,2022-11-19 16:14
+God of War Ragnarök,PS5,2022-11-18 23:15,2022-11-19 04:16
+God of War Ragnarök,PS5,2022-11-18 19:58,2022-11-18 20:40
+God of War Ragnarök,PS5,2022-11-18 03:50,2022-11-18 06:25
+God of War Ragnarök,PS5,2022-11-17 19:36,2022-11-18 00:26
+God of War Ragnarök,PS5,2022-11-17 13:16,2022-11-17 16:13
+God of War Ragnarök,PS5,2022-11-16 21:45,2022-11-16 22:38
+God of War Ragnarök,PS5,2022-11-16 00:14,2022-11-16 04:28
+God of War Ragnarök,PS5,2022-11-15 01:33,2022-11-15 05:06
+God of War Ragnarök,PS5,2022-11-14 00:37,2022-11-14 04:43
+God of War Ragnarök,PS5,2022-11-12 23:32,2022-11-13 03:45
+God of War Ragnarök,PS5,2022-11-12 03:17,2022-11-12 05:00
+Grand Theft Auto V (PlayStation®5),PS5,2022-10-03 02:01,2022-10-03 02:23
+Grand Theft Auto V (PlayStation®5),PS5,2022-10-02 13:59,2022-10-02 15:54
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-30 22:40,2022-10-01 02:50
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-27 22:38,2022-09-28 00:16
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-27 19:27,2022-09-27 21:09
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-26 20:58,2022-09-26 23:38
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-25 23:56,2022-09-26 02:36
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-25 14:57,2022-09-25 16:38
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-25 02:04,2022-09-25 02:12
+Grand Theft Auto V (PlayStation®5),PS5,2022-09-23 20:33,2022-09-23 23:38
+Wo Long: Fallen Dynasty,PS5,2022-09-18 15:26,2022-09-18 16:58
+Grand Theft Auto V (PlayStation®5),PS5,2022-08-31 00:42,2022-08-31 01:15
+Grand Theft Auto V (PlayStation®5),PS5,2022-08-18 13:43,2022-08-18 15:12
+Grand Theft Auto V (PlayStation®5),PS5,2022-08-18 00:42,2022-08-18 01:58
+Tony Hawk's™ Pro Skater™ 1 + 2,PS5,2022-08-18 00:40,2022-08-18 00:42
+Tony Hawk's™ Pro Skater™ 1 + 2,PS5,2022-08-14 15:46,2022-08-14 16:10
+FINAL FANTASY VII,PS5,2022-07-26 18:56,2022-07-26 20:22
+FINAL FANTASY VII REMAKE,PS5,2022-07-26 17:39,2022-07-26 18:53
+FINAL FANTASY VII REMAKE,PS5,2022-07-25 22:12,2022-07-26 04:37
+FINAL FANTASY VII REMAKE,PS5,2022-07-24 00:09,2022-07-24 05:33
+FINAL FANTASY VII REMAKE,PS5,2022-07-23 23:34,2022-07-23 23:48
+FINAL FANTASY VII REMAKE,PS5,2022-07-23 18:05,2022-07-23 19:44
+FINAL FANTASY VII REMAKE,PS5,2022-07-22 17:07,2022-07-23 01:48
+FINAL FANTASY VII REMAKE,PS5,2022-07-22 15:26,2022-07-22 15:59
+FINAL FANTASY VII REMAKE,PS5,2022-07-21 21:27,2022-07-21 22:43
+FINAL FANTASY VII REMAKE,PS5,2022-07-21 20:48,2022-07-21 20:58
+FINAL FANTASY VII REMAKE,PS5,2022-07-21 18:35,2022-07-21 18:36
+Stray,PS5,2022-07-21 01:24,2022-07-21 02:34
+Stray,PS5,2022-07-19 23:49,2022-07-20 03:24
+Atelier Ayesha ~The Alchemist of Dusk~,PS3,2022-07-04 03:26,2022-07-04 03:34
+Red Dead Redemption,PS3,2022-07-04 02:36,2022-07-04 03:14
+Ghost of Tsushima,PS5,2022-07-04 01:38,2022-07-04 02:34
+Dark Cloud™,PS4,2022-07-01 23:48,2022-07-02 00:04
+Atelier Ayesha ~The Alchemist of Dusk~,PS3,2022-07-01 23:20,2022-07-01 23:46
+Resident Evil Director’s Cut,PS5,2022-07-01 23:14,2022-07-01 23:20
+ELEX II,PS5,2022-07-01 22:48,2022-07-01 23:13
+OlliOlli World,PS5,2022-07-01 21:30,2022-07-01 22:30
+Deep Rock Galactic,PS5,2022-06-16 05:30,2022-06-16 06:14
+Curse of the Dead Gods,PS5,2022-06-16 05:00,2022-06-16 05:22
+Persona 5: Dancing in Starlight,PS5,2022-04-29 20:14,2022-04-29 20:15
+Persona 5: Dancing in Starlight,PS5,2022-04-29 00:18,2022-04-29 00:44
+Dying Light 2,PS5,2022-04-14 01:26,2022-04-14 01:27
+Grand Theft Auto V (PlayStation®5),PS5,2022-03-24 16:26,2022-03-24 16:27
+Grand Theft Auto V (PlayStation®5),PS5,2022-03-21 15:52,2022-03-21 15:59
+Horizon Forbidden West,PS5,2022-02-23 19:37,2022-02-24 00:24
+Horizon Forbidden West,PS5,2022-02-23 13:57,2022-02-23 17:44
+Horizon Forbidden West,PS5,2022-02-22 18:05,2022-02-23 05:26
+Horizon Forbidden West,PS5,2022-02-22 15:39,2022-02-22 17:02
+Horizon Forbidden West,PS5,2022-02-22 00:05,2022-02-22 04:08
+Horizon Forbidden West,PS5,2022-02-20 15:39,2022-02-20 23:08
+Horizon Forbidden West,PS5,2022-02-20 14:54,2022-02-20 15:09
+Horizon Forbidden West,PS5,2022-02-19 23:37,2022-02-20 04:45
+Horizon Forbidden West,PS5,2022-02-18 23:15,2022-02-19 03:27
+Assassin's Creed® Origins,PS5,2022-02-18 21:49,2022-02-18 23:15
+Assassin's Creed® Origins,PS5,2022-01-17 02:38,2022-01-17 02:50
+Deep Rock Galactic,PS5,2022-01-17 00:57,2022-01-17 02:35
+HITMAN 3,PS5,2021-11-17 00:35,2021-11-17 01:17
+HITMAN 3,PS5,2021-11-08 01:59,2021-11-08 06:17
+HITMAN 3,PS5,2021-11-07 03:10,2021-11-07 05:23
+HITMAN 3,PS5,2021-11-06 04:23,2021-11-06 08:49
+HITMAN 3,PS5,2021-11-06 02:17,2021-11-06 03:31
+HITMAN 3,PS5,2021-11-05 21:33,2021-11-05 23:24
+HITMAN 3,PS5,2021-11-05 03:09,2021-11-05 03:34
+HITMAN 3,PS5,2021-11-05 00:47,2021-11-05 02:26
+HITMAN 3,PS5,2021-11-04 20:27,2021-11-04 23:32
+HITMAN 3,PS5,2021-11-04 01:34,2021-11-04 05:33
+RESIDENT EVIL 3,PS5,2021-11-03 23:14,2021-11-03 23:56
+RESIDENT EVIL 3,PS5,2021-11-02 23:56,2021-11-03 05:10
+RESIDENT EVIL 3,PS5,2021-11-02 21:22,2021-11-02 23:23
+RESIDENT EVIL 3,PS5,2021-11-02 05:36,2021-11-02 06:56
+HITMAN 3,PS5,2021-11-02 03:00,2021-11-02 05:36
+HITMAN 3,PS5,2021-11-02 01:19,2021-11-02 01:25
+HITMAN™ 2,PS5,2021-11-02 01:09,2021-11-02 01:19
+HITMAN 3,PS5,2021-11-01 23:45,2021-11-02 01:09
+RESIDENT EVIL 3,PS5,2021-11-01 19:32,2021-11-01 19:47
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-17 01:06,2021-10-17 03:27
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-16 20:58,2021-10-16 22:00
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-05 02:30,2021-10-05 03:27
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-03 23:12,2021-10-04 01:21
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-03 03:02,2021-10-03 04:42
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-02 20:12,2021-10-02 21:10
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-02 01:40,2021-10-02 03:36
+Marvel's Spider-Man: Miles Morales,PS5,2021-10-01 04:34,2021-10-01 05:30
+DEATHLOOP,PS5,2021-10-01 01:12,2021-10-01 04:27
+DEATHLOOP,PS5,2021-09-30 03:04,2021-09-30 06:30
+DEATHLOOP,PS5,2021-09-29 00:28,2021-09-29 05:08
+Persona 5 Royal,PS5,2021-09-28 00:36,2021-09-28 03:08
+Persona 5 Royal,PS5,2021-09-27 02:16,2021-09-27 05:56
+Persona 5 Royal,PS5,2021-09-26 14:54,2021-09-26 16:32
+Persona 5 Royal,PS5,2021-09-25 18:43,2021-09-25 23:26
+Persona 5 Royal,PS5,2021-09-24 21:41,2021-09-25 03:40
+Persona 5 Royal,PS5,2021-09-23 00:18,2021-09-23 06:26
+Persona 5 Royal,PS5,2021-09-21 20:27,2021-09-22 05:43
+Persona 5 Royal,PS5,2021-09-21 01:07,2021-09-21 06:06
+Borderlands: The Handsome Collection,PS5,2021-09-20 23:59,2021-09-21 01:07
+Persona 5 Royal,PS5,2021-09-20 23:53,2021-09-20 23:59
+DEATHLOOP,PS5,2021-09-20 02:03,2021-09-20 06:29
+DEATHLOOP,PS5,2021-09-19 19:49,2021-09-20 01:16
+Borderlands: The Handsome Collection,PS5,2021-09-19 00:51,2021-09-19 03:41
+Borderlands: The Handsome Collection,PS5,2021-09-17 23:45,2021-09-18 01:48
+Borderlands: The Handsome Collection,PS5,2021-09-17 23:40,2021-09-17 23:41
+DEATHLOOP,PS5,2021-09-17 16:48,2021-09-17 18:56
+DEATHLOOP,PS5,2021-09-17 03:02,2021-09-17 04:39
+DEATHLOOP,PS5,2021-09-17 00:03,2021-09-17 02:53
+DEATHLOOP,PS5,2021-09-16 18:39,2021-09-16 21:12
+Persona 5 Royal,PS5,2021-09-16 18:29,2021-09-16 18:30
+Persona 5 Royal,PS5,2021-09-16 02:26,2021-09-16 06:13
+Persona 5 Royal,PS5,2021-09-16 02:20,2021-09-16 02:21
+Persona 5 Royal,PS5,2021-09-15 01:48,2021-09-15 06:07
+Persona 5 Royal,PS5,2021-09-14 22:21,2021-09-15 01:22
+Persona 5 Royal,PS5,2021-09-14 02:01,2021-09-14 05:48
+Persona 5 Royal,PS5,2021-09-14 00:24,2021-09-14 01:46
+Persona 5 Royal,PS5,2021-08-12 05:04,2021-08-12 07:05
+Persona 5 Royal,PS5,2021-08-11 05:02,2021-08-11 06:48
+Persona 5 Royal,PS5,2021-08-09 00:37,2021-08-09 06:15
+Persona 5 Royal,PS5,2021-08-08 00:31,2021-08-08 08:01
+Persona 5 Royal,PS5,2021-08-07 19:51,2021-08-07 22:50
+Persona 5 Royal,PS5,2021-08-06 23:51,2021-08-07 01:35
+Persona 5 Royal,PS5,2021-08-06 19:26,2021-08-06 22:26
+Persona 5 Royal,PS5,2021-08-06 02:42,2021-08-06 06:51
+Persona 5 Royal,PS5,2021-08-06 00:37,2021-08-06 01:54
+Far Cry® 5,PS5,2021-08-01 23:27,2021-08-02 02:09
+Far Cry® 5,PS5,2021-08-01 18:10,2021-08-01 19:40
+STAR WARS™: Squadrons,PS5,2021-08-01 18:02,2021-08-01 18:10
+STAR WARS™: Squadrons,PS5,2021-08-01 00:24,2021-08-01 00:30
+STEEP,PS5,2021-08-01 00:15,2021-08-01 00:24
+Red Dead Redemption 2,PS5,2021-07-31 23:48,2021-08-01 00:13
+Persona 5 Royal,PS5,2021-07-30 19:09,2021-07-30 19:10
+Persona 5 Royal,PS5,2021-07-29 03:41,2021-07-29 04:59
+Persona 5 Royal,PS5,2021-07-28 02:32,2021-07-28 03:07
+Demon's Souls,PS5,2021-07-28 00:12,2021-07-28 02:32
+Red Dead Redemption 2,PS5,2021-07-27 23:20,2021-07-27 23:23
+Red Dead Redemption 2,PS5,2021-07-26 00:42,2021-07-26 01:13
+Ghost of Tsushima,PS5,2021-07-25 19:03,2021-07-25 22:12
+Ghost of Tsushima,PS5,2021-07-25 18:52,2021-07-25 18:55
+Rez Infinite,PS5,2021-07-25 18:32,2021-07-25 18:52
+Returnal,PS5,2021-07-25 05:24,2021-07-25 05:26
+Tom Clancy's The Division® 2,PS5,2021-07-25 02:12,2021-07-25 05:24
+Returnal,PS5,2021-07-25 00:00,2021-07-25 02:12
+Returnal,PS5,2021-07-24 16:13,2021-07-24 17:39
+Returnal,PS5,2021-07-24 03:02,2021-07-24 07:02
+Returnal,PS5,2021-07-23 18:08,2021-07-23 20:39
+Returnal,PS5,2021-07-23 14:36,2021-07-23 15:38
+Titanfall™ 2,PS5,2021-07-22 02:42,2021-07-22 03:20
+Returnal,PS5,2021-07-20 02:12,2021-07-20 05:40
+Returnal,PS5,2021-07-19 03:37,2021-07-19 05:24
+Concrete Genie,PS5,2021-07-19 03:35,2021-07-19 03:37
+Concrete Genie,PS5,2021-07-18 05:04,2021-07-18 05:30
+Stranded Deep,PS5,2021-07-18 04:32,2021-07-18 04:58
+Sniper Elite 4,PS5,2021-07-18 04:16,2021-07-18 04:32
+Oddworld: Soulstorm,PS5,2021-07-18 04:00,2021-07-18 04:14
+Zombie Army 4: Dead War,PS5,2021-07-18 03:48,2021-07-18 03:58
+Sekiro™: Shadows Die Twice,PS5,2021-07-18 03:00,2021-07-18 03:48
+Returnal,PS5,2021-07-17 17:41,2021-07-17 23:32
+Returnal,PS5,2021-07-17 01:35,2021-07-17 06:07
+Returnal,PS5,2021-07-17 00:23,2021-07-17 01:21
+Another World - 20th Anniversary Edition,PS5,2021-07-15 22:09,2021-07-15 23:33
+Sekiro™: Shadows Die Twice,PS5,2021-07-15 21:52,2021-07-15 22:09
+Sekiro™: Shadows Die Twice,PS5,2021-07-15 19:07,2021-07-15 20:13
+Sekiro™: Shadows Die Twice,PS5,2021-07-15 01:50,2021-07-15 03:31
+Sekiro™: Shadows Die Twice,PS5,2021-07-15 00:12,2021-07-15 01:14
+Sekiro™: Shadows Die Twice,PS5,2021-07-14 03:19,2021-07-14 05:13
+Persona 5,PS5,2021-07-13 21:56,2021-07-13 21:58
+Persona 5,PS5,2021-07-13 01:32,2021-07-13 02:59
+Maquette,PS5,2021-07-13 01:30,2021-07-13 01:32
+Maquette,PS5,2021-07-12 23:59,2021-07-13 00:34
+ASTRO's PLAYROOM,PS5,2021-07-12 23:06,2021-07-12 23:59
+Crash Bandicoot N. Sane Trilogy,PS5,2021-07-12 23:01,2021-07-12 23:06
+Virtua Fighter 5 Ultimate Showdown,PS4,2021-07-02 19:46,2021-07-02 20:57
+Bloodborne™,PS4,2021-04-03 19:50,2021-04-03 23:52
+Tom Clancy's The Division® 2,PS4,2021-04-03 02:10,2021-04-03 05:22
+Bloodborne™,PS4,2021-04-02 21:34,2021-04-03 02:10
+Bloodborne™,PS4,2021-04-02 06:01,2021-04-02 08:11
+Tom Clancy's The Division® 2,PS4,2021-04-02 04:24,2021-04-02 06:01
+Tom Clancy's The Division® 2,PS4,2021-03-31 02:55,2021-03-31 05:50
+Tom Clancy's The Division® 2,PS4,2021-03-29 02:00,2021-03-29 02:02
+Tom Clancy's The Division® 2,PS4,2021-03-27 03:31,2021-03-27 06:29
+Tom Clancy's The Division® 2,PS4,2021-03-26 05:10,2021-03-26 06:03
+Remnant: From the Ashes,PS4,2021-03-23 03:20,2021-03-23 05:58
+DARK SOULS™ II: Scholar of the First Sin,PS4,2021-03-20 01:31,2021-03-20 01:34
+Remnant: From the Ashes,PS4,2021-03-12 01:29,2021-03-12 01:30
+Remnant: From the Ashes,PS4,2021-03-08 02:41,2021-03-08 05:38
+Remnant: From the Ashes,PS4,2021-03-07 03:21,2021-03-07 06:49
+13 Sentinels: Aegis Rim,PS4,2021-03-07 03:20,2021-03-07 03:21
+DARK SOULS™ II: Scholar of the First Sin,PS4,2020-10-24 23:43,2020-10-25 01:18
+Ghost of Tsushima,PS4,2020-10-24 23:14,2020-10-24 23:22

games/fixtures/sample.yaml

@@ -0,0 +1,71 @@
+- model: games.game
+  pk: 1
+  fields:
+    name: Nioh 2
+    wikidata: Q67482292
+- model: games.game
+  pk: 2
+  fields:
+    name: Elden Ring
+    wikidata: Q64826862
+- model: games.game
+  pk: 3
+  fields:
+    name: Cyberpunk 2077
+    wikidata: Q3182559
+- model: games.purchase
+  pk: 1
+  fields:
+    game: 1
+    platform: 1
+    date_purchased: 2021-02-13
+    date_refunded: null
+- model: games.purchase
+  pk: 2
+  fields:
+    game: 2
+    platform: 1
+    date_purchased: 2022-02-24
+    date_refunded: null
+- model: games.purchase
+  pk: 3
+  fields:
+    game: 3
+    platform: 1
+    date_purchased: 2020-12-07
+    date_refunded: null
+- model: games.platform
+  pk: 1
+  fields:
+    name: Steam
+    group: PC
+- model: games.platform
+  pk: 3
+  fields:
+    name: Xbox Gamepass
+    group: PC
+- model: games.platform
+  pk: 4
+  fields:
+    name: Epic Games Store
+    group: PC
+- model: games.platform
+  pk: 5
+  fields:
+    name: Playstation 5
+    group: Playstation
+- model: games.platform
+  pk: 6
+  fields:
+    name: Playstation 4
+    group: Playstation
+- model: games.platform
+  pk: 7
+  fields:
+    name: Nintendo Switch
+    group: Nintendo
+- model: games.platform
+  pk: 8
+  fields:
+    name: Nintendo 3DS
+    group: Nintendo

games/forms.py

@@ -1,8 +1,11 @@
 from django import forms
-from .models import Session, Purchase, Game
+
+from games.models import Game, Platform, Purchase, Session
 
 
 class SessionForm(forms.ModelForm):
+    purchase = forms.ModelChoiceField(queryset=Purchase.objects.order_by("game__name"))
+
     class Meta:
         model = Session
         fields = [
@@ -15,6 +18,9 @@ class SessionForm(forms.ModelForm):
 
 
 class PurchaseForm(forms.ModelForm):
+    game = forms.ModelChoiceField(queryset=Game.objects.order_by("name"))
+    platform = forms.ModelChoiceField(queryset=Platform.objects.order_by("name"))
+
     class Meta:
         model = Purchase
         fields = ["game", "platform", "date_purchased", "date_refunded"]
@@ -24,3 +30,9 @@ class GameForm(forms.ModelForm):
     class Meta:
         model = Game
         fields = ["name", "wikidata"]
+
+
+class PlatformForm(forms.ModelForm):
+    class Meta:
+        model = Platform
+        fields = ["name", "group"]

games/migrations/0001_initial.py

@@ -1,7 +1,7 @@
 # Generated by Django 4.1.4 on 2023-01-02 18:27
 
-from django.db import migrations, models
 import django.db.models.deletion
+from django.db import migrations, models
 
 
 class Migration(migrations.Migration):
@@ -60,14 +60,14 @@ class Migration(migrations.Migration):
                 (
                     "game",
                     models.ForeignKey(
-                        on_delete=django.db.models.deletion.CASCADE, to="tracker.game"
+                        on_delete=django.db.models.deletion.CASCADE, to="games.game"
                     ),
                 ),
                 (
                     "platform",
                     models.ForeignKey(
                         on_delete=django.db.models.deletion.CASCADE,
-                        to="tracker.platform",
+                        to="games.platform",
                     ),
                 ),
             ],
@@ -93,7 +93,7 @@ class Migration(migrations.Migration):
                     "purchase",
                     models.ForeignKey(
                         on_delete=django.db.models.deletion.CASCADE,
-                        to="tracker.purchase",
+                        to="games.purchase",
                     ),
                 ),
             ],

games/migrations/0002_alter_session_duration_manual.py

@@ -1,13 +1,14 @@
 # Generated by Django 4.1.4 on 2023-01-02 18:55
 
 import datetime
+
 from django.db import migrations, models
 
 
 class Migration(migrations.Migration):
 
     dependencies = [
-        ("tracker", "0001_initial"),
+        ("games", "0001_initial"),
     ]
 
     operations = [

games/migrations/0003_alter_session_duration_manual_and_more.py

@@ -6,7 +6,7 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ("tracker", "0002_alter_session_duration_manual"),
+        ("games", "0002_alter_session_duration_manual"),
     ]
 
     operations = [

games/migrations/0004_alter_session_duration_manual.py

@@ -0,0 +1,22 @@
+# Generated by Django 4.1.5 on 2023-01-09 14:49
+
+import datetime
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("games", "0003_alter_session_duration_manual_and_more"),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name="session",
+            name="duration_manual",
+            field=models.DurationField(
+                blank=True, default=datetime.timedelta(0), null=True
+            ),
+        ),
+    ]

games/migrations/0005_auto_20230109_1843.py

@@ -0,0 +1,35 @@
+# Generated by Django 4.1.5 on 2023-01-09 17:43
+
+from datetime import timedelta
+
+from django.db import migrations
+
+
+def set_duration_calculated_none_to_zero(apps, schema_editor):
+    Session = apps.get_model("games", "Session")
+    for session in Session.objects.all():
+        if session.duration_calculated == None:
+            session.duration_calculated = timedelta(0)
+            session.save()
+
+
+def revert_set_duration_calculated_none_to_zero(apps, schema_editor):
+    Session = apps.get_model("games", "Session")
+    for session in Session.objects.all():
+        if session.duration_calculated == timedelta(0):
+            session.duration_calculated = None
+            session.save()
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("games", "0004_alter_session_duration_manual"),
+    ]
+
+    operations = [
+        migrations.RunPython(
+            set_duration_calculated_none_to_zero,
+            revert_set_duration_calculated_none_to_zero,
+        )
+    ]

games/migrations/0006_auto_20230109_1904.py

@@ -0,0 +1,35 @@
+# Generated by Django 4.1.5 on 2023-01-09 18:04
+
+from datetime import timedelta
+
+from django.db import migrations
+
+
+def set_duration_manual_none_to_zero(apps, schema_editor):
+    Session = apps.get_model("games", "Session")
+    for session in Session.objects.all():
+        if session.duration_manual == None:
+            session.duration_manual = timedelta(0)
+            session.save()
+
+
+def revert_set_duration_manual_none_to_zero(apps, schema_editor):
+    Session = apps.get_model("games", "Session")
+    for session in Session.objects.all():
+        if session.duration_manual == timedelta(0):
+            session.duration_manual = None
+            session.save()
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("games", "0005_auto_20230109_1843"),
+    ]
+
+    operations = [
+        migrations.RunPython(
+            set_duration_manual_none_to_zero,
+            revert_set_duration_manual_none_to_zero,
+        )
+    ]

games/migrations/0007_alter_purchase_game_alter_purchase_platform_and_more.py

@@ -0,0 +1,35 @@
+# Generated by Django 4.1.5 on 2023-01-19 18:30
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("games", "0006_auto_20230109_1904"),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name="purchase",
+            name="game",
+            field=models.ForeignKey(
+                on_delete=django.db.models.deletion.CASCADE, to="games.game"
+            ),
+        ),
+        migrations.AlterField(
+            model_name="purchase",
+            name="platform",
+            field=models.ForeignKey(
+                on_delete=django.db.models.deletion.CASCADE, to="games.platform"
+            ),
+        ),
+        migrations.AlterField(
+            model_name="session",
+            name="purchase",
+            field=models.ForeignKey(
+                on_delete=django.db.models.deletion.CASCADE, to="games.purchase"
+            ),
+        ),
+    ]

games/models.py

@@ -0,0 +1,87 @@
+from datetime import datetime, timedelta
+from typing import Any
+from zoneinfo import ZoneInfo
+
+from common.time import format_duration
+from django.conf import settings
+from django.db import models
+from django.db.models import F, Manager, Sum
+
+
+class Game(models.Model):
+    name = models.CharField(max_length=255)
+    wikidata = models.CharField(max_length=50)
+
+    def __str__(self):
+        return self.name
+
+
+class Purchase(models.Model):
+    game = models.ForeignKey("Game", on_delete=models.CASCADE)
+    platform = models.ForeignKey("Platform", on_delete=models.CASCADE)
+    date_purchased = models.DateField()
+    date_refunded = models.DateField(blank=True, null=True)
+
+    def __str__(self):
+        return f"{self.game} ({self.platform})"
+
+
+class Platform(models.Model):
+    name = models.CharField(max_length=255)
+    group = models.CharField(max_length=255)
+
+    def __str__(self):
+        return self.name
+
+
+class SessionQuerySet(models.QuerySet):
+    def total_duration(self):
+        result = self.aggregate(
+            duration=Sum(F("duration_calculated") + F("duration_manual"))
+        )
+        return format_duration(result["duration"])
+
+
+class Session(models.Model):
+    purchase = models.ForeignKey("Purchase", on_delete=models.CASCADE)
+    timestamp_start = models.DateTimeField()
+    timestamp_end = models.DateTimeField(blank=True, null=True)
+    duration_manual = models.DurationField(blank=True, null=True, default=timedelta(0))
+    duration_calculated = models.DurationField(blank=True, null=True)
+    note = models.TextField(blank=True, null=True)
+
+    objects = SessionQuerySet.as_manager()
+
+    def __str__(self):
+        mark = ", manual" if self.duration_manual != None else ""
+        return f"{str(self.purchase)} {str(self.timestamp_start.date())} ({self.duration_formatted()}{mark})"
+
+    def finish_now(self):
+        self.timestamp_end = datetime.now(ZoneInfo(settings.TIME_ZONE))
+
+    def start_now():
+        self.timestamp_start = datetime.now(ZoneInfo(settings.TIME_ZONE))
+
+    def duration_seconds(self) -> timedelta:
+        manual = timedelta(0)
+        calculated = timedelta(0)
+        if not self.duration_manual in (None, 0, timedelta(0)):
+            manual = self.duration_manual
+        if self.timestamp_end != None and self.timestamp_start != None:
+            calculated = self.timestamp_end - self.timestamp_start
+        return timedelta(seconds=(manual + calculated).total_seconds())
+
+    def duration_formatted(self) -> str:
+        result = format_duration(self.duration_seconds(), "%H:%m")
+        return result
+
+    @property
+    def duration_sum(self) -> str:
+        return Session.objects.all().total_duration()
+
+    def save(self, *args, **kwargs):
+        if self.timestamp_start != None and self.timestamp_end != None:
+            self.duration_calculated = self.timestamp_end - self.timestamp_start
+        else:
+            self.duration_calculated = timedelta(0)
+        super(Session, self).save(*args, **kwargs)

games/static/base.css

@@ -717,24 +717,20 @@ select {
   position: static;
 }
 
-.absolute {
+.fixed {
-  position: absolute;
+  position: fixed;
 }
 
-.left-0 {
+.left-2 {
-  left: 0px;
+  left: 0.5rem;
 }
 
-.bottom-0 {
+.bottom-2 {
-  bottom: 0px;
+  bottom: 0.5rem;
 }
 
-.left-1 {
+.clear-both {
-  left: 0.25rem;
+  clear: both;
-}
-
-.bottom-1 {
-  bottom: 0.25rem;
 }
 
 .mx-auto {
@@ -750,32 +746,68 @@ select {
   margin-top: 1rem;
 }
 
+.mb-3 {
+  margin-bottom: 0.75rem;
+}
+
+.mt-10 {
+  margin-top: 2.5rem;
+}
+
+.ml-1 {
+  margin-left: 0.25rem;
+}
+
 .block {
   display: block;
 }
 
+.inline {
+  display: inline;
+}
+
 .flex {
   display: flex;
 }
 
-.grid {
+.h-6 {
-  display: grid;
+  height: 1.5rem;
 }
 
-.h-screen {
+.h-5 {
-  height: 100vh;
+  height: 1.25rem;
+}
+
+.h-4 {
+  height: 1rem;
+}
+
+.min-h-screen {
+  min-height: 100vh;
 }
 
 .w-full {
   width: 100%;
 }
 
-.max-w-screen-lg {
+.w-6 {
-  max-width: 1024px;
+  width: 1.5rem;
 }
 
-.grid-cols-4 {
+.w-5 {
-  grid-template-columns: repeat(4, minmax(0, 1fr));
+  width: 1.25rem;
+}
+
+.w-7 {
+  width: 1.75rem;
+}
+
+.w-4 {
+  width: 1rem;
+}
+
+.max-w-screen-lg {
+  max-width: 1024px;
 }
 
 .flex-col {
@@ -790,6 +822,10 @@ select {
   align-items: center;
 }
 
+.justify-end {
+  justify-content: flex-end;
+}
+
 .justify-center {
   justify-content: center;
 }
@@ -806,6 +842,14 @@ select {
   align-self: center;
 }
 
+.overflow-hidden {
+  overflow: hidden;
+}
+
+.text-ellipsis {
+  text-overflow: ellipsis;
+}
+
 .whitespace-nowrap {
   white-space: nowrap;
 }
@@ -814,6 +858,10 @@ select {
   border-radius: 0.25rem;
 }
 
+.rounded-lg {
+  border-radius: 0.5rem;
+}
+
 .rounded-xl {
   border-radius: 0.75rem;
 }
@@ -828,6 +876,21 @@ select {
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
 }
 
+.bg-green-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(22 163 74 / var(--tw-bg-opacity));
+}
+
+.bg-blue-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(37 99 235 / var(--tw-bg-opacity));
+}
+
+.bg-red-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(220 38 38 / var(--tw-bg-opacity));
+}
+
 .p-4 {
   padding: 1rem;
 }
@@ -841,6 +904,16 @@ select {
   padding-bottom: 0.5rem;
 }
 
+.py-1 {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+.px-2 {
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+
 .pl-3 {
   padding-left: 0.75rem;
 }
@@ -853,6 +926,10 @@ select {
   text-align: center;
 }
 
+.text-right {
+  text-align: right;
+}
+
 .text-4xl {
   font-size: 2.25rem;
   line-height: 2.5rem;
@@ -863,21 +940,21 @@ select {
   line-height: 1.75rem;
 }
 
-.text-lg {
-  font-size: 1.125rem;
-  line-height: 1.75rem;
-}
-
-.text-sm {
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-}
-
 .text-xs {
   font-size: 0.75rem;
   line-height: 1rem;
 }
 
+.text-base {
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+
+.text-lg {
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+
 .font-semibold {
   font-weight: 600;
 }
@@ -887,48 +964,52 @@ select {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
-.text-slate-800 {
-  --tw-text-opacity: 1;
-  color: rgb(30 41 59 / var(--tw-text-opacity));
-}
-
-.text-slate-700 {
-  --tw-text-opacity: 1;
-  color: rgb(51 65 85 / var(--tw-text-opacity));
-}
-
-.text-slate-600 {
-  --tw-text-opacity: 1;
-  color: rgb(71 85 105 / var(--tw-text-opacity));
-}
-
-.text-slate-500 {
-  --tw-text-opacity: 1;
-  color: rgb(100 116 139 / var(--tw-text-opacity));
-}
-
-.text-slate-400 {
-  --tw-text-opacity: 1;
-  color: rgb(148 163 184 / var(--tw-text-opacity));
-}
-
 .text-slate-300 {
   --tw-text-opacity: 1;
   color: rgb(203 213 225 / var(--tw-text-opacity));
 }
 
+.text-red-400 {
+  --tw-text-opacity: 1;
+  color: rgb(248 113 113 / var(--tw-text-opacity));
+}
+
+.shadow-md {
+  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
 .shadow {
   --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.transition {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.duration-200 {
+  transition-duration: 200ms;
+}
+
+.ease-in {
+  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
+}
+
 .dark form label {
   --tw-text-opacity: 1;
   color: rgb(148 163 184 / var(--tw-text-opacity));
 }
 
-.dark form input,.dark select,.dark textarea {
+.dark form input,.dark 
+select,.dark 
+textarea {
   border-width: 1px;
   --tw-border-opacity: 1;
   border-color: rgb(15 23 42 / var(--tw-border-opacity));
@@ -938,16 +1019,69 @@ select {
   color: rgb(241 245 249 / var(--tw-text-opacity));
 }
 
-form input[type=submit] {
+#session-table {
+  display: grid;
+  grid-template-columns: 3fr 1fr repeat(2, 2fr) 0.5fr 1fr;
+}
+
+#button-container button {
+  margin-left: 0.25rem;
+  margin-right: 0.25rem;
+}
+
+.hover\:bg-green-700:hover {
   --tw-bg-opacity: 1;
-  background-color: rgb(88 28 135 / var(--tw-bg-opacity));
+  background-color: rgb(21 128 61 / var(--tw-bg-opacity));
-  padding: 0.5rem;
+}
+
+.hover\:bg-blue-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(29 78 216 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-red-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(185 28 28 / var(--tw-bg-opacity));
 }
 
 .hover\:underline:hover {
   text-decoration-line: underline;
 }
 
+.focus\:outline-none:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+
+.focus\:ring-2:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+
+.focus\:ring-green-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity));
+}
+
+.focus\:ring-blue-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity));
+}
+
+.focus\:ring-red-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity));
+}
+
+.focus\:ring-offset-2:focus {
+  --tw-ring-offset-width: 2px;
+}
+
+.focus\:ring-offset-blue-200:focus {
+  --tw-ring-offset-color: #bfdbfe;
+}
+
 .dark .dark\:border-white {
   --tw-border-opacity: 1;
   border-color: rgb(255 255 255 / var(--tw-border-opacity));
@@ -968,16 +1102,16 @@ form input[type=submit] {
   background-color: rgb(51 65 85 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-slate-400 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(148 163 184 / var(--tw-bg-opacity));
-}
-
 .dark .dark\:text-white {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+.dark .dark\:text-slate-600 {
+  --tw-text-opacity: 1;
+  color: rgb(71 85 105 / var(--tw-text-opacity));
+}
+
 .dark .dark\:text-slate-400 {
   --tw-text-opacity: 1;
   color: rgb(148 163 184 / var(--tw-text-opacity));
@@ -988,11 +1122,6 @@ form input[type=submit] {
   color: rgb(203 213 225 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-slate-600 {
-  --tw-text-opacity: 1;
-  color: rgb(71 85 105 / var(--tw-text-opacity));
-}
-
 @media (min-width: 768px) {
   .md\:block {
     display: block;

games/templates/add.html

@@ -0,0 +1,13 @@
+{% extends "base.html" %}
+
+{% block title %}{{ title }}{% endblock title %}
+
+{% block content %}
+    <form method="post" enctype="multipart/form-data" class="mx-auto">
+        {% csrf_token %}
+
+        {{ form.as_p }}
+
+        <input type="submit" value="Submit"/>
+    </form>
+{% endblock content %}

games/templates/base.html

@@ -0,0 +1,48 @@
+<!doctype html>
+<html lang="en">
+
+    {% load static %}
+
+    <head>
+        <meta charset="utf-8"/>
+        <meta name="description" content="Self-hosted time-tracker."/>
+        <meta name="keywords" content="time, tracking, video games, self-hosted"/>
+        <meta name="viewport" content="width=device-width, initial-scale=1"/>
+        <title>Timetracker - {% block title %}Untitled{% endblock title %}</title>
+        <link rel="stylesheet" href="https://rsms.me/inter/inter.css"/>
+        <link rel="stylesheet" href="{% static 'base.css' %}" />
+    </head>
+
+    <body class="dark">
+        <div class="dark:bg-gray-800 min-h-screen">
+            <nav class="mb-4 bg-white dark:bg-gray-900 border-gray-200 rounded">
+                <div class="container flex flex-wrap items-center justify-between mx-auto">
+                    <a href="{% url 'index' %}" class="flex items-center">
+                        <span class="text-4xl">⌚</span>
+                        <span class="self-center text-xl font-semibold whitespace-nowrap text-white">Timetracker</span>
+                    </a>
+                    <div class="w-full md:block md:w-auto">
+                        <ul
+                            class="flex flex-col md:flex-row p-4 mt-4 dark:text-white">
+                            <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_game' %}">New Game</a></li>
+                            <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_platform' %}">New Platform</a></li>
+                            {% if game_available and platform_available %}
+                                <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_purchase' %}">New Purchase</a></li>
+                            {% endif %}
+                            {% if purchase_available %}
+                                <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_session' %}">New Session</a></li>
+                            {% endif %}
+                            {% if session_count > 0 %}
+                                <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'list_sessions' %}">All Sessions</a></li>
+                            {% endif %}
+                        </ul>
+                    </div>
+                </div>
+            </nav>
+            {% block content %}No content here.{% endblock content %}
+        </div>
+        {% load version %}
+        <span class="fixed left-2 bottom-2 text-xs text-slate-300 dark:text-slate-600">{% version %} ({% version_date %})</span>
+    </body>
+
+</html>

games/templates/index.html

@@ -0,0 +1,17 @@
+{% extends "base.html" %}
+
+{% block title %}{{ title }}{% endblock title %}
+
+{% block content %}
+    <div class="text-slate-300 mx-auto max-w-screen-lg text-center">
+        {% if session_count > 0 %}
+            You have played a total of {{ session_count }} sessions for a total of {{ total_duration }}.
+        {% elif not game_available or not platform_available %}
+            There are no games in the database. Start by clicking "New Game" and "New Platform".
+        {% elif not purchase_available %}
+            There are no owned games. Click "New Purchase" at the top.
+        {% else %}
+            You haven't played any games yet. Click "New Session" to add one now.
+        {% endif %}
+    </div>
+{% endblock content %}

games/templates/list_sessions.html

@@ -0,0 +1,81 @@
+{% extends 'base.html' %}
+
+{% block title %}Sessions{% endblock title %}
+
+{% block content %}
+        <div class="text-center text-xl mb-4 dark:text-slate-400">
+            {% if dataset.count >= 2 %}
+            <img src="data:image/svg+xml;base64,{{ chart|safe }}" class="mx-auto mb-3" />
+            {% endif %}
+            {% if dataset.count >= 1 %}
+            <div class="mb-4">Total playtime: {{ total_duration }} over {{ dataset.count }} sessions.</div>
+            {% endif %}
+            {% if purchase or platform or game %}
+            <a class="text-red-400 inline" href="{% url 'list_sessions' %}"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 inline">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+              </svg>
+              </a><span>Filtering by "{% firstof purchase platform game %}"</span>
+            {% if purchase %}<a class="dark:text-white hover:underline block" href="{% url 'list_sessions_by_game' purchase.game.id %}">See all platforms</a>{% endif %}
+            {% endif %}
+            {% if dataset.count >= 1 %}
+            <a class="clear-both" href="{% url 'start_session' last.purchase.id %}">
+                <button type="button" title="Track last tracked" class="mt-10 py-1 px-2 bg-green-600 hover:bg-green-700 focus:ring-green-500 focus:ring-offset-blue-200 text-white transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 rounded-lg ">
+                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="self-center w-6 h-6 inline">
+                        <path stroke-linecap="round" stroke-linejoin="round" d="M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.348a1.125 1.125 0 010 1.971l-11.54 6.347a1.125 1.125 0 01-1.667-.985V5.653z" />
+                    </svg>
+                    {{ last.purchase }}
+                </button>
+            </a>
+            {% endif %}
+        </div>
+    <div id="session-table" class="gap-4 shadow rounded-xl max-w-screen-lg mx-auto dark:bg-slate-700 p-2 justify-center">
+        <div class="dark:border-white dark:text-slate-300 text-lg">Name</div>
+        <div class="dark:border-white dark:text-slate-300 text-lg">Platform</div>
+        <div class="dark:border-white dark:text-slate-300 text-lg text-center">Start</div>
+        <div class="dark:border-white dark:text-slate-300 text-lg text-center">End</div>
+        <div class="dark:border-white dark:text-slate-300 text-lg">Duration</div>
+        <div class="dark:border-white dark:text-slate-300 text-lg text-right">Manage</div>
+        {% for data in dataset %}
+            <div class="dark:text-white overflow-hidden text-ellipsis whitespace-nowrap"><a class="hover:underline" href="{% url 'list_sessions_by_purchase' data.purchase.id %}">{{ data.purchase.game }}</a></div>
+            <div class="dark:text-white overflow-hidden text-ellipsis whitespace-nowrap"><a class="hover:underline" href="{% url 'list_sessions_by_platform' data.purchase.platform.id %}">{{ data.purchase.platform }}</a></div>
+            <div class="dark:text-slate-400 text-center">{{ data.timestamp_start | date:"d/m/Y H:i" }}</div>
+            <div class="dark:text-slate-400 text-center">
+                {% if data.unfinished %}
+                    <span class="text-red-400">Not finished yet.</span>
+                {% elif data.duration_manual %}
+                    --
+                {% else %}
+                    {{ data.timestamp_end | date:"d/m/Y H:i" }}
+                {% endif %}
+            </div>
+            <div class="dark:text-slate-400 flex">{{ data.duration_formatted }}{% if data.duration_manual %} <svg title="Added manually" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5 ml-1 self-center">
+                <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z" clip-rule="evenodd" />
+              </svg>
+              {% endif %}</div>
+            <div id="button-container" class="flex justify-end">
+                {% if data.unfinished %}
+                    <a href="{% url 'update_session' data.id %}">
+                        <button type="button" title="Set to finished" class="py-1 px-2 flex justify-center items-center  bg-green-600 hover:bg-green-700 focus:ring-green-500 focus:ring-offset-blue-200 text-white transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 w-7 h-4 rounded-lg ">
+                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-4 h-4">
+                                <path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
+                            </svg>
+                        </button>
+                    </a>
+                {% endif %}
+                <button type="button" title="Edit" class="py-1 px-2 flex justify-center items-center  bg-blue-600 hover:bg-blue-700 focus:ring-blue-500 focus:ring-offset-blue-200 text-white transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 w-7 h-4 rounded-lg ">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
+                        <path d="M5.433 13.917l1.262-3.155A4 4 0 017.58 9.42l6.92-6.918a2.121 2.121 0 013 3l-6.92 6.918c-.383.383-.84.685-1.343.886l-3.154 1.262a.5.5 0 01-.65-.65z" />
+                        <path d="M3.5 5.75c0-.69.56-1.25 1.25-1.25H10A.75.75 0 0010 3H4.75A2.75 2.75 0 002 5.75v9.5A2.75 2.75 0 004.75 18h9.5A2.75 2.75 0 0017 15.25V10a.75.75 0 00-1.5 0v5.25c0 .69-.56 1.25-1.25 1.25h-9.5c-.69 0-1.25-.56-1.25-1.25v-9.5z" />
+                    </svg>
+                </button>
+                <a href="{% url 'delete_session' data.id %}">
+                    <button type="button" edit="Delete" class="py-1 px-2 flex justify-center items-center  bg-red-600 hover:bg-red-700 focus:ring-red-500 focus:ring-offset-blue-200 text-white transition ease-in duration-200 text-center text-base font-semibold shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 w-7 h-4 rounded-lg ">
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
+                            <path fill-rule="evenodd" d="M8.75 1A2.75 2.75 0 006 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 10.23 1.482l.149-.022.841 10.518A2.75 2.75 0 007.596 19h4.807a2.75 2.75 0 002.742-2.53l.841-10.52.149.023a.75.75 0 00.23-1.482A41.03 41.03 0 0014 4.193V3.75A2.75 2.75 0 0011.25 1h-2.5zM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 10 4zM8.58 7.72a.75.75 0 00-1.5.06l.3 7.5a.75.75 0 101.5-.06l-.3-7.5zm4.34.06a.75.75 0 10-1.5-.06l-.3 7.5a.75.75 0 101.5.06l.3-7.5z" clip-rule="evenodd" />
+                        </svg>
+                    </button>
+                </a>
+            </div>
+        {% endfor %}
+    </div>
+{% endblock content %}

games/templatetags/version.py

@@ -0,0 +1,24 @@
+import os
+import time
+
+from django import template
+from django.conf import settings
+
+register = template.Library()
+
+
+@register.simple_tag
+def version_date():
+    return time.strftime(
+        "%d-%b-%Y %H:%m",
+        time.gmtime(
+            os.path.getmtime(
+                os.path.abspath(os.path.join(settings.BASE_DIR, "pyproject.toml"))
+            )
+        ),
+    )
+
+
+@register.simple_tag
+def version():
+    return os.environ.get("VERSION_NUMBER", "git-main")

games/urls.py

@@ -0,0 +1,45 @@
+from django.urls import path
+
+from games import views
+
+urlpatterns = [
+    path("", views.index, name="index"),
+    path("add-game/", views.add_game, name="add_game"),
+    path("add-platform/", views.add_platform, name="add_platform"),
+    path("add-session/", views.add_session, name="add_session"),
+    path(
+        "update-session/by-session/<int:session_id>",
+        views.update_session,
+        name="update_session",
+    ),
+    path(
+        "start-session/<int:purchase_id>",
+        views.start_session,
+        name="start_session",
+    ),
+    path(
+        "delete_session/by-id/<int:session_id>",
+        views.delete_session,
+        name="delete_session",
+    ),
+    path("add-purchase/", views.add_purchase, name="add_purchase"),
+    path("list-sessions/", views.list_sessions, name="list_sessions"),
+    path(
+        "list-sessions/by-purchase/<int:purchase_id>",
+        views.list_sessions,
+        {"filter": "purchase"},
+        name="list_sessions_by_purchase",
+    ),
+    path(
+        "list-sessions/by-platform/<int:platform_id>",
+        views.list_sessions,
+        {"filter": "platform"},
+        name="list_sessions_by_platform",
+    ),
+    path(
+        "list-sessions/by-game/<int:game_id>",
+        views.list_sessions,
+        {"filter": "game"},
+        name="list_sessions_by_game",
+    ),
+]

games/views.py

@@ -0,0 +1,136 @@
+from datetime import datetime
+from zoneinfo import ZoneInfo
+
+from common.plots import playtime_over_time_chart
+from common.time import now as now_with_tz
+from django.conf import settings
+from django.shortcuts import redirect, render
+
+from .forms import GameForm, PlatformForm, PurchaseForm, SessionForm
+from .models import Game, Platform, Purchase, Session
+
+
+def model_counts(request):
+    return {
+        "game_available": Game.objects.count() != 0,
+        "platform_available": Platform.objects.count() != 0,
+        "purchase_available": Purchase.objects.count() != 0,
+        "session_count": Session.objects.count(),
+    }
+
+
+def add_session(request):
+    context = {}
+    initial = {}
+
+    now = now_with_tz()
+    initial["timestamp_start"] = now
+
+    last = Session.objects.all().last()
+    if last != None:
+        initial["purchase"] = last.purchase
+
+    form = SessionForm(request.POST or None, initial=initial)
+    if form.is_valid():
+        form.save()
+        return redirect("list_sessions")
+
+    context["title"] = "Add New Session"
+    context["form"] = form
+    return render(request, "add.html", context)
+
+
+def update_session(request, session_id=None):
+    session = Session.objects.get(id=session_id)
+    session.finish_now()
+    session.save()
+    return redirect("list_sessions")
+
+
+def start_session(request, purchase_id=None):
+    session = SessionForm({"purchase": purchase_id, "timestamp_start": now_with_tz()})
+    session.save()
+    return redirect("list_sessions")
+
+
+def delete_session(request, session_id=None):
+    session = Session.objects.get(id=session_id)
+    session.delete()
+    return redirect("list_sessions")
+
+
+def list_sessions(request, filter="", purchase_id="", platform_id="", game_id=""):
+    context = {}
+
+    if filter == "purchase":
+        dataset = Session.objects.filter(purchase=purchase_id)
+        context["purchase"] = Purchase.objects.get(id=purchase_id)
+    elif filter == "platform":
+        dataset = Session.objects.filter(purchase__platform=platform_id)
+        context["platform"] = Platform.objects.get(id=platform_id)
+    elif filter == "game":
+        dataset = Session.objects.filter(purchase__game=game_id)
+        context["game"] = Game.objects.get(id=game_id)
+    else:
+        # by default, sort from newest to oldest
+        dataset = Session.objects.all().order_by("-timestamp_start")
+
+    for session in dataset:
+        if session.timestamp_end == None and session.duration_manual.seconds == 0:
+            session.timestamp_end = datetime.now(ZoneInfo(settings.TIME_ZONE))
+            session.unfinished = True
+
+    context["total_duration"] = dataset.total_duration()
+    context["dataset"] = dataset
+    # cannot use dataset[0] here because that might be only partial QuerySet
+    context["last"] = Session.objects.all().order_by("timestamp_start").last()
+    # charts are always oldest->newest
+    if Session.objects.count() >= 2:
+        context["chart"] = playtime_over_time_chart(dataset.order_by("timestamp_start"))
+
+    return render(request, "list_sessions.html", context)
+
+
+def add_purchase(request):
+    context = {}
+    now = datetime.now()
+    initial = {"date_purchased": now}
+    form = PurchaseForm(request.POST or None, initial=initial)
+    if form.is_valid():
+        form.save()
+        return redirect("index")
+
+    context["form"] = form
+    context["title"] = "Add New Purchase"
+    return render(request, "add.html", context)
+
+
+def add_game(request):
+    context = {}
+    form = GameForm(request.POST or None)
+    if form.is_valid():
+        form.save()
+        return redirect("index")
+
+    context["form"] = form
+    context["title"] = "Add New Game"
+    return render(request, "add.html", context)
+
+
+def add_platform(request):
+    context = {}
+    form = PlatformForm(request.POST or None)
+    if form.is_valid():
+        form.save()
+        return redirect("index")
+
+    context["form"] = form
+    context["title"] = "Add New Platform"
+    return render(request, "add.html", context)
+
+
+def index(request):
+    context = {}
+    context["total_duration"] = Session().duration_sum
+    context["title"] = "Index"
+    return render(request, "index.html", context)

manage.py

@@ -6,7 +6,7 @@ import sys
 
 def main():
     """Run administrative tasks."""
-    os.environ.setdefault("DJANGO_SETTINGS_MODULE", "web.settings")
+    os.environ.setdefault("DJANGO_SETTINGS_MODULE", "timetracker.settings")
     try:
         from django.core.management import execute_from_command_line
     except ImportError as exc:

pyproject.toml

@@ -1,20 +1,34 @@
 [tool.poetry]
 name = "timetracker"
-version = "0.0.0"
+version = "1.0.0"
 description = "A simple time tracker."
 authors = ["Lukáš Kucharczyk <lukas@kucharczyk.xyz>"]
 license = "GPL"
 readme = "README.md"
+packages = [{include = "timetracker"}]
 
 [tool.poetry.dependencies]
 python = "^3.10"
 django = "^4.1.4"
+gunicorn = "^20.1.0"
+uvicorn = "^0.20.0"
+pandas = "^1.5.2"
+matplotlib = "^3.6.3"
 
 [tool.poetry.group.dev.dependencies]
 black = "^22.12.0"
 mypy = "^0.991"
 pyyaml = "^6.0"
+pytest = "^7.2.0"
+django-extensions = "^3.2.1"
+werkzeug = "^2.2.2"
+djhtml = "^1.5.2"
+djlint = "^1.19.11"
+isort = "^5.11.4"
 
 [build-system]
 requires = ["poetry-core"]
 build-backend = "poetry.core.masonry.api"
+
+[tool.poetry.scripts]
+timetracker-import = "common.import_data:import_from_file"

src/input.css

@@ -1,15 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-form label {
-    @apply dark:text-slate-400;
-}
-
-form input,select,textarea {
-    @apply dark:bg-slate-500 dark:border dark:border-slate-900 dark:text-slate-100;
-}
-
-form input[type=submit] {
-    @apply p-2 bg-purple-900;
-}

src/timelogger/timelogger.py

@@ -1,3 +0,0 @@
-import logging
-
-logging.basicConfig(level=logging.ERROR, filename="timelogger.log")

src/web/tracker/fixtures/sample.yaml

@@ -1,98 +0,0 @@
-- model: tracker.game
-  pk: 1
-  fields:
-    name: Nioh 2
-    wikidata: Q67482292
-- model: tracker.game
-  pk: 2
-  fields:
-    name: Elden Ring
-    wikidata: Q64826862
-- model: tracker.game
-  pk: 3
-  fields:
-    name: Cyberpunk 2077
-    wikidata: Q3182559
-- model: tracker.purchase
-  pk: 1
-  fields:
-    game: 1
-    platform: 1
-    date_purchased: 2021-02-13
-    date_refunded: null
-- model: tracker.purchase
-  pk: 2
-  fields:
-    game: 2
-    platform: 1
-    date_purchased: 2022-02-24
-    date_refunded: null
-- model: tracker.purchase
-  pk: 3
-  fields:
-    game: 3
-    platform: 1
-    date_purchased: 2020-12-07
-    date_refunded: null
-- model: tracker.platform
-  pk: 1
-  fields:
-    name: Steam
-    group: PC
-- model: tracker.platform
-  pk: 3
-  fields:
-    name: Xbox Gamepass
-    group: PC
-- model: tracker.platform
-  pk: 4
-  fields:
-    name: Epic Games Store
-    group: PC
-- model: tracker.platform
-  pk: 5
-  fields:
-    name: Playstation 5
-    group: Playstation
-- model: tracker.platform
-  pk: 6
-  fields:
-    name: Playstation 4
-    group: Playstation
-- model: tracker.platform
-  pk: 7
-  fields:
-    name: Nintendo Switch
-    group: Nintendo
-- model: tracker.platform
-  pk: 8
-  fields:
-    name: Nintendo 3DS
-    group: Nintendo
-- model: tracker.session
-  pk: 1
-  fields:
-    purchase: 2
-    timestamp_start: 2022-12-31 14:25:58+00:00
-    timestamp_end: 2022-12-31 16:25:22+00:00
-    duration_manual: null
-    duration_calculated: null
-    note: ''
-- model: tracker.session
-  pk: 3
-  fields:
-    purchase: 3
-    timestamp_start: 2023-01-01 22:00:23+00:00
-    timestamp_end: 2023-01-01 23:28:23+00:00
-    duration_manual: null
-    duration_calculated: null
-    note: ''
-- model: tracker.session
-  pk: 4
-  fields:
-    purchase: 3
-    timestamp_start: 2020-01-01 23:29:17+00:00
-    timestamp_end: 2020-01-01 23:29:17+00:00
-    duration_manual: '12:00:00'
-    duration_calculated: null
-    note: ''

src/web/tracker/models.py

@@ -1,54 +0,0 @@
-from django.db import models
-from datetime import timedelta
-
-
-class Game(models.Model):
-    name = models.CharField(max_length=255)
-    wikidata = models.CharField(max_length=50)
-
-    def __str__(self):
-        return self.name
-
-
-class Purchase(models.Model):
-    game = models.ForeignKey("Game", on_delete=models.CASCADE)
-    platform = models.ForeignKey("Platform", on_delete=models.CASCADE)
-    date_purchased = models.DateField()
-    date_refunded = models.DateField(blank=True, null=True)
-
-    def __str__(self):
-        return f"{self.game} ({self.platform})"
-
-
-class Platform(models.Model):
-    name = models.CharField(max_length=255)
-    group = models.CharField(max_length=255)
-
-    def __str__(self):
-        return self.name
-
-
-class Session(models.Model):
-    purchase = models.ForeignKey("Purchase", on_delete=models.CASCADE)
-    timestamp_start = models.DateTimeField()
-    timestamp_end = models.DateTimeField(blank=True, null=True)
-    duration_manual = models.DurationField(blank=True, null=True)
-    duration_calculated = models.DurationField(blank=True, null=True)
-    note = models.TextField(blank=True, null=True)
-
-    def __str__(self):
-        mark = ", manual" if self.duration_manual != None else ""
-        return f"{str(self.purchase)} {str(self.timestamp_start.date())} ({self.total_duration()}{mark})"
-
-    def calculated_duration(self):
-        if self.timestamp_end == None or self.timestamp_start == None:
-            return 0
-        else:
-            return self.timestamp_end - self.timestamp_start
-
-    def total_duration(self):
-        return (
-            self.calculated_duration()
-            if self.duration_manual == None
-            else self.duration_manual + self.calculated_duration()
-        )

src/web/tracker/templates/add.html

@@ -1,13 +0,0 @@
-{% extends 'base.html' %}
-
-{% block title %}{{ title }}{% endblock title %}
-
-{% block content %}
-<form method="POST" enctype="multipart/form-data" class="mx-auto">
-    {% csrf_token %}
-
-    {{ form.as_p }}
-
-    <input type="submit" value="Submit">
-</form>
-{% endblock content %}

src/web/tracker/templates/add_purchase.html

@@ -1,13 +0,0 @@
-{% extends 'base.html' %}
-
-{% block title %}Add New Purchase{% endblock title %}
-
-{% block content %}
-<form method="POST" enctype="multipart/form-data" class="mx-auto">
-    {% csrf_token %}
-
-    {{ form.as_p }}
-
-    <input type="submit" value="Submit">
-</form>
-{% endblock content %}

src/web/tracker/templates/add_session.html

@@ -1,13 +0,0 @@
-{% extends 'base.html' %}
-
-{% block title %}Add New Session{% endblock title %}
-
-{% block content %}
-<form method="POST" enctype="multipart/form-data" class="mx-auto">
-    {% csrf_token %}
-
-    {{ form.as_p }}
-
-    <input type="submit" value="Submit">
-</form>
-{% endblock content %}

src/web/tracker/templates/base.html

@@ -1,39 +0,0 @@
-<!doctype html>
-<html lang="en">
-
-{% load static %}
-
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Timetracker - {% block title %}Untitled{% endblock title %}</title>
-    <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
-    <link rel="stylesheet" href="{% static 'base.css' %}" />
-</head>
-
-<body class="dark">
-    <div class="dark:bg-gray-800 h-screen">
-        <nav class="mb-4 bg-white dark:bg-gray-900 border-gray-200 rounded">
-            <div class="container flex flex-wrap items-center justify-between mx-auto">
-                <a href="#" class="flex items-center">
-                    <span class="text-4xl">⌚</span>
-                    <span class="self-center text-xl font-semibold whitespace-nowrap text-white">Timetracker</span>
-                </a>
-                <div class="w-full md:block md:w-auto">
-                    <ul
-                        class="flex flex-col md:flex-row p-4 mt-4 dark:text-white">
-                        <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_game' %}">New Game</a></li>
-                        <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_purchase' %}">New Purchase</a></li>
-                        <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'add_session' %}">New Session</a></li>
-                        <li><a class="block py-2 pl-3 pr-4 hover:underline" href="{% url 'list_sessions' %}">All Sessions</a></li>
-                    </ul>
-                </div>
-            </div>
-        </nav>
-        {% block content %}No content here.{% endblock %}
-    </div>
-    {% load version %}
-    <span id="version-info" class="absolute left-1 bottom-1 text-xs text-slate-300 dark:text-slate-600">{% version %} ({% version_date %})</span>
-</body>
-
-</html>

src/web/tracker/templates/list_sessions.html

@@ -1,24 +0,0 @@
-{% extends 'base.html' %}
-
-{% block title %}Sessions{% endblock title %}
-
-{% block content %}
-{% if purchase %}
-<div class="text-center text-xl mb-4 dark:text-slate-400">
-    <h1>Listing sessions only for purchase "{{ purchase }}"</h1>
-    <a class="dark:text-white hover:underline" href="{% url 'list_sessions' %}">View all sessions</a>
-</div>
-{% endif %}
-<div class="grid grid-cols-4 gap-4 shadow rounded-xl max-w-screen-lg mx-auto dark:bg-slate-700 p-2 justify-center">
-    <div class="dark:border-white dark:text-slate-300 text-lg">Name</div>
-    <div class="dark:border-white dark:text-slate-300 text-lg">Start</div>
-    <div class="dark:border-white dark:text-slate-300 text-lg">End</div>
-    <div class="dark:border-white dark:text-slate-300 text-lg">Duration</div>
-    {% for data in dataset %}
-    <div class=""><a class="dark:text-white hover:underline" href="{% url 'list_sessions' data.purchase.id %}">{{ data.purchase }}</a></div>
-    <div class="dark:text-slate-400">{{ data.timestamp_start | date:"d/m/Y H:i" }}</div>
-    <div class="dark:text-slate-400">{{ data.timestamp_end | date:"d/m/Y H:i" }}</div>
-    <div class="dark:text-slate-400">{{ data.time_delta }}</div>
-    {% endfor %}
-</div>
-{% endblock content %}

src/web/tracker/templatetags/version.py

@@ -1,18 +0,0 @@
-from django import template
-import time
-import os
-
-register = template.Library()
-
-
-@register.simple_tag
-def version_date():
-    return time.strftime(
-        "%d-%b-%Y %H:%m",
-        time.gmtime(os.path.getmtime(os.path.abspath(os.path.join(".git")))),
-    )
-
-
-@register.simple_tag
-def version():
-    return os.environ.get("VERSION_NUMBER", "UNKNOWN VERSION")

src/web/tracker/urls.py

@@ -1,15 +0,0 @@
-from django.urls import path
-
-from . import views
-
-urlpatterns = [
-    path("add-game/", views.add_game, name="add_game"),
-    path("add-session/", views.add_session, name="add_session"),
-    path("add-purchase/", views.add_purchase, name="add_purchase"),
-    path("list-sessions/", views.list_sessions, name="list_sessions"),
-    path(
-        "list-sessions/by-purchase/<int:purchase_id>",
-        views.list_sessions,
-        name="list_sessions",
-    ),
-]

src/web/tracker/views.py

@@ -1,61 +0,0 @@
-from django.shortcuts import render
-
-from .models import Game, Platform, Purchase, Session
-from .forms import SessionForm, PurchaseForm, GameForm
-from datetime import datetime
-from django.db.models import ExpressionWrapper, F, DurationField
-import logging
-
-
-def add_session(request):
-    context = {}
-    now = datetime.now()
-    initial = {"timestamp_start": now, "timestamp_end": now}
-    form = SessionForm(request.POST or None, initial=initial)
-    if form.is_valid():
-        form.save()
-
-    context["form"] = form
-    return render(request, "add_session.html", context)
-
-
-def list_sessions(request, purchase_id=None):
-    context = {}
-
-    if purchase_id != None:
-        dataset = Session.objects.filter(purchase=purchase_id)
-        context["purchase"] = Purchase.objects.get(id=purchase_id)
-    else:
-        dataset = Session.objects.all()
-
-    dataset = dataset.annotate(
-        time_delta=ExpressionWrapper(
-            F("timestamp_end") - F("timestamp_start"), output_field=DurationField()
-        )
-    )
-    context["dataset"] = dataset
-
-    return render(request, "list_sessions.html", context)
-
-
-def add_purchase(request):
-    context = {}
-    now = datetime.now()
-    initial = {"date_purchased": now}
-    form = PurchaseForm(request.POST or None, initial=initial)
-    if form.is_valid():
-        form.save()
-
-    context["form"] = form
-    return render(request, "add_purchase.html", context)
-
-
-def add_game(request):
-    context = {}
-    form = GameForm(request.POST or None)
-    if form.is_valid():
-        form.save()
-
-    context["form"] = form
-    context["title"] = "Add New Game"
-    return render(request, "add.html", context)

tailwind.config.js

@@ -1,6 +1,6 @@
 module.exports = {
     darkMode: 'class',
-    content: ["./src/**/*.{html,js}"],
+    content: ["./**/*.{html,js}"],
     theme: {
         fontFamily: {
             sans: ['Inter', 'sans-serif'],

tests/test_time.py

@@ -0,0 +1,93 @@
+import unittest
+from datetime import timedelta
+
+from common.time import format_duration
+
+
+class FormatDurationTest(unittest.TestCase):
+    def setUp(self) -> None:
+
+        return super().setUp()
+
+    def test_only_days(self):
+        delta = timedelta(days=3)
+        result = format_duration(delta, "%d days")
+        self.assertEqual(result, "3 days")
+
+    def test_only_hours(self):
+        delta = timedelta(hours=1)
+        result = format_duration(delta, "%H hours")
+        self.assertEqual(result, "1 hours")
+
+    def test_overflow_hours(self):
+        delta = timedelta(hours=25)
+        result = format_duration(delta, "%H hours")
+        self.assertEqual(result, "25 hours")
+
+    def test_overflow_hours_into_days(self):
+        delta = timedelta(hours=25)
+        result = format_duration(delta, "%d days, %H hours")
+        self.assertEqual(result, "1 days, 1 hours")
+
+    def test_only_minutes(self):
+        delta = timedelta(minutes=34)
+        result = format_duration(delta, "%m minutes")
+        self.assertEqual(result, "34 minutes")
+
+    def test_only_overflow_minutes(self):
+        delta = timedelta(minutes=61)
+        result = format_duration(delta, "%m minutes")
+        self.assertEqual(result, "61 minutes")
+
+    def test_overflow_minutes_into_hours(self):
+        delta = timedelta(minutes=61)
+        result = format_duration(delta, "%H hours, %m minutes")
+        self.assertEqual(result, "1 hours, 1 minutes")
+
+    def test_only_overflow_seconds(self):
+        delta = timedelta(seconds=61)
+        result = format_duration(delta, "%s seconds")
+        self.assertEqual(result, "61 seconds")
+
+    def test_overflow_seconds_into_minutes(self):
+        delta = timedelta(seconds=61)
+        result = format_duration(delta, "%m minutes, %s seconds")
+        self.assertEqual(result, "1 minutes, 1 seconds")
+
+    def test_only_rawseconds(self):
+        delta = timedelta(seconds=5690)
+        result = format_duration(delta, "%r total seconds")
+        self.assertEqual(result, "5690 total seconds")
+
+    def test_empty(self):
+        delta = timedelta()
+        result = format_duration(delta, "")
+        self.assertEqual(result, "")
+
+    def test_zero(self):
+        delta = timedelta()
+        result = format_duration(delta, "%r seconds")
+        self.assertEqual(result, "0 seconds")
+
+    def test_all_at_once(self):
+        delta = timedelta(days=50, hours=10, minutes=34, seconds=24)
+        result = format_duration(
+            delta, "%d days, %H hours, %m minutes, %s seconds, %r total seconds"
+        )
+        self.assertEqual(
+            result, "50 days, 10 hours, 34 minutes, 24 seconds, 4358064 total seconds"
+        )
+
+    def test_negative(self):
+        delta = timedelta(hours=-2)
+        result = format_duration(delta, "%H hours")
+        self.assertEqual(result, "0 hours")
+
+    def test_none(self):
+        try:
+            format_duration(None)
+        except TypeError as exc:
+            assert False, f"format_duration(None) raised an exception {exc}"
+
+    def test_number(self):
+        self.assertEqual(format_duration(3600, "%H hour"), "1 hour")

timetracker/asgi.py

@@ -1,5 +1,5 @@
 """
-ASGI config for web project.
+ASGI config for timetracker project.
 
 It exposes the ASGI callable as a module-level variable named ``application``.
 
@@ -11,6 +11,6 @@ import os
 
 from django.core.asgi import get_asgi_application
 
-os.environ.setdefault("DJANGO_SETTINGS_MODULE", "web.settings")
+os.environ.setdefault("DJANGO_SETTINGS_MODULE", "timetracker.settings")
 
 application = get_asgi_application()

timetracker/settings.py

@@ -1,5 +1,5 @@
 """
-Django settings for web project.
+Django settings for timetracker project.
 
 Generated by 'django-admin startproject' using Django 4.1.4.
 
@@ -10,9 +10,8 @@ For the full list of settings and their values, see
 https://docs.djangoproject.com/en/4.1/ref/settings/
 """
 
-from pathlib import Path
-import logging
 import os
+from pathlib import Path
 
 # Build paths inside the project like this: BASE_DIR / 'subdir'.
 BASE_DIR = Path(__file__).resolve().parent.parent
@@ -25,7 +24,7 @@ BASE_DIR = Path(__file__).resolve().parent.parent
 SECRET_KEY = "django-insecure-x0_t$gei=_o_p(%%!-db$jezka@y+d67$a8tvw13nl^8$l*t@="
 
 # SECURITY WARNING: don't run with debug turned on in production!
-DEBUG = True
+DEBUG = False if os.environ.get("PROD") else True
 
 ALLOWED_HOSTS = ["*"]
 
@@ -33,8 +32,7 @@ ALLOWED_HOSTS = ["*"]
 # Application definition
 
 INSTALLED_APPS = [
-    "tracker.apps.TrackerConfig",
+    "games.apps.GamesConfig",
-    "django.contrib.admin",
     "django.contrib.auth",
     "django.contrib.contenttypes",
     "django.contrib.sessions",
@@ -42,6 +40,10 @@ INSTALLED_APPS = [
     "django.contrib.staticfiles",
 ]
 
+if DEBUG:
+    INSTALLED_APPS.append("django_extensions")
+    INSTALLED_APPS.append("django.contrib.admin")
+
 MIDDLEWARE = [
     "django.middleware.security.SecurityMiddleware",
     "django.contrib.sessions.middleware.SessionMiddleware",
@@ -52,7 +54,7 @@ MIDDLEWARE = [
     "django.middleware.clickjacking.XFrameOptionsMiddleware",
 ]
 
-ROOT_URLCONF = "web.urls"
+ROOT_URLCONF = "timetracker.urls"
 
 TEMPLATES = [
     {
@@ -65,12 +67,13 @@ TEMPLATES = [
                 "django.template.context_processors.request",
                 "django.contrib.auth.context_processors.auth",
                 "django.contrib.messages.context_processors.messages",
+                "games.views.model_counts",
             ],
         },
     },
 ]
 
-WSGI_APPLICATION = "web.wsgi.application"
+WSGI_APPLICATION = "timetracker.wsgi.application"
 
 
 # Database
@@ -108,7 +111,7 @@ AUTH_PASSWORD_VALIDATORS = [
 
 LANGUAGE_CODE = "en-us"
 
-TIME_ZONE = os.environ.get("TZ", "UTC")
+TIME_ZONE = "Europe/Prague" if DEBUG else os.environ.get("TZ", "UTC")
 
 USE_I18N = True
 
@@ -119,6 +122,7 @@ USE_TZ = True
 # https://docs.djangoproject.com/en/4.1/howto/static-files/
 
 STATIC_URL = "static/"
+STATIC_ROOT = BASE_DIR / "static"
 
 # Default primary key field type
 # https://docs.djangoproject.com/en/4.1/ref/settings/#default-auto-field
@@ -129,8 +133,19 @@ DEFAULT_AUTO_FIELD = "django.db.models.BigAutoField"
 LOGGING = {
     "version": 1,
     "disable_existing_loggers": False,
-    "handlers": {"console": {"class": "logging.StreamHandler"}},
+    "handlers": {
-    "root": {"handlers": ["console"], "level": "WARNING"},
+        "console": {"class": "logging.StreamHandler"},
+    },
+    "loggers": {
+        "django": {
+            "handlers": ["console"],
+            "level": "INFO",
+        },
+    },
 }
 
-CSRF_TRUSTED_ORIGINS = ["https://tracker.kucharczyk.xyz"]
+_csrf_trusted_origins = os.environ.get("CSRF_TRUSTED_ORIGINS")
+if _csrf_trusted_origins:
+    CSRF_TRUSTED_ORIGINS = _csrf_trusted_origins.split(",")
+else:
+    CSRF_TRUSTED_ORIGINS = []

timetracker/urls.py

@@ -1,4 +1,4 @@
-"""web URL Configuration
+"""timetracker URL Configuration
 
 The `urlpatterns` list routes URLs to views. For more information please see:
     https://docs.djangoproject.com/en/4.1/topics/http/urls/
@@ -13,13 +13,15 @@ Including another URLconf
     1. Import the include() function: from django.urls import include, path
     2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
 """
+from django.conf import settings
 from django.contrib import admin
 from django.urls import include, path
 from django.views.generic import RedirectView
 
-
 urlpatterns = [
-    path("admin/", admin.site.urls),
     path("", RedirectView.as_view(url="/tracker/list-sessions")),
-    path("tracker/", include("tracker.urls")),
+    path("tracker/", include("games.urls")),
 ]
+
+if settings.DEBUG:
+    urlpatterns.append(path("admin/", admin.site.urls))

timetracker/wsgi.py

@@ -1,5 +1,5 @@
 """
-WSGI config for web project.
+WSGI config for timetracker project.
 
 It exposes the WSGI callable as a module-level variable named ``application``.
 
@@ -11,6 +11,6 @@ import os
 
 from django.core.wsgi import get_wsgi_application
 
-os.environ.setdefault("DJANGO_SETTINGS_MODULE", "web.settings")
+os.environ.setdefault("DJANGO_SETTINGS_MODULE", "timetracker.settings")
 
 application = get_wsgi_application()