Feat/calendar 1x1 redesign

src/context/free-widget/use-widget-operations.ts

@@ -208,7 +208,7 @@ export function useWidgetOperations({
 				w.instanceId === instanceId ? { ...w, meta } : w
 			)
 
-			showToast('مدل ویجت با موفقیت تغییر کرد', 'success')
+			playNativeToastSound('success')
 			return commitMutation('resize', layoutWithMeta, instanceId)
 		},
 		[

src/context/wallpaper.context.tsx

@@ -9,7 +9,6 @@ import { translateError } from '@/common/utils/translate-error'
 import Analytics from '@/analytics'
 import { showToast } from '@/common/toast'
 import { useQueryClient } from '@tanstack/react-query'
-import { playAlarm } from '@/common/play-alarm'
 import { useAuth } from '@/context/auth.context'
 
 import { getRandomWallpaper } from '@/services/hooks/wallpapers/get-wallpaper-categories.hook'
@@ -184,7 +183,6 @@ export function WallpaperProvider({ children }: { children: React.ReactNode }) {
 			if (wallpaper.coin && !wallpaper.isOwned) {
 				showToast('هووورا! تصویر زمینه فعال شد 🎉', 'success')
 				queryClient.invalidateQueries({ queryKey: ['userProfile'] })
-				playAlarm('market')
 			}
 
 			if (!isSet) setSelectedBackground(responseWallpaper)

src/layouts/setting/tabs/wallpapers/tab/gallery/components/wallpaper-item/wallpaper-item.tsx

@@ -93,7 +93,7 @@ function WallpaperItemFu({
 					</div>
 				)}
 				{error && (
-					<div className="flex flex-col items-center justify-center w-full h-full bg-error/10">
+					<div className="flex flex-col items-center justify-center w-full h-full bg-error/10 rounded-xl">
 						<Icon name="outlineHeart" className="text-error" />
 						<p className="mt-2 text-xs text-muted">خطا در بارگذاری</p>
 					</div>

src/layouts/widgets-manager/add-widget-modal/index.tsx

@@ -329,7 +329,10 @@ export function AddWidgetModal({ isOpen, editTarget, onClose }: AddWidgetModalPr
 			</Modal>
 
 			{isHelpOpen && (
-				<WidgetHelpModal isOpen={isHelpOpen} onClose={() => setIsHelpOpen(false)} />
+				<WidgetHelpModal
+					isOpen={isHelpOpen}
+					onClose={() => setIsHelpOpen(false)}
+				/>
 			)}
 		</>
 	)

src/layouts/widgets/calendar/variants/calendar-1x1.tsx

@@ -3,51 +3,32 @@ import { cn } from '@/common/utils/cn'
 
 export function Calendar1x1() {
 	const { today, todayIsHoliday } = useDate()
-
 	const weekDayName = today.format('dddd')
 	const dayNumber = today.jDate()
 	const monthName = today.format('jMMMM')
+	const dayDigits = String(dayNumber).split('')
 
 	return (
-		<div className="flex flex-col w-full h-full overflow-hidden text-center select-none">
+		<div className="relative flex flex-col items-center justify-between w-full h-full px-2 py-2 overflow-hidden select-none">
+			<span className="text-[10px] font-semibold leading-none text-muted">
+				{monthName}
+			</span>
+
 			<div
+				dir="ltr"
 				className={cn(
-					'w-full py-1.5 px-3 flex items-center justify-between transition-colors',
-					todayIsHoliday
-						? 'bg-error text-error-content'
-						: 'bg-primary text-white'
+					'flex items-center justify-center flex-1 gap-x-[0.06em] text-5xl font-black leading-none sm:text-6xl',
+					todayIsHoliday ? 'text-error' : 'text-content'
 				)}
 			>
-				<div className="w-1.5 h-1.5 rounded-full bg-white/40 border border-white/60" />
-				<span className="text-xs font-black leading-none tracking-tight">
-					{monthName}
-				</span>
-				<div className="w-1.5 h-1.5 rounded-full bg-white/40 border border-white/60" />
+				{dayDigits.map((digit, index) => (
+					<span key={index}>{digit}</span>
+				))}
 			</div>
 
-			<div className="w-full border-b border-dashed border-base-content/15" />
-
-			<div className="flex flex-col items-center justify-center flex-1 px-2 py-1">
-				<span
-					className={cn(
-						'text-3xl sm:text-4xl font-black leading-none tracking-[-0.04em] tabular-nums',
-						todayIsHoliday ? 'text-error' : 'text-content'
-					)}
-				>
-					{dayNumber}
-				</span>
-
-				<div className="mt-1.5">
-					<span
-						className={cn(
-							'px-2.5 py-0.5 rounded-full bg-base-200/80 text-[10px] font-bold',
-							todayIsHoliday ? 'text-error' : 'text-muted'
-						)}
-					>
-						{weekDayName}
-					</span>
-				</div>
-			</div>
+			<span className="text-[10px] font-medium leading-none text-muted">
+				{weekDayName}
+			</span>
 		</div>
 	)
 }

src/layouts/widgets/layout-engine/types.ts

@@ -13,7 +13,6 @@ export enum WidgetKeys {
 	HabitTracker = 'HabitTracker',
 	search = 'search',
 	bookmarks = 'bookmarks',
-	widgetify = 'widgetify', // @deprecated, will be removed in future versions
 	pet = 'pet',
 	transparentClock = 'transparentClock',
 	moodTracker = 'moodTracker',

src/layouts/widgets/migration.ts

@@ -52,7 +52,7 @@ export function replaceWidgetifyWithPetAndPhoto(widgets: StoredWidget[]): {
 	const result: StoredWidget[] = []
 
 	for (const widget of widgets) {
-		if (widget.id === WidgetKeys.widgetify) {
+		if (widget.id === ('widgetify' as any)) {
 			hasChanged = true
 			const col = widget.position?.col ?? 6
 			const baseRow = widget.position?.row ?? 0

src/layouts/widgets/network/network.widget.tsx

@@ -182,6 +182,7 @@ export function NetworkLayout({
 						ping={networkInfo.ping}
 						isLoading={isLoading}
 						blurMode={blurMode}
+						onRefresh={handleRefresh}
 					/>
 				</WidgetContainer>
 			)
@@ -205,7 +206,7 @@ export function NetworkLayout({
 								<Button
 									onClick={handleRefresh}
 									size="xs"
-									className="h-6 w-6 p-0 flex items-center justify-center rounded-full !border-none !shadow-none"
+									className="h-6 w-6 p-0 flex items-center justify-center rounded-full border-none! shadow-none!"
 								>
 									<Icon
 										name="refresh"
@@ -219,7 +220,7 @@ export function NetworkLayout({
 
 					<div className="flex-1 space-y-2">
 						<div className="relative overflow-hidden border border-content rounded-2xl">
-							<div className="absolute inset-0 bg-gradient-to-br from-white/5 to-transparent"></div>
+							<div className="absolute inset-0 bg-linear-to-br from-white/5 to-transparent"></div>
 							<div className="relative p-2 space-y-3 max-h-32 min-h-32">
 								<div className="flex items-center justify-between">
 									<div className="flex items-center gap-2">
@@ -255,12 +256,12 @@ export function NetworkLayout({
 								{(networkInfo.city || networkInfo.country) && (
 									<div className="flex items-center justify-center gap-2 text-xs flex-warp">
 										{networkInfo.city && (
-											<span className="px-2 py-1 font-medium text-primary rounded-full bg-primary/10">
+											<span className="px-2 py-1 font-medium rounded-full text-primary bg-primary/10">
 												{networkInfo.city}
 											</span>
 										)}
 										{networkInfo.country && (
-											<span className="px-2 py-1 font-medium text-secondary rounded-full bg-secondary/10">
+											<span className="px-2 py-1 font-medium rounded-full text-secondary bg-secondary/10">
 												{networkInfo.country}
 											</span>
 										)}