added ownership transfer

src/components/ChatWindow.vue

@@ -3,7 +3,7 @@
         @close="showInviteModal = false" @room-changed="handleRoomChanged" />
 
     <RoomDetailsModal v-if="showDetailsModal && isSocketConnected" :roomUuid="props.uuid"
-        :roomName="currentRoom?.name || 'Unknown room'" :isGlobal="currentRoom?.global || false"
+        :roomName="currentRoom?.name || 'Unknown room'" :isGlobal="currentRoom?.global || false" :ownerUuid="currentRoom?.owner_uuid || ''"
         @close="showDetailsModal = false" @room-changed="handleRoomChanged" />
 
     <div v-if="uuid === 'none'" class="no-room">

src/components/CreateRoomModal.vue

@@ -8,10 +8,12 @@
         <input v-model="name" :placeholder="$t('chat-create-name-placeholder')" autofocus />
       </div>
 
+      <!--
       <label class="checkbox">
         <input type="checkbox" v-model="global" />
         <span>{{ $t('chat-create-global') }}</span>
       </label>
+      -->
 
       <div class="actions">
         <button type="button" @click="emit('close')" class="secondary">

src/components/RoomDetailsModal.vue

@@ -5,7 +5,11 @@
       <h3 v-if="!isGlobal">Members:</h3>
 
       <ul v-if="!isGlobal" class="member-list">
-                <li v-for="user in users" :key="user.uuid || user.username" class="member-item">
+        <li v-for="user in users" :key="user.uuid || user.username" class="member-item" :class="{
+          'is-owner': user.uuid === ownerUuid,
+          'selectable': isTransferringOwnership && user.uuid !== ownerUuid,
+          'dimmed': isTransferringOwnership && user.uuid === currentUserUuid
+        }" @click="handleUserClick(user)">
           <img :src="getAvatarUrl(user.uuid)" @error="handleAvatarError" class="avatar" alt="avatar" />
           <span class="member-name">{{ user.username }}</span>
         </li>
@@ -17,15 +21,20 @@
       </p>
 
       <div class="buttons">
-                <button v-if="!isGlobal && !isOwner" class="btn" @click="requestLeave" :disabled="isLoading">
+        <button v-if="!isGlobal && !isOwner && !isTransferringOwnership" class="btn" @click="requestLeave"
+          :disabled="isLoading">
           {{ $t('chat-room-actions-leave') }}
         </button>
 
-                <button v-if="isOwner" class="btn delete-btn" @click="requestDelete" :disabled="isLoading">
+        <button v-if="isOwner && !isTransferringOwnership" class="btn delete-btn" @click="requestDelete"
+          :disabled="isLoading || isTransferringOwnership">
           {{ $t('chat-room-actions-delete') }}
         </button>
 
-                <!-- <button class="btn ownership-btn">{{ $t('chat-room-actions-ownership') }}</button> -->
+        <button v-if="!isGlobal && isOwner" class="btn ownership-btn" :class="{ 'active': isTransferringOwnership }"
+          @click="toggleTransferMode" :disabled="isLoading">
+          {{ isTransferringOwnership ? $t('shared-cancel') : $t('chat-room-actions-ownership') }}
+        </button>
       </div>
 
       <div class="actions">
@@ -45,7 +54,7 @@
 <script setup lang="ts">
 import { computed, onMounted, ref, reactive } from 'vue';
 import { UserProfile } from '../types';
-import { deleteRoom, leaveRoom, listMembers } from '../api/rooms';
+import { deleteRoom, leaveRoom, listMembers, transferOwnership } from '../api/rooms';
 import { getAuthData, getAvatarUrl } from '../store.ts';
 import defaultAvatar from '../assets/default-avatar.png';
 import ConfirmModal from './ConfirmModal.vue';
@@ -53,14 +62,17 @@ import { useFluent } from 'fluent-vue';
 
 const { $t } = useFluent()
 
-const props = defineProps<{ roomUuid: string, roomName: string, isGlobal: boolean }>()
+const props = defineProps<{ roomUuid: string, roomName: string, isGlobal: boolean, ownerUuid: string }>()
 const emit = defineEmits(['close', 'room-changed']);
 
 const users = ref<UserProfile[]>([]);
 const isLoading = ref(false);
 const currentUserUuid = ref<string>('');
 
-type ActionType = 'leave' | 'delete' | null;
+const isTransferringOwnership = ref(false);
+const targetTransferUser = ref<UserProfile | null>(null);
+
+type ActionType = 'leave' | 'delete' | 'transfer' | null;
 
 const modalState = reactive({
   visible: false,
@@ -89,15 +101,37 @@ const requestDelete = () => {
   modalState.visible = true;
 };
 
+const toggleTransferMode = () => {
+  isTransferringOwnership.value = !isTransferringOwnership.value;
+};
+
+const handleUserClick = (user: UserProfile) => {
+  if (!isTransferringOwnership.value || user.uuid === currentUserUuid.value) {
+    return;
+  }
+
+  targetTransferUser.value = user;
+
+  modalState.type = 'transfer';
+  modalState.title = $t('chat-room-actions-ownership');
+  modalState.message = $t('chat-room-actions-ownership-confirm', { user: user.username });
+  modalState.confirmLabel = $t('shared-confirm');
+  modalState.isDanger = true;
+  modalState.visible = true;
+};
+
 const closeConfirmModal = () => {
   modalState.visible = false;
   modalState.type = null;
+  targetTransferUser.value = null;
 };
 
 const handleConfirmAction = async () => {
   const actionType = modalState.type;
+  const userToTransfer = targetTransferUser.value;
 
   closeConfirmModal();
+  isTransferringOwnership.value = false;
 
   isLoading.value = true;
 
@@ -110,6 +144,11 @@ const handleConfirmAction = async () => {
       await deleteRoom(props.roomUuid);
       emit('room-changed');
       emit('close');
+    } else if (actionType === 'transfer' && userToTransfer) {
+      console.log("ownership")
+      await transferOwnership(props.roomUuid, userToTransfer.uuid);
+      emit('room-changed');
+      emit('close');
     }
   } catch (error) {
     console.error(`Failed to ${actionType} room:`, error);
@@ -119,7 +158,7 @@ const handleConfirmAction = async () => {
 };
 
 const isOwner = computed(() => {
-    return true; // Logic placeholder
+  return currentUserUuid.value === props.ownerUuid;
 });
 
 onMounted(async () => {
@@ -191,11 +230,17 @@ const handleAvatarError = (event: Event) => {
   align-items: center;
   text-align: center;
   gap: 0.5rem;
+  padding: 5px;
+  border-radius: var(--radius);
+  transition: all 0.2s ease;
 }
 
 .avatar {
   width: 48px;
   height: 48px;
+  border-radius: 50%;
+  object-fit: cover;
+  border: 2px solid transparent;
 }
 
 .member-name {
@@ -206,6 +251,36 @@ const handleAvatarError = (event: Event) => {
   text-overflow: ellipsis;
 }
 
+.member-item.is-owner .avatar {
+  border: 2px solid var(--accent);
+}
+
+.member-item.is-owner .member-name {
+  color: var(--accent);
+  font-weight: 600;
+}
+
+.member-item.dimmed {
+  opacity: 0.4;
+  cursor: not-allowed;
+  filter: grayscale(1);
+}
+
+.member-item.selectable {
+  cursor: pointer;
+  background-color: rgba(var(--accent-rgb, 100, 100, 255), 0.1);
+  border: 1px solid var(--border);
+}
+
+.member-item.selectable:hover {
+  background-color: var(--accent);
+  color: var(--bg);
+}
+
+.member-item.selectable:hover .member-name {
+  color: var(--bg);
+}
+
 .global-tag {
   width: 100%;
   display: flex;
@@ -270,11 +345,13 @@ const handleAvatarError = (event: Event) => {
   border: 1px solid var(--accent-second);
 }
 
-.ownership-btn:hover {
+.ownership-btn:hover,
-    color: var(--accent-second)
+.ownership-btn.active {
+  background-color: var(--accent-second);
+  color: white;
 }
 
 .ownership-btn:hover i {
-    color: var(--accent-second)
+  color: white;
 }
 </style>

src/components/UploadAvatarModal.vue

@@ -64,6 +64,10 @@ let unlistenDrag: UnlistenFn;
 let unlistenHover: UnlistenFn;
 let unlistenLeave: UnlistenFn;
 
+function uiLog(message: string) {
+  errorMessage.value += (errorMessage.value ? '\n' : '') + message;
+}
+
 onMounted(async () => {
   unlistenHover = await listen('tauri://drag-enter', () => isDragging.value = true);
   unlistenLeave = await listen('tauri://drag-leave', () => isDragging.value = false);
@@ -83,21 +87,36 @@ onUnmounted(() => {
   if (previewUrl.value) URL.revokeObjectURL(previewUrl.value);
 });
 
+
 async function pickFile() {
+  errorMessage.value = '';
+  // uiLog('[pickFile] called');
+
   try {
     const selected = await open({
       multiple: false,
       filters: [{ name: 'Image', extensions: ['png', 'jpeg', 'jpg', 'webp'] }]
     });
 
-    if (selected && typeof selected === 'string') {
+    // uiLog('[pickFile] dialog returned: ' + JSON.stringify(selected));
+
+    if (!selected) {
+      uiLog('No file selected (null)');
+      return;
+    }
+
+    if (typeof selected !== 'string') {
+      uiLog('Unexpected return type');
+      return;
+    }
+
     await setFile(selected);
-    }
+  } catch (err: any) {
-  } catch (err) {
+    uiLog('Error: ' + (err?.message ?? String(err)));
-    console.error(err);
   }
 }
 
+
 // Async function to read file and create blob URL
 async function setFile(path: string) {
   try {

src/locales/en.ftl

@@ -43,6 +43,7 @@ chat-room-actions-leave-confirm = Are you sure you want to leave this room?
 chat-room-actions-delete = Delete Room
 chat-room-actions-delete-confirm = Are you sure you want to delete this room? This cannot be undone.
 chat-room-actions-ownership = Transfer Ownership
+chat-room-actions-ownership-confirm = Do you really wish to transfer this room's ownership to {$user}? You might never get it back.
 chat-create-title = Create room
 chat-create-name = Room name
 chat-create-name-placeholder = room name
@@ -110,3 +111,4 @@ shared-save = Save
 shared-updating = Updating
 shared-delete = Delete
 shared-leave = Leave
+shared-confirm = Confirm

src/locales/fr.ftl

@@ -43,6 +43,7 @@ chat-room-actions-leave-confirm = Voulez-vous vraiment quitter ce salon?
 chat-room-actions-delete = Supprimer le Salon
 chat-room-actions-delete-confirm = Voulez-vous vraiment supprimer ce salon? C'est irréversible.
 chat-room-actions-ownership = Transférer la Propriété
+chat-room-actions-ownership-confirm = Voulez-vous vraiment transférer la propriété du salon à {$user}? Vous pourriez ne jamais la récupérer.
 chat-create-title = Créer un salon
 chat-create-name = Nom du salon
 chat-create-name-placeholder = nom du salon
@@ -108,3 +109,4 @@ shared-save = Enregistrer
 shared-updating = Mise à jour...
 shared-delete = Supprimer
 shared-leave = Quitter
+shared-confirm = Confirmer