import { h } from "@stencil/core";
import { useTranslation } from "../../utils/utils";
import { ProgressBar } from "./progress-bar";
import { configStore, storageUsageStore } from "../../store/store";
export const ZStorageUsage = () => {
    const t = useTranslation();
    const maxStorage = configStore.get('package').maxStorage;
    const usedStorage = storageUsageStore.get('usage');
    return (h("div", { class: "ml-auto flex flex-row gap-1 justify-end items-center text-xs w-60 whitespace-nowrap" }, t('quick_message.storage_quota'), h(ProgressBar, { percentage: (usedStorage / maxStorage * 100) }), `${usedStorage}GB / ${maxStorage || 0}GB`));
};
