@axium/storage 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { formatBytes } from '@axium/core/format';
|
|
3
3
|
import { forMime as iconForMime } from '@axium/core/icons';
|
|
4
4
|
import { FormDialog, Icon } from '@axium/server/lib';
|
|
5
|
-
import { deleteItem, getDirectoryMetadata,
|
|
5
|
+
import { deleteItem, getDirectoryMetadata, updateItemMetadata } from '@axium/storage/client';
|
|
6
6
|
import type { StorageItemMetadata } from '@axium/storage/common';
|
|
7
7
|
|
|
8
8
|
const { id }: { id: string } = $props();
|
|
@@ -35,10 +35,16 @@
|
|
|
35
35
|
{/if}
|
|
36
36
|
{/snippet}
|
|
37
37
|
|
|
38
|
-
<div class="
|
|
38
|
+
<div class="StorageList">
|
|
39
39
|
{#await getDirectoryMetadata(id).then(data => (items = data)) then}
|
|
40
|
+
<div class="StorageListItem header">
|
|
41
|
+
<span></span>
|
|
42
|
+
<span>Name</span>
|
|
43
|
+
<span>Last Modified</span>
|
|
44
|
+
<span>Size</span>
|
|
45
|
+
</div>
|
|
40
46
|
{#each items as item, i (item.id)}
|
|
41
|
-
<div class="
|
|
47
|
+
<div class="StorageListItem">
|
|
42
48
|
<Icon i={iconForMime(item.type)} />
|
|
43
49
|
<span class="name">{item.name}</span>
|
|
44
50
|
<span>{item.modifiedAt.toLocaleString()}</span>
|
|
@@ -48,7 +54,7 @@
|
|
|
48
54
|
{@render action('delete', 'delete', i)}
|
|
49
55
|
</div>
|
|
50
56
|
{:else}
|
|
51
|
-
<i>
|
|
57
|
+
<i>Empty.</i>
|
|
52
58
|
{/each}
|
|
53
59
|
{:catch error}
|
|
54
60
|
<i style:color="#c44">{error.message}</i>
|
|
@@ -59,7 +65,7 @@
|
|
|
59
65
|
bind:dialog={dialogs.rename}
|
|
60
66
|
submitText="Rename"
|
|
61
67
|
submit={async (data: { name: string }) => {
|
|
62
|
-
await
|
|
68
|
+
await updateItemMetadata(activeItem.id, data);
|
|
63
69
|
activeItem.name = data.name;
|
|
64
70
|
}}
|
|
65
71
|
>
|
|
@@ -93,25 +99,38 @@
|
|
|
93
99
|
</FormDialog>
|
|
94
100
|
|
|
95
101
|
<style>
|
|
96
|
-
.
|
|
102
|
+
.StorageList {
|
|
97
103
|
display: flex;
|
|
98
104
|
flex-direction: column;
|
|
99
|
-
gap: 0.5em;
|
|
100
105
|
padding: 0.5em;
|
|
101
106
|
}
|
|
102
107
|
|
|
103
|
-
.
|
|
108
|
+
.StorageListItem.header {
|
|
109
|
+
font-weight: bold;
|
|
110
|
+
border-bottom: 1px solid #bbc;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.StorageListItem {
|
|
104
114
|
display: grid;
|
|
105
115
|
grid-template-columns: 1em 4fr 15em 5em repeat(1em, 3);
|
|
106
116
|
align-items: center;
|
|
107
117
|
gap: 0.5em;
|
|
108
118
|
}
|
|
109
119
|
|
|
120
|
+
.StorageListItem:not(:last-child) {
|
|
121
|
+
padding: 0.5em 0;
|
|
122
|
+
border-bottom: 1px solid #bbc;
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
.StorageListItem:not(.header):hover {
|
|
126
|
+
background-color: #8888;
|
|
127
|
+
}
|
|
128
|
+
|
|
110
129
|
.action {
|
|
111
130
|
visibility: hidden;
|
|
112
131
|
}
|
|
113
132
|
|
|
114
|
-
.
|
|
133
|
+
.StorageListItem:hover .action {
|
|
115
134
|
visibility: visible;
|
|
116
135
|
}
|
|
117
136
|
|