Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update colors, remove test creation buttons from dashboard pages #162

Merged
merged 7 commits into from
Jun 17, 2024
Merged

Update colors, remove test creation buttons from dashboard pages #162

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d6ab550
update colors in dark mode
eliang-stripe Jun 15, 2024
6d5905a
prettier
eliang-stripe Jun 15, 2024
5c7779d
fix tools entry point color
eliang-stripe Jun 15, 2024
490074f
prettier
eliang-stripe Jun 15, 2024
f58f077
adjust colors, remove test data creation buttons from dashboard pages
eliang-stripe Jun 17, 2024
7069e15
Merge branch 'master' into eliang/color-updates
eliang-stripe Jun 17, 2024
563ce2e
tweak test payments modal
eliang-stripe Jun 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 0 additions & 21 deletions app/(dashboard)/payments/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,37 +13,16 @@ import CreatePaymentsButton from '@/app/components/testdata/CreatePaymentsButton

export default function Payments() {
const {data: session} = useSession();
const [buttonLoading, setButtonLoading] = React.useState(false);
const [loading, setLoading] = React.useState(true);

React.useEffect(() => {
setLoading(!session?.user.setup);
}, [session?.user.setup]);

const onClick = async () => {
setButtonLoading(true);
try {
const res = await fetch('/api/setup_accounts/create_charges', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
});

if (res.ok) {
setButtonLoading(false);
window.location.reload();
}
} catch (e) {
console.log('Error with creating test data: ', e);
}
};

return (
<>
<div className="flex flex-row items-center justify-between">
<h1 className="text-3xl font-bold">Payments</h1>
<CreatePaymentsButton classes="bg-accent text-accent-foreground hover:bg-[#24A55B]" />
</div>
<div className="flex flex-col gap-3 md:gap-5 lg:flex-row">
<div className="flex-1">
Expand Down
2 changes: 0 additions & 2 deletions app/(dashboard)/payouts/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import CreatePayoutsButton from '@/app/components/testdata/CreatePayoutsButton';

export default function Payouts() {
const {data: session} = useSession();
const [buttonLoading, setButtonLoading] = React.useState(false);
const [loading, setLoading] = React.useState(true);

React.useEffect(() => {
Expand All @@ -22,7 +21,6 @@ export default function Payouts() {
<>
<div className="flex flex-row items-center justify-between">
<h1 className="text-3xl font-bold">Payouts</h1>
<CreatePayoutsButton classes="bg-accent text-accent-foreground hover:bg-[#24A55B]" />
</div>
<Container>
<h1 className="ml-1 text-xl font-bold">Recent payouts</h1>
Expand Down
4 changes: 0 additions & 4 deletions app/(dashboard)/pets/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,6 @@ export default function Pets() {
<>
<div className="flex">
<h1 className="flex-1 text-3xl font-bold">Pets</h1>
<Button className="gap-2 bg-accent text-base font-bold text-accent-foreground transition">
<PlusIcon size={20}></PlusIcon>
New Pet
</Button>
</div>
<div className="grid grid-cols-2 gap-2 sm:grid-cols-2 md:gap-4 lg:grid-cols-3 xl:grid-cols-4">
{pets.map((pet, key) => {
Expand Down
6 changes: 0 additions & 6 deletions app/(dashboard)/settings/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,15 +11,10 @@ import EmbeddedComponentContainer from '@/app/components/EmbeddedComponentContai
import {useSession} from 'next-auth/react';
import EditAccountButton from '@/app/components/EditAccountButton';
import {Link} from '@/components/ui/link';
import {Button} from '@/components/ui/button';
import {LoaderCircle, Plus} from 'lucide-react';
import bcrypt from 'bcryptjs';
import CreateInterventionsButton from '@/app/components/testdata/CreateInterventionsButton';

export default function Settings() {
const {data: session} = useSession();
const [showPassword, setShowPassword] = React.useState(false);
const [buttonLoading, setButtonLoading] = React.useState(false);
const email = session?.user.email;
const businessName = session?.user.businessName;
const password = session?.user.password;
Expand Down Expand Up @@ -72,7 +67,6 @@ export default function Settings() {
</h2>
</header>
</div>
<CreateInterventionsButton classes="bg-accent text-accent-foreground hover:bg-[#24A55B] justify-end" />
</div>
<EmbeddedComponentContainer>
<div className="flex flex-col space-y-4">
Expand Down
2 changes: 1 addition & 1 deletion app/components/CustomersWidget.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const CustomersWidget = () => {
<SparkLineChart
data={[0, 10, 5, 20, 10, 10, 0, 25, 25, 55, 35, 35, 40]}
height={55}
colors={['#DEDDE1']}
colors={['#23840240']}
curve="natural"
className="w-full"
/>
Expand Down
2 changes: 1 addition & 1 deletion app/components/MonthToDateWidget.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const MonthToDateWidget = () => {
<SparkLineChart
data={[0, 10, 25, 20, 15, 5, 30, 40, 55, 40, 45, 55]}
height={55}
colors={['#DEDDE1']}
colors={['#23840240']}
curve="natural"
className="right-0 w-full"
/>
Expand Down
8 changes: 4 additions & 4 deletions app/components/Screen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,13 +31,13 @@ export default function Screen({

{/* Furever site container */}
<div
className={`h-screen origin-left overflow-scroll transition duration-500 ease-in-out
${open ? 'shadow-xl md:translate-x-[325px] md:scale-[0.6] md:rounded-xl md:border lg:scale-[0.66] xl:scale-[0.73]' : 'h-full min-h-screen w-full flex-col sm:flex-row'}
className={`origin-left overflow-hidden transition duration-500 ease-in-out md:h-screen
${open ? 'shadow-xl md:translate-x-[325px] md:scale-[0.6] md:rounded-xl md:border md:border-[1.5px] lg:scale-[0.66] xl:scale-[0.73]' : 'h-full min-h-screen w-full flex-col sm:flex-row'}
${theme == 'light' ? 'bg-paw-pattern bg-[size:426px]' : 'bg-screen-background'}`}
>
<Nav />
<div className="mt-[74px] flex flex-1 justify-center p-3 pb-20 sm:ml-52 sm:mt-0 sm:p-8 lg:ml-64">
<div className="flex grow flex-col gap-y-4 md:gap-y-5">
<div className="mt-[74px] flex h-full grow justify-center overflow-scroll overscroll-contain p-3 pb-20 sm:ml-52 sm:mt-0 sm:mt-0 sm:p-8 lg:ml-64">
<div className="flex grow flex-col gap-y-4 after:pb-8 md:gap-y-5">
<OnboardingDialog />
{children}
</div>
Expand Down
3 changes: 2 additions & 1 deletion app/components/testdata/CreateFinancialCreditButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,10 +45,11 @@ export default function CreateFinancialCreditButton({
};
return (
<Button
className={`${classes || 'rounded-lg border border-[#D8DEE4] py-1 text-sm font-medium shadow'}`}
className={`${classes || 'border'}`}
variant="secondary"
onClick={onClick}
disabled={buttonLoading}
size="sm"
>
Create test financial credit
{buttonLoading && (
Expand Down
3 changes: 2 additions & 1 deletion app/components/testdata/CreateInterventionsButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,11 @@ export default function CreateInterventionsButton({
};
return (
<Button
className={`${classes || 'rounded-lg border py-1 text-sm font-medium shadow'}`}
className={`${classes || 'border'}`}
variant="secondary"
onClick={onClick}
disabled={buttonLoading}
size="sm"
>
Create test risk intervention
{buttonLoading && (
Expand Down
158 changes: 78 additions & 80 deletions app/components/testdata/CreatePaymentsButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,7 @@ export default function CreatePaymentsButton({classes}: {classes?: string}) {
const form = useForm<z.infer<typeof formSchema>>({
resolver: zodResolver(formSchema),
defaultValues: {
count: '',
count: '1',
amount: '',
status: 'card_successful',
currency: 'usd',
Expand Down Expand Up @@ -156,89 +156,86 @@ export default function CreatePaymentsButton({classes}: {classes?: string}) {
<>
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
<div className="flex flex-col space-y-2">
<FormField
control={form.control}
name="count"
render={({field}) => (
<FormItem>
<FormLabel>Count</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="pb-3">
<FormField
control={form.control}
name="amount"
render={({field}) => (
<FormItem>
<FormLabel>Amount</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="pb-3">
<FormField
control={form.control}
name="status"
render={({field}) => (
<FormItem>
<FormLabel>Status</FormLabel>
<FormControl>
<Select
{...field}
onValueChange={(value) => field.onChange(value)}
>
<SelectTrigger className="mt-1">
<SelectValue>
{statusLabels[field.value as PMType]}
</SelectValue>
</SelectTrigger>
<SelectContent>
{Object.keys(statusLabels).map((key: string) => (
<SelectItem key={key} value={key}>
{statusLabels[key as PMType]}
</SelectItem>
))}
</SelectContent>
</Select>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<div className="pb-3">
<FormField
control={form.control}
name="currency"
render={({field}) => (
<FormItem>
<FormLabel>Currency</FormLabel>
<FormControl>
<CurrencySelect field={field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
<FormField
control={form.control}
name="count"
render={({field}) => (
<FormItem>
<FormLabel>Number of payments</FormLabel>
<FormControl>
<Input {...field} type="number" />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="amount"
render={({field}) => (
<FormItem>
<FormLabel>Amount</FormLabel>
<FormControl>
<Input
{...field}
placeholder="Leave blank for a random amount"
type="number"
step="0.01"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="status"
render={({field}) => (
<FormItem>
<FormLabel>Payment status</FormLabel>
<FormControl>
<Select
{...field}
onValueChange={(value) => field.onChange(value)}
>
<SelectTrigger className="mt-1">
<SelectValue>
{statusLabels[field.value as PMType]}
</SelectValue>
</SelectTrigger>
<SelectContent>
{Object.keys(statusLabels).map((key: string) => (
<SelectItem key={key} value={key}>
{statusLabels[key as PMType]}
</SelectItem>
))}
</SelectContent>
</Select>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="currency"
render={({field}) => (
<FormItem>
<FormLabel>Currency</FormLabel>
<FormControl>
<CurrencySelect field={field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<div className="flew-row flex justify-end space-x-2">
<DialogClose asChild>
<Button type="button" variant="secondary">
Cancel
</Button>
</DialogClose>
<Button variant="default" type="submit">
<Button variant="default" type="submit" disabled={loading}>
Create payments{' '}
{loading && (
<LoaderCircle
Expand All @@ -258,13 +255,14 @@ export default function CreatePaymentsButton({classes}: {classes?: string}) {
<Dialog>
<DialogTrigger asChild>
<Button
className={`${classes || 'rounded-lg border py-1 text-sm font-medium shadow'}`}
className={`${classes || 'border'}`}
variant="secondary"
size="sm"
>
Create test payments
</Button>
</DialogTrigger>
<DialogContent className="text-primary sm:max-w-[425px]">
<DialogContent className="p-4 text-primary sm:max-w-[425px]">
<DialogHeader>
<DialogTitle>Create test payments</DialogTitle>
<DialogDescription>
Expand Down
3 changes: 2 additions & 1 deletion app/components/testdata/CreatePayoutsButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,11 @@ export default function CreatePayoutsButton({classes}: {classes?: string}) {
};
return (
<Button
className={`${classes || 'rounded-lg border py-1 text-sm font-medium shadow'}`}
className={`${classes || 'border'}`}
variant="secondary"
onClick={onClick}
disabled={buttonLoading}
size="sm"
>
Create test payouts
{buttonLoading && (
Expand Down
9 changes: 7 additions & 2 deletions app/contexts/themes/ThemeConstants.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,12 +34,17 @@ export const DarkTheme = {
buttonSecondaryColorBackground: '#292E38',
buttonSecondaryColorText: '#C9CED8',

badgeNeutralColorBackground: '#252B37',
badgeNeutralColorText: '#E2E5F0',
badgeNeutralColorBorder: '#3E4554',

badgeSuccessColorBackground: '#0c4223',
badgeSuccessColorText: '#43C67A',
badgeSuccessColorBorder: '#156236',
badgeWarningColorBackground: '#632013',

badgeWarningColorBackground: '#400A00',
badgeWarningColorText: '#F98A23',
badgeWarningColorBorder: '#400A00',
badgeWarningColorBorder: '#632013',

badgeDangerColorBackground: '#400a00',
badgeDangerColorText: '#C95B4D',
Expand Down
4 changes: 2 additions & 2 deletions app/globals.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
*,
::before,
::after {
@apply dark:border-gray-700;
@apply dark:border-neutral-700;
}

:root {
Expand Down Expand Up @@ -63,7 +63,7 @@

--success: #0c4223;
--success-border: #156236;
--success-foreground: #1e884b;
--success-foreground: #27ae60;

--destructive: #400a00;
--destructive-border: #632013;
Expand Down
Loading
Loading