Migrate to flatfile and get login,logout and basic dashboard functional

Co-authored-by: Audrey Roy Greenfeld <[email protected]>

Author: pydanny

examples/adv_app2.py

@@ -0,0 +1,87 @@
+from fasthtml.common import *
+from fasthtml.jupyter import *
+from functools import partial
+from dataclasses import dataclass
+from hmac import compare_digest
+from monsterui.all import *
+
+db = database(':memory:')
+
+class User: name:str; pwd:str
+
+class Todo:
+    id:int; title:str; done:bool; name:str; details:str; priority:int
+
+db.users = db.create(User, transform=True, pk='name')
+db.todos = db.create(Todo, transform=True)
+
+
+def user_auth_before(req, sess):
+    auth = req.scope['auth'] = sess.get('auth', None)
+    if not auth: return login_redir
+    db.todos.xtra(name=auth)
+
+beforeware = Beforeware(
+    user_auth_before,
+    skip=[r'/favicon\.ico', r'/static/.*', r'.*\.css', r'.*\.js', '/login']
+)
+
+
+app, rt = fast_app(hdrs=Theme.blue.headers(),before=beforeware)
+
+login_redir = Redirect('/login')
+
+
+@rt
+def index(auth):
+    top = Grid(Div(A('logout', href='/logout'), style='text-align: right'))
+    # We don't normally need separate "screens" for adding or editing data. Here for instance,
+    # we're using an `hx-post` to add a new todo, which is added to the start of the list (using 'afterbegin').
+    new_inp = Input(id="new-title", name="title", placeholder="New Todo")
+    add = Form(Group(new_inp, Button("Add")),
+               hx_post="/", target_id='todo-list', hx_swap="afterbegin")
+    # In the MiniDataAPI spec, treating a table as a callable (i.e with `todos(...)` here) queries the table.
+    # Because we called `xtra` in our Beforeware, this queries the todos for the current user only.
+    # We can include the todo objects directly as children of the `Form`, because the `Todo` class has `__ft__` defined.
+    # This is automatically called by FastHTML to convert the `Todo` objects into `FT` objects when needed.
+    # The reason we put the todo list inside a form is so that we can use the 'sortable' js library to reorder them.
+    # That library calls the js `end` event when dragging is complete, so our trigger here causes our `/reorder`
+    # handler to be called.
+    frm = Form(*db.todos(order_by='priority'),
+               id='todo-list', cls='sortable', hx_post="/reorder", hx_trigger="end")
+    # We create an empty 'current-todo' Div at the bottom of our page, as a target for the details and editing views.
+    card = Card(Ul(frm), header=add, footer=Div(id='current-todo'))
+    # PicoCSS uses `<Main class='container'>` page content; `Container` is a tiny function that generates that.
+    # A handler can return either a single `FT` object or string, or a tuple of them.
+    # In the case of a tuple, the stringified objects are concatenated and returned to the browser.
+    # The `Title` tag has a special purpose: it sets the title of the page.
+    return Titled(f"{auth}'s Todo list", Container(top, card))
+
+
+@rt('/login')
+def get():
+    frm = Form(
+        LabelInput("Name", name='name'),
+        LabelInput("Password", name='pwd'),
+        Button('login'),
+        action='/login', method='post')
+    return Titled("Login", frm, cls=ContainerT.sm)
+
+@dataclass
+class Login: name:str; pwd:str
+
+@rt("/login")
+def post(login:Login, sess):
+    if not login.name or not login.pwd: return login_redir
+    try: u = db.users[login.name]
+    except NotFoundError: u = db.users.insert(login)
+    if not compare_digest(u.pwd.encode("utf-8"), login.pwd.encode("utf-8")): return login_redir
+    sess['auth'] = u.name
+    return Redirect('/')
+
+@app.get("/logout")
+def logout(sess):
+    del sess['auth']
+    return login_redir    
+
+serve()