refactor: extract SetVisibilityDialog into standalone component

- Extract "Set Visibility to Meeting Members" dialog from App.vue into dedicated SetVisibilityDialog.vue component
- Move dialog logic directly to MembersList.vue for better component coupling
- Remove unnecessary intermediate state management from App.vue
- Clean up redundant style definitions (rely on existing Tailwind CSS classes)
- Remove unused logger imports and debug functions
- Add explanatory comment for Vue template constant pattern

This improves maintainability by isolating dialog functionality and follows established component patterns in the codebase.

src/components/MembersList.vue

@@ -180,6 +180,15 @@
       </p>
     </div>
   </div>
+
+  <!-- Set Visibility Dialog Component -->
+  <SetVisibilityDialog
+    :visible="showSetVisibilityDialog"
+    :members-data="visibilityDialogMembers"
+    :active-did="activeDid"
+    :api-server="apiServer"
+    @close="closeSetVisibilityDialog"
+  />
 </template>
 
 <script lang="ts">
@@ -202,6 +211,7 @@ import {
   NOTIFY_CONTINUE_WITHOUT_ADDING,
 } from "@/constants/notifications";
 import { SOMEONE_UNNAMED } from "@/constants/entities";
+import SetVisibilityDialog from "./SetVisibilityDialog.vue";
 
 interface Member {
   admitted: boolean;
@@ -217,6 +227,9 @@ interface DecryptedMember {
 }
 
 @Component({
+  components: {
+    SetVisibilityDialog,
+  },
   mixins: [PlatformServiceMixin],
 })
 export default class MembersList extends Vue {
@@ -243,6 +256,15 @@ export default class MembersList extends Vue {
   missingMyself = false;
   activeDid = "";
   apiServer = "";
+
+  // Set Visibility Dialog state
+  showSetVisibilityDialog = false;
+  visibilityDialogMembers: Array<{
+    did: string;
+    name: string;
+    isContact: boolean;
+    member: { memberId: string };
+  }> = [];
   contacts: Array<Contact> = [];
 
   // Auto-refresh functionality
@@ -573,18 +595,9 @@ export default class MembersList extends Vue {
     // Filter members to show only those who need visibility set
     const membersForVisibility = this.getMembersForVisibility();
 
-    this.$notify(
-      {
-        group: "modal",
-        type: "set-visibility-meeting-members",
-        membersData: membersForVisibility, // Pass the filtered members data
-        callback: async () => {
-          // Refresh data when dialog is closed (regardless of action taken)
-          await this.refreshData();
-        },
-      },
-      -1,
-    ); // -1 means no auto-dismiss, stays open until user acts
+    // Open the dialog directly
+    this.visibilityDialogMembers = membersForVisibility;
+    this.showSetVisibilityDialog = true;
   }
 
   startAutoRefresh() {
@@ -629,6 +642,14 @@ export default class MembersList extends Vue {
     this.startAutoRefresh();
   }
 
+  // Set Visibility Dialog methods
+  closeSetVisibilityDialog() {
+    this.showSetVisibilityDialog = false;
+    this.visibilityDialogMembers = [];
+    // Refresh data when dialog is closed
+    this.refreshData();
+  }
+
   beforeDestroy() {
     this.stopAutoRefresh();
   }