Fix privacy settings implementation

src/pages/Profile.tsx

@@ -27,13 +27,16 @@ import {
   ArrowLeft,
   Check,
   AlertCircle,
-  Loader2
+  Loader2,
+  UserX
 } from 'lucide-react';
 import { Profile as ProfileType } from '@/types/database';
 import { supabase } from '@/integrations/supabase/client';
 import { useToast } from '@/hooks/use-toast';
 import { PhotoUpload } from '@/components/upload/PhotoUpload';
 import { profileEditSchema } from '@/lib/validation';
+import { LocationDisplay } from '@/components/profile/LocationDisplay';
+import { UserBlockButton } from '@/components/profile/UserBlockButton';
 
 export default function Profile() {
   const { username } = useParams<{ username?: string }>();
@@ -346,17 +349,25 @@ export default function Profile() {
                     className="mb-4"
                   />
                   
-                  {isOwnProfile && !editing && (
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      onClick={() => setEditing(true)}
-                      className="mt-2"
-                    >
-                      <Edit3 className="w-4 h-4 mr-2" />
-                      Edit Profile
-                    </Button>
-                  )}
+                  <div className="flex flex-col gap-2 mt-2">
+                    {isOwnProfile && !editing && (
+                      <Button
+                        variant="outline"
+                        size="sm"
+                        onClick={() => setEditing(true)}
+                      >
+                        <Edit3 className="w-4 h-4 mr-2" />
+                        Edit Profile
+                      </Button>
+                    )}
+                    
+                    {!isOwnProfile && (
+                      <UserBlockButton 
+                        targetUserId={profile.user_id}
+                        targetUsername={profile.username}
+                      />
+                    )}
+                  </div>
                 </div>
 
                 <div className="flex-1">
@@ -480,12 +491,22 @@ export default function Profile() {
                           })}
                         </div>
                         
-                        {profile.location && (
+                        {/* Show pronouns if enabled */}
+                        {profile.show_pronouns && profile.preferred_pronouns && (
                           <div className="flex items-center gap-1">
-                            <MapPin className="w-4 h-4" />
-                            {profile.location.city}, {profile.location.country}
+                            <User className="w-4 h-4" />
+                            {profile.preferred_pronouns}
                           </div>
                         )}
+                        
+                        {/* Show location only if privacy allows */}
+                        {profile.location && (
+                          <LocationDisplay 
+                            location={profile.location} 
+                            userId={profile.user_id} 
+                            isOwnProfile={isOwnProfile}
+                          />
+                        )}
                       </div>
                     </div>
                   )}