Add filesystem storage limit to usage card

This commit is contained in:
2024-07-11 14:02:59 +02:00
parent 94cc04b746
commit 4e0e446fc8
2 changed files with 58 additions and 45 deletions

View File

@@ -4,6 +4,7 @@ import ProgressBar from "../util/ProgressBar.svelte";
export let total = 0 export let total = 0
export let used = 0 export let used = 0
export let disable_warnings = false
$: frac = used / total $: frac = used / total
</script> </script>
@@ -21,9 +22,12 @@ $: frac = used / total
</div> </div>
</div> </div>
{#if frac > 2.0} {#if !disable_warnings}
{#if frac > 2.0}
<div class="highlight_red"> <div class="highlight_red">
<span class="warn_text">You are using more than 200% of your allowed storage space!</span> <span class="warn_text">
You are using more than 200% of your allowed storage space!
</span>
<p> <p>
We have started deleting your files to free up space. If you do not We have started deleting your files to free up space. If you do not
want to lose any more files please upgrade to a subscription which want to lose any more files please upgrade to a subscription which
@@ -33,7 +37,7 @@ $: frac = used / total
<i class="icon">bolt</i> Upgrade options <i class="icon">bolt</i> Upgrade options
</a> </a>
</div> </div>
{:else if frac > 1.0} {:else if frac > 1.0}
<div class="highlight_red"> <div class="highlight_red">
<p> <p>
You have used all of your storage space. You won't be able to You have used all of your storage space. You won't be able to
@@ -49,7 +53,7 @@ $: frac = used / total
deleting your files to free up the space. deleting your files to free up the space.
</p> </p>
</div> </div>
{:else if frac > 0.8} {:else if frac > 0.8}
<div class="highlight_yellow"> <div class="highlight_yellow">
<p> <p>
You have used {(frac*100).toFixed(0)}% of your You have used {(frac*100).toFixed(0)}% of your
@@ -61,6 +65,7 @@ $: frac = used / total
<i class="icon">bolt</i> Upgrade options <i class="icon">bolt</i> Upgrade options
</a> </a>
</div> </div>
{/if}
{/if} {/if}
<style> <style>

View File

@@ -3,11 +3,10 @@ import { onMount } from "svelte";
import HotlinkProgressBar from "../HotlinkProgressBar.svelte"; import HotlinkProgressBar from "../HotlinkProgressBar.svelte";
import StorageProgressBar from "../StorageProgressBar.svelte"; import StorageProgressBar from "../StorageProgressBar.svelte";
let transfer_cap = 0 let transfer_cap = 0
let transfer_used = 0 let transfer_used = 0
let storage_used = window.user.storage_space_used
let storage_limit = window.user.subscription.storage_space let storage_limit = window.user.subscription.storage_space
let fs_storage_limit = window.user.subscription.filesystem_storage_limit
let load_direct_bw = () => { let load_direct_bw = () => {
let today = new Date() let today = new Date()
let start = new Date() let start = new Date()
@@ -43,11 +42,20 @@ onMount(() => {
</script> </script>
Storage space used: Total storage space used:
<StorageProgressBar used={storage_used} total={storage_limit}/> <StorageProgressBar used={window.user.storage_space_used} total={storage_limit}/>
<br/> <br/>
{#if window.user.subscription.filesystem_access === true}
Filesystem storage space used:
<StorageProgressBar
used={window.user.filesystem_storage_used}
total={fs_storage_limit > 0 ? fs_storage_limit : storage_limit}
disable_warnings
/>
<br/>
{/if}
Premium data transfer: Premium data transfer:
(<a href="/user/sharing/bandwidth">set custom limit</a>) (<a href="/user/sharing/bandwidth">set custom limit</a>)
<HotlinkProgressBar used={transfer_used} total={transfer_cap}></HotlinkProgressBar> <HotlinkProgressBar used={transfer_used} total={transfer_cap}></HotlinkProgressBar>