Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy.git synced 2026-07-22 14:25:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: improve formatting and readability in billing and users components

Browse Source 
- Enhanced code readability by adjusting formatting in the ShowBilling component, ensuring consistent line breaks and indentation.
- Updated the ShowUsers component to improve the layout of the warning message for users with custom roles without a valid license, maintaining clarity in the alert presentation.
This commit is contained in:
Mauricio Siu
2026-03-17 23:17:30 -06:00
parent bade36ea9d
commit 1fa4d5b2ba
2 changed files with 40 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
apps/dokploy/components/dashboard/settings/billing/show-billing.tsx
View File

@@ -92,7 +92,9 @@ export const ShowBilling = () => {
const utils = api.useUtils(); const utils = api.useUtils();
const [hobbyServerQuantity, setHobbyServerQuantity] = useState(1); const [hobbyServerQuantity, setHobbyServerQuantity] = useState(1);
const [startupServerQuantity, setStartupServerQuantity] = useState(STARTUP_SERVERS_INCLUDED); const [startupServerQuantity, setStartupServerQuantity] = useState(
STARTUP_SERVERS_INCLUDED,
);
const [isAnnual, setIsAnnual] = useState(false); const [isAnnual, setIsAnnual] = useState(false);
const [upgradeTier, setUpgradeTier] = useState<"hobby" | "startup" | null>( const [upgradeTier, setUpgradeTier] = useState<"hobby" | "startup" | null>(
null, null,
@@ -699,7 +701,8 @@ export const ShowBilling = () => {
<p className="text-xs text-muted-foreground mt-2"> <p className="text-xs text-muted-foreground mt-2">
$ $
{( {(
calculatePriceHobby(hobbyServerQuantity, true) / 12 calculatePriceHobby(hobbyServerQuantity, true) /
12
).toFixed(2)} ).toFixed(2)}
/mo /mo
</p> </p>
@@ -826,7 +829,10 @@ export const ShowBilling = () => {
<p className="text-xs text-muted-foreground mt-2"> <p className="text-xs text-muted-foreground mt-2">
$ $
{( {(
calculatePriceStartup(startupServerQuantity, true) / 12 calculatePriceStartup(
startupServerQuantity,
true,
) / 12
).toFixed(2)} ).toFixed(2)}
/mo /mo
</p> </p>
@@ -863,7 +869,8 @@ export const ShowBilling = () => {
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Button <Button
disabled={ disabled={
startupServerQuantity <= STARTUP_SERVERS_INCLUDED startupServerQuantity <=
STARTUP_SERVERS_INCLUDED
} }
variant="outline" variant="outline"
size="icon" size="icon"
@@ -894,7 +901,9 @@ export const ShowBilling = () => {
variant="outline" variant="outline"
size="icon" size="icon"
className="h-8 w-8" className="h-8 w-8"
onClick={() => setStartupServerQuantity((q) => q + 1)} onClick={() =>
setStartupServerQuantity((q) => q + 1)
}
> >
<PlusIcon className="h-4 w-4" /> <PlusIcon className="h-4 w-4" />
</Button> </Button>
@@ -1025,7 +1034,10 @@ export const ShowBilling = () => {
<p className="text-base font-semibold tracking-tight text-muted-foreground"> <p className="text-base font-semibold tracking-tight text-muted-foreground">
${" "} ${" "}
{( {(
calculatePrice(hobbyServerQuantity, isAnnual) / 12 calculatePrice(
hobbyServerQuantity,
isAnnual,
) / 12
).toFixed(2)}{" "} ).toFixed(2)}{" "}
/ Month USD / Month USD
</p> </p>
@@ -1033,9 +1045,10 @@ export const ShowBilling = () => {
) : ( ) : (
<p className="text-2xl font-semibold tracking-tight text-primary "> <p className="text-2xl font-semibold tracking-tight text-primary ">
${" "} ${" "}
{calculatePrice(hobbyServerQuantity, isAnnual).toFixed( {calculatePrice(
2, hobbyServerQuantity,
)}{" "} isAnnual,
).toFixed(2)}{" "}
USD USD
</p> </p>
)} )}
@@ -1089,7 +1102,9 @@ export const ShowBilling = () => {
onClick={() => { onClick={() => {
if (hobbyServerQuantity <= 1) return; if (hobbyServerQuantity <= 1) return;
setHobbyServerQuantity(hobbyServerQuantity - 1); setHobbyServerQuantity(
hobbyServerQuantity - 1,
);
}} }}
> >
<MinusIcon className="h-4 w-4" /> <MinusIcon className="h-4 w-4" />
@@ -1106,7 +1121,9 @@ export const ShowBilling = () => {
<Button <Button
variant="outline" variant="outline"
onClick={() => { onClick={() => {
setHobbyServerQuantity(hobbyServerQuantity + 1); setHobbyServerQuantity(
hobbyServerQuantity + 1,
);
}} }}
> >
<PlusIcon className="h-4 w-4" /> <PlusIcon className="h-4 w-4" />

24
apps/dokploy/components/dashboard/settings/users/show-users.tsx
View File

@@ -80,18 +80,18 @@ export const ShowUsers = () => {
</div> </div>
) : ( ) : (
<div className="flex flex-col gap-4 min-h-[25vh]"> <div className="flex flex-col gap-4 min-h-[25vh]">
{hasCustomRolesWithoutLicense && ( {hasCustomRolesWithoutLicense && (
<AlertBlock type="warning"> <AlertBlock type="warning">
You have{" "} You have{" "}
{membersWithCustomRoles?.length === 1 {membersWithCustomRoles?.length === 1
? "1 user" ? "1 user"
: `${membersWithCustomRoles?.length} users`}{" "} : `${membersWithCustomRoles?.length} users`}{" "}
assigned to custom roles. Custom roles will not work assigned to custom roles. Custom roles will not work
without a valid Enterprise license. Please activate without a valid Enterprise license. Please activate your
your license or change these users to a free role license or change these users to a free role (Admin or
(Admin or Member). Member).
</AlertBlock> </AlertBlock>
)} )}
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow> <TableRow>