Make Save button conditional

Gör Spara ändringar-knappen beroende på om användaren gjort ändringar i Mitt konto-sidan. Lades till originalProfile state för att jämföra med nuvarande värden, uppdaterade fetch-logik att spara originalprofil och visa Save-knappen endast när ändringar finns.

X-Lovable-Edit-ID: edt-4c28a1c2-8950-4a99-88a6-b1d5f54ff4ef
This commit is contained in:
gpt-engineer-app[bot]
2026-01-28 00:03:20 +00:00
+24 -10
View File
@@ -28,12 +28,22 @@ const Account = () => {
postal_code: "",
city: "",
});
const [originalProfile, setOriginalProfile] = useState<ProfileData>({
street_address: "",
postal_code: "",
city: "",
});
const [isLoading, setIsLoading] = useState(true);
const [isSaving, setIsSaving] = useState(false);
const { user, loading: authLoading, signOut } = useAuth();
const { toast } = useToast();
const navigate = useNavigate();
const hasChanges =
profile.street_address !== originalProfile.street_address ||
profile.postal_code !== originalProfile.postal_code ||
profile.city !== originalProfile.city;
useEffect(() => {
if (!authLoading && !user) {
navigate("/");
@@ -61,11 +71,13 @@ const Account = () => {
variant: "destructive",
});
} else if (data) {
setProfile({
const profileData = {
street_address: data.street_address || "",
postal_code: data.postal_code || "",
city: data.city || "",
});
};
setProfile(profileData);
setOriginalProfile(profileData);
}
} finally {
setIsLoading(false);
@@ -214,14 +226,16 @@ const Account = () => {
</p>
</div>
<Button
type="submit"
className="w-full bg-primary text-primary-foreground hover:bg-primary/90"
disabled={isSaving}
>
<Save className="h-4 w-4 mr-2" />
{isSaving ? "Sparar..." : "Spara ändringar"}
</Button>
{hasChanges && (
<Button
type="submit"
className="w-full bg-primary text-primary-foreground hover:bg-primary/90"
disabled={isSaving}
>
<Save className="h-4 w-4 mr-2" />
{isSaving ? "Sparar..." : "Spara ändringar"}
</Button>
)}
</form>
</div>