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 used = 0
export let disable_warnings = false
$: frac = used / total
</script>
@@ -21,46 +22,50 @@ $: frac = used / total
</div>
</div>
{#if frac > 2.0}
<div class="highlight_red">
<span class="warn_text">You are using more than 200% of your allowed storage space!</span>
<p>
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
supports the volume of storage which you need.
</p>
<a class="button button_highlight" href="/#pro">
<i class="icon">bolt</i> Upgrade options
</a>
</div>
{:else if frac > 1.0}
<div class="highlight_red">
<p>
You have used all of your storage space. You won't be able to
upload new files anymore. Please upgrade to a higher support
tier to continue uploading files.
</p>
<a class="button button_highlight" href="/#pro">
<i class="icon">bolt</i> Upgrade options
</a>
<p>
Your files will not be deleted any sooner than normal at this
moment. When your storage usage is over 200% we will start
deleting your files to free up the space.
</p>
</div>
{:else if frac > 0.8}
<div class="highlight_yellow">
<p>
You have used {(frac*100).toFixed(0)}% of your
storage space. If your storage space runs out you won't be able
to upload new files anymore. Please upgrade to a higher support
tier to continue uploading files.
</p>
<a class="button button_highlight" href="/#pro">
<i class="icon">bolt</i> Upgrade options
</a>
</div>
{#if !disable_warnings}
{#if frac > 2.0}
<div class="highlight_red">
<span class="warn_text">
You are using more than 200% of your allowed storage space!
</span>
<p>
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
supports the volume of storage which you need.
</p>
<a class="button button_highlight" href="/#pro">
<i class="icon">bolt</i> Upgrade options
</a>
</div>
{:else if frac > 1.0}
<div class="highlight_red">
<p>
You have used all of your storage space. You won't be able to
upload new files anymore. Please upgrade to a higher support
tier to continue uploading files.
</p>
<a class="button button_highlight" href="/#pro">
<i class="icon">bolt</i> Upgrade options
</a>
<p>
Your files will not be deleted any sooner than normal at this
moment. When your storage usage is over 200% we will start
deleting your files to free up the space.
</p>
</div>
{:else if frac > 0.8}
<div class="highlight_yellow">
<p>
You have used {(frac*100).toFixed(0)}% of your
storage space. If your storage space runs out you won't be able
to upload new files anymore. Please upgrade to a higher support
tier to continue uploading files.
</p>
<a class="button button_highlight" href="/#pro">
<i class="icon">bolt</i> Upgrade options
</a>
</div>
{/if}
{/if}
<style>

View File

@@ -3,11 +3,10 @@ import { onMount } from "svelte";
import HotlinkProgressBar from "../HotlinkProgressBar.svelte";
import StorageProgressBar from "../StorageProgressBar.svelte";
let transfer_cap = 0
let transfer_used = 0
let storage_used = window.user.storage_space_used
let storage_limit = window.user.subscription.storage_space
let fs_storage_limit = window.user.subscription.filesystem_storage_limit
let load_direct_bw = () => {
let today = new Date()
let start = new Date()
@@ -43,11 +42,20 @@ onMount(() => {
</script>
Storage space used:
<StorageProgressBar used={storage_used} total={storage_limit}/>
Total storage space used:
<StorageProgressBar used={window.user.storage_space_used} total={storage_limit}/>
<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:
(<a href="/user/sharing/bandwidth">set custom limit</a>)
<HotlinkProgressBar used={transfer_used} total={transfer_cap}></HotlinkProgressBar>