날짜 형식 처리 안정성 강화 및 트랜잭션 삭제 시 앱 먹통 문제 해결

2025-03-18 01:07:17 +09:00
parent 6f91afeebe
commit acb9ae3d70
23 changed files with 732 additions and 18 deletions
--- a/src/components/AvatarImageView.tsx
+++ b/src/components/AvatarImageView.tsx
@@ -0,0 +1,87 @@
+import React, { useEffect, useState } from 'react';
+import { Capacitor } from '@capacitor/core';
+import { Avatar, AvatarFallback } from '@/components/ui/avatar';
+import { Skeleton } from '@/components/ui/skeleton';
+
+interface AvatarImageViewProps {
+  className?: string;
+  fallback?: string;
+}
+
+const AvatarImageView: React.FC<AvatarImageViewProps> = ({
+  className = "h-12 w-12",
+  fallback = "ZY"
+}) => {
+  const [loaded, setLoaded] = useState(false);
+  const [error, setError] = useState(false);
+  const [imageSrc, setImageSrc] = useState<string>('/zellyy.png');
+
+  useEffect(() => {
+    const loadImage = async () => {
+      try {
+        // 플랫폼 체크
+        if (Capacitor.isNativePlatform()) {
+          const platform = Capacitor.getPlatform();
+          
+          if (platform === 'android') {
+            // Android에서는 res/mipmap 리소스 사용
+            setImageSrc('file:///android_asset/public/zellyy.png');
+            
+            // 다른 가능한 경로들
+            const possiblePaths = [
+              'file:///android_asset/public/zellyy.png',
+              'file:///android_res/mipmap/zellyy.png',
+              '@mipmap/zellyy',
+              'mipmap/zellyy',
+              'res/mipmap/zellyy.png',
+              '/zellyy.png',
+              './zellyy.png',
+              'android.resource://com.lovable.zellyfinance/mipmap/zellyy',
+            ];
+            
+            // 하드코딩된 Base64 이미지
+            const fallbackBase64 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR/mAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFEmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjMtMDYtMzBUMjI6MDM6NTIrMDk6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIzLTA2LTMwVDIzOjIxOjI1KzA5OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIzLTA2LTMwVDIzOjIxOjI1KzA5OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9InNSR0IgSUVDNjE5NjYtMi4xIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE0ZDg5ZjI0LTRmZjctNDUwOS1hNDA3LWM4ODZhM2Q4MDk0YSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxNGQ4OWYyNC00ZmY3LTQ1MDktYTQwNy1jODg2YTNkODA5NGEiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoxNGQ4OWYyNC00ZmY3LTQ1MDktYTQwNy1jODg2YTNkODA5NGEiPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjcmVhdGVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjE0ZDg5ZjI0LTRmZjctNDUwOS1hNDA3LWM4ODZhM2Q4MDk0YSIgc3RFdnQ6d2hlbj0iMjAyMy0wNi0zMFQyMjowMzo1MiswOTowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiLz4gPC9yZGY6U2VxPiA8L3htcE1NOkhpc3Rvcnk+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+GWKCCQAAATNJREFUWIXtlTFuwzAQRV+QTgk8ZMjWA+QAOViGLJmzdSsydS1kypojZAqQJbNvYHgplCKRQrUoqUiGwrcbLXAffFCH3O3ESSEJEzHZJEwhDMMQQtg/t1OGkJnZ4fNzDODtYU4MYRwiLb5eX8YAHp+WiSH8Cl+DvQPTXZwYAuBPa3dlQ8i5YEgOYJe1KxvCZ3HLqk1MWULmG+y5gx9gvfTYkDyJKaBDDZzE5BqEVT1fzNkP5Fy3tUXECF9X07dtvb/+TJbLFIYXzX9aNwPxUMkBOm34q2TNI8IWEQ4R4RARDhHhEBHO5pzV/gprM7aWFQtExBcRDhHhEBEOEeEQEU5Ljtb5+D+13lx3nP7lWpedwuA7fNP5OYhrNrXc4xVlGHPyODEEwGY1/AFIBfclfLkBYAAAAABJRU5ErkJggg==';
+            
+            // 마지막 수단으로 Base64 사용
+            setImageSrc(fallbackBase64);
+          } else if (platform === 'ios') {
+            // iOS 경로 처리
+            setImageSrc('/zellyy.png');
+          }
+        } else {
+          // 웹에서는 일반 경로 사용
+          setImageSrc('/zellyy.png');
+        }
+        
+        setLoaded(true);
+      } catch (err) {
+        console.error('이미지 로드 오류:', err);
+        setError(true);
+      }
+    };
+
+    loadImage();
+  }, []);
+
+  return (
+    <Avatar className={className}>
+      {!loaded ? (
+        <div className="h-full w-full flex items-center justify-center">
+          <Skeleton className="h-full w-full rounded-full" />
+        </div>
+      ) : (
+        <>
+          <img 
+            src={imageSrc}
+            alt="Zellyy"
+            className="h-full w-full object-cover"
+            onError={() => setError(true)}
+          />
+          {error && <AvatarFallback delayMs={100}>{fallback}</AvatarFallback>}
+        </>
+      )}
+    </Avatar>
+  );
+};
+
+export default AvatarImageView;