8000 Refactor loading indicators to use consistent UI components by NatalliaBukhtsik · Pull Request #495 · Nine-Minds/alga-psa · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Refactor loading indicators to use consistent UI components #495

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

Merged
merged 1 commit into from
May 19, 2025
Merged

Refactor loading indicators to use consistent UI components #495

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
Unified Diff View
Unified
Diff view
7 changes: 3 additions & 4 deletions server/src/components/billing-dashboard/EditPlanServiceQuantityDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {
import { Button } from '../ui/Button';
import { Input } from '../ui/Input';
import { Label } from '../ui/Label';
import { Loader2 } from 'lucide-react'; // For loading spinner
import LoadingIndicator from 'server/src/components/ui/LoadingIndicator';

export interface EditPlanServiceQuantityDialogProps {
isOpen: boolean;
Expand Down Expand Up @@ -159,8 +159,7 @@ export function EditPlanServiceQuantityDialog({
>
{isSaving ? (
<>
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
Saving...
<LoadingIndicator spinnerProps={{ size: "xs" }} text="Saving..." className="mr-2" />
</>
) : (
'Save Quantity'
Expand All @@ -170,4 +169,4 @@ export function EditPlanServiceQuantityDialog({
</DialogContent>
</Dialog>
);
}
}
2 changes: 1 addition & 1 deletion server/src/components/billing-dashboard/FixedPlanServicesList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
import React, { useState, useEffect, useCallback } from 'react';
import { Card, Box } from '@radix-ui/themes';
import { Button } from 'server/src/components/ui/Button';
import { Plus, MoreVertical, Loader2, HelpCircle } from 'lucide-react'; // Added Loader2, HelpCircle
import { Plus, MoreVertical, HelpCircle } from 'lucide-react';
import {
DropdownMenu,
DropdownMenuContent,
Expand Down
2 changes: 1 addition & 1 deletion server/src/components/billing-dashboard/billing-plans/FixedPlanConfiguration.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { Card, CardContent, CardHeader, CardTitle } from 'server/src/components/
import { Switch } from 'server/src/components/ui/Switch';
import CustomSelect from 'server/src/components/ui/CustomSelect';
import { Alert, AlertDescription } from 'server/src/components/ui/Alert';
import { AlertCircle, Loader2 } from 'lucide-react';
import { AlertCircle } from 'lucide-react';
import { Button } from 'server/src/components/ui/Button';
import Spinner from 'server/src/components/ui/Spinner';
import LoadingIndicator from 'server/src/components/ui/LoadingIndicator';
Expand Down
7 changes: 4 additions & 3 deletions server/src/components/billing-dashboard/billing-plans/PlanTypeRouter.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@
'use client'

import React, { useState, useEffect, useCallback } from 'react';
import { Loader2, AlertCircle } from 'lucide-react';
import { AlertCircle } from 'lucide-react';
import LoadingIndicator from 'server/src/components/ui/LoadingIndicator';
import { Alert, AlertDescription } from 'server/src/components/ui/Alert';
import { getBillingPlanById } from 'server/src/lib/actions/billingPlanAction';
import { IBillingPlan } from 'server/src/interfaces/billing.interfaces';
Expand Down Expand Up @@ -45,7 +46,7 @@ export function PlanTypeRouter({ planId }: PlanTypeRouterProps) {
}, [fetchPlanType]);

if (loading) {
return <div className="flex justify-center items-center p-8"><Loader2 className="h-8 w-8 animate-spin" /> Loading Plan...</div>;
return <div className="flex justify-center items-center p-8"><LoadingIndicator spinnerProps={{ size: "sm" }} text="Loading Plan..." /></div>;
}

if (error) {
Expand Down Expand Up @@ -74,4 +75,4 @@ export function PlanTypeRouter({ planId }: PlanTypeRouterProps) {
</Alert>
);
}
}
}
4 changes: 2 additions & 2 deletions server/src/components/ui/EntityAvatar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import * as React from 'react';
import { generateEntityColor } from 'server/src/utils/colorUtils';
import { cn } from 'server/src/lib/utils';
import { Loader2 } from 'lucide-react';
import Spinner from 'server/src/components/ui/Spinner';

export type EntityAvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
export type ImageLoadingStatus = 'idle' | 'loading' | 'loaded' | 'error';
Expand Down Expand Up @@ -137,7 +137,7 @@ export const EntityAvatar: React.FC<EntityAvatarProps> = ({
{/* Loading shimmer effect */}
{showShimmer && (
<div className="absolute inset-0 flex items-center justify-center bg-gray-100 animate-pulse rounded-full overflow-hidden">
<Loader2 className="h-1/3 w-1/3 text-gray-400 animate-spin opacity-70" />
<Spinner size="xs" className="opacity-70" />
</div>
)}

Expand Down
4 changes: 2 additions & 2 deletions server/src/components/ui/EntityImageUpload.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import * as React from 'react';
import { useState, useRef, useTransition } from 'react';
import { toast } from 'react-hot-toast';
import { Pen, Loader2, Trash2, Upload } from 'lucide-react';
import { Pen, Trash2, Upload } from 'lucide-react';
import LoadingIndicator from 'server/src/components/ui/LoadingIndicator';
import { Button } from 'server/src/components/ui/Button';
import UserAvatar from 'server/src/components/ui/UserAvatar';
Expand Down Expand Up @@ -289,7 +289,7 @@ const EntityImageUpload: React.FC<EntityImageUploadProps> = ({
className="w-fit"
data-automation-id={`delete-${entityType}-image-button`}
>
{isPendingDelete ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : <Trash2 className="mr-2 h-4 w-4" />}
{isPendingDelete ? <LoadingIndicator spinnerProps={{ size: "xs" }} text="Deleting..." className="mr-2" /> : <Trash2 className="mr-2 h-4 w-4" />}
Delete
</Button>
)}
Expand Down
5 changes: 3 additions & 2 deletions server/src/components/user-activities/ActivityDetailViewerDrawer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ import { useDrawer } from "server/src/context/DrawerContext";
import { useActivitiesCache } from "server/src/hooks/useActivitiesCache";
import { getConsolidatedTicketData } from "server/src/lib/actions/ticket-actions/optimizedTicketActions";
import { useTenant } from "server/src/components/TenantProvider";
import { Loader2, AlertCircle } from 'lucide-react';
import { AlertCircle } from 'lucide-react';
import Spinner from 'server/src/components/ui/Spinner';
import { getTicketById } from "server/src/lib/actions/ticket-actions/ticketActions";
import { getTaskWithDetails } from "server/src/lib/actions/project-actions/projectTaskActions";
import { getTaskDetails } from "server/src/lib/actions/workflow-actions/taskInboxActions";
Expand Down Expand Up @@ -381,7 +382,7 @@ export function ActivityDetailViewerDrawer({
if (isLoading) {
return (
<div className="flex items-center justify-center h-full">
<Loader2 className="h-8 w-8 animate-spin text-gray-400" />
<Spinner size="sm" />
</div>
);
}
Expand Down
Loading
0