Add breadcrumbs

This commit is contained in:
jaina heartles 2022-12-14 02:57:53 -08:00
parent 27ee0ecd5d
commit ee059ac36c
4 changed files with 52 additions and 16 deletions

View file

@ -90,6 +90,8 @@ pub fn EndpointRequest(comptime Endpoint: type) type {
body: Body, body: Body,
query: Query, query: Query,
mount_path: []const u8,
const args_middleware = //if (Args == void) const args_middleware = //if (Args == void)
//mdw.injectContext(.{ .args = {} }) //mdw.injectContext(.{ .args = {} })
//else //else
@ -120,6 +122,8 @@ fn CallApiEndpoint(comptime Endpoint: type) type {
.args = ctx.args, .args = ctx.args,
.body = ctx.body, .body = ctx.body,
.query = ctx.query_params, .query = ctx.query_params,
.mount_path = if (@hasField(@TypeOf(ctx), "mounted_at")) ctx.mounted_at else "",
}; };
var response = Response{ .headers = http.Fields.init(ctx.allocator), .res = res }; var response = Response{ .headers = http.Fields.init(ctx.allocator), .res = res };

View file

@ -245,8 +245,22 @@ const drive = struct {
const info = try srv.driveGet(req.args.path); const info = try srv.driveGet(req.args.path);
defer util.deepFree(srv.allocator, info); defer util.deepFree(srv.allocator, info);
var breadcrumbs = std.ArrayList([]const u8).init(srv.allocator);
defer breadcrumbs.deinit();
var iter = util.PathIter.from(req.args.path);
while (iter.next()) |p| {
std.log.debug("breadcrumb: {s}", .{p});
try breadcrumbs.append(if (p.len != 0) p else continue);
}
switch (info) { switch (info) {
.dir => |dir| try res.template(.ok, srv, dir_tmpl, .{ .dir = dir }), .dir => |dir| try res.template(.ok, srv, dir_tmpl, .{
.dir = dir,
.breadcrumbs = breadcrumbs.items,
.mount_path = req.mount_path,
.base_drive_path = "drive",
}),
else => unreachable, else => unreachable,
} }
} }

View file

@ -1,29 +1,42 @@
<div class="drive"> <div class="drive">
<ol class="breadcrumbs">
<li><a href="{.mount_path}/{.base_drive_path}/">/</a></li>
{#for .breadcrumbs |$crumb, $i| =}
<li><a href="{.mount_path}/{.base_drive_path}
{= #for @slice(.breadcrumbs, 0, $i) |$c|}/{$c}{/for =}
/{$crumb}">{$crumb}</a></li>
{/for =}
</ol>
<table class="directory-listing"> <table class="directory-listing">
{#for .dir.children.? |$child| =} {#for .dir.children.? |$child| =}
<tr> <tr>
{#switch $child case dir |$dir| =} {#switch $child case dir |$dir| =}
<td class="icon"></td> <td class="icons"><i class="fa-solid fa-folder-closed fa-fw"></i></td>
<td class="icon"><i class="fa-solid fa-folder-closed"></i></td> <td class="name">
<td class="name"><a href="./{$dir.name.?}">{$dir.name.?}</a></td> <a href="{.mount_path}/{.base_drive_path}{= #for @slice(.breadcrumbs, 0, .breadcrumbs.len) |$c|}/{$c}{/for =}/{$dir.name.?}">
{$dir.name.?}
</a>
</td>
{#case file |$file|} {#case file |$file|}
<td class="icon"> <td class="icons">
{= #if %user |$u|} {#if %user |$u|}
{#if $u.avatar_file_id == $file.meta.id =} {#if $u.avatar_file_id == $file.meta.id =}
<i class="fa-solid fa-user"></i> <i class="fa-solid fa-user fa-fw"></i>
{= #elif $u.header_file_id == $file.meta.id =} {= #elif $u.header_file_id == $file.meta.id =}
<i class="fa-solid fa-heading"></i> <i class="fa-solid fa-heading fa-fw"></i>
{= /if =} {= /if =}
{= /if =} {= /if}
</td> {#if $file.meta.sensitive =}
<td class="icon"> <i class="fa-solid fa-eye-slash fa-fw"></i>
{= #if $file.meta.sensitive =}
<i class="fa-solid fa-eye-slash"></i>
{= #else =} {= #else =}
<i class="fa-solid fa-file"></i> <i class="fa-solid fa-file fa-fw"></i>
{= /if =} {= /if}
</td>
<td class="name">
<a href="{.mount_path}/{.base_drive_path}{= #for @slice(.breadcrumbs, 0, .breadcrumbs.len) |$c|}/{$c}{/for =}/{$file.name.?}">
{$file.name.?}
</a>
</td> </td>
<td class="name"><a href="./{$file.name.?}">{$file.name.?}</a></td>
<td class="content-type">{#if $file.meta.content_type |$t|}{$t}{/if}</td> <td class="content-type">{#if $file.meta.content_type |$t|}{$t}{/if}</td>
<td class="size">{$file.meta.size}</td> <td class="size">{$file.meta.size}</td>
<td class="created-at">{$file.meta.created_at}</td> <td class="created-at">{$file.meta.created_at}</td>

View file

@ -218,3 +218,8 @@ button:hover, a.button:hover {
} }
} }
.drive .icons {
display: flex;
justify-content: flex-end;
vertical-align: bottom;
}