@ozdao/martyrs 0.2.580 → 0.2.582

package/src/jit/plugin.js

@@ -140,9 +140,6 @@ export class MartyrsJitPlugin {
             if (replaced) {
               const { RawSource } = compiler.webpack.sources;
               compilation.updateAsset(filename, new RawSource(source));
-              console.log(`[MartyrsJIT] Replaced in ${filename}: ${this.tokens.size} tokens in ${duration.toFixed(2)}ms`);
-            } else if (filename.includes('martyrs') || filename.includes('__martyrs')) {
-              console.log(`[MartyrsJIT] No placeholder found in ${filename}`);
             }
           }
         }
@@ -166,9 +163,8 @@ export class MartyrsJitPlugin {
       // Переписываем виртуальный модуль с плейсхолдером, чтобы rspack пересобрал CSS
       try {
         this.virtualModules.writeModule(VIRTUAL_MODULE_PATH, LAYER_PLACEHOLDER + '\n/*' + Date.now() + '*/');
-        console.log('[MartyrsJIT] Virtual module rewritten with placeholder');
       } catch (e) {
-        console.log('[MartyrsJIT] watchRun: store not ready yet', e.message);
+        // silent - store not ready yet
       }
     });
   }

package/src/modules/auth/views/components/pages/ProfileEdit.vue

@@ -7,7 +7,7 @@
     class="w-m-50r h-40r mobile:h-100 h-m-40r bg-white mobile:radius-zero radius-medium pd-medium"
   >
     <div v-if="loading" class="flex-center h-100">
-      <Loader />
+      <Loader :centered="true"/>
     </div>
     
     <div v-else class="flex h-min-100 flex-row mobile:flex-column gap-regular">

package/src/modules/auth/views/components/pages/SignIn.vue

@@ -208,21 +208,25 @@ async function onSubmitApple() {
 }
 
 function redirectTo () {
+	if (!auth.state.user._id) {
+		throw new Error('AUTH_STATE_NOT_INITIALIZED')
+	}
+
 	if (route.query?.returnUrl) {
-		router.push({ 
+		router.push({
 			path: route.query?.returnUrl,
-			query: { 
-				afterAuth: 'true' 
+			query: {
+				afterAuth: 'true'
 			}
 		})
-	} else { 
-		router.push({ 
-			name: 'User Profile', 
-			params: { 
-				_id: auth.state.user._id 
+	} else {
+		router.push({
+			name: 'User Profile',
+			params: {
+				_id: auth.state.user._id
 			},
-			query: { 
-				afterAuth: 'true' 
+			query: {
+				afterAuth: 'true'
 			}
 		})
 	}

package/src/modules/auth/views/configs/navigation.user.config.js

@@ -64,21 +64,21 @@ export const navigationItems = [
   },
   {
     category: 'Orders',
-    visible: () => true,
+    visible: (auth, route) => isModuleInstalled('orders') && (
+      auth.user && (
+        auth.user._id === route.params._id ||
+        (auth.access.roles &&
+          (auth.access.roles.includes('ROLE_MODERATOR') ||
+            auth.access.roles.includes('ROLE_ADMIN'))
+        )
+      )
+    ),
     items: [
       {
         title: 'Orders',
         iconComponent: IconOrders,
         route: (auth, route) => `/users/${route.params._id}/orders`,
-        visible: (auth, route) => isModuleInstalled('orders') && (
-          auth.user && (
-            auth.user._id === route.params._id ||
-            (auth.access.roles &&
-              (auth.access.roles.includes('ROLE_MODERATOR') ||
-               auth.access.roles.includes('ROLE_ADMIN'))
-            )
-          )
-        )
+        
       },
     ]
   },

package/src/modules/auth/views/router/users.router.js

@@ -33,7 +33,6 @@ export function getUsersRoutes(options = {}) {
             },
             sidebar_hover: false,
             sidebar_navigation_items: navigationItems,
-            sidebar_header_component: ProfileCard,
             sidebar_footer_component: HelpCard,
             sidebarOpenOnEnter: true,
             sidebarCloseOnLeave: true

package/src/modules/auth/views/store/auth.js

@@ -74,6 +74,7 @@ const actions = {
       session.clear();
       this.resetState();
       setError(error);
+      throw error;
     }
   },
 

package/src/modules/core/views/classes/ws.manager.js

@@ -1,7 +1,8 @@
+import { reactive } from 'vue';
+
 class WebSocketManager {
   constructor() {
     this.socket = null;
-    this.isConnected = false;
     this.reconnectAttempts = 0;
     this.maxReconnectAttempts = 5;
     this.reconnectDelay = 3000;
@@ -17,6 +18,24 @@ class WebSocketManager {
     this.rpcCallbacks = new Map();
     this.rpcTimeout = 30000; // 30 секунд таймаут по умолчанию
     this.rpcIdCounter = 0;
+
+    // Реактивное состояние
+    this.state = reactive({
+      isConnected: false,
+      wasConnected: false,  // был ли когда-либо подключен
+    });
+  }
+
+  // Геттер для обратной совместимости
+  get isConnected() {
+    return this.state.isConnected;
+  }
+
+  set isConnected(value) {
+    this.state.isConnected = value;
+    if (value) {
+      this.state.wasConnected = true;
+    }
   }
 
   initialize(options = {}) {

package/src/modules/core/views/utils/vue-app-renderer.js

@@ -78,9 +78,6 @@ export function renderAndMountApp({ createApp, hooks = {} }) {
       initialState = null;
     }
 
-
-
-
     if (initialState) {
       console.log('[AUTH COOKIE DEBUG] Browser initialState.auth:', initialState.auth);
       console.log('[AUTH COOKIE DEBUG] Has token?', !!initialState?.auth?.access?.token);
@@ -89,6 +86,15 @@ export function renderAndMountApp({ createApp, hooks = {} }) {
       // Применяем начальное состояние ко всем модулям (true = гидратация)
       store.setInitialState(initialState, true);
 
+      // Гидратация session из auth данных — напрямую в reactive state
+      if (initialState?.auth?.user?._id && store.core?.state?.session) {
+        store.core.state.session.userId = initialState.auth.user._id;
+        store.core.state.session.token = initialState.auth.access?.token;
+        store.core.state.session.roles = initialState.auth.access?.roles;
+        store.core.state.session.accesses = initialState.auth.accesses || [];
+        console.log('[AUTH COOKIE DEBUG] Session hydrated with userId:', initialState.auth.user._id);
+      }
+
       if (initialState?.auth?.access?.token) {
         console.log('[AUTH COOKIE DEBUG] Setting auth token from initialState');
 

package/src/modules/notifications/components/blocks/NotificationItem.vue

@@ -60,7 +60,7 @@ const handleClick = () => {
 <template>
   <div 
     class="notification-item gap-thin flex pd-small radius-small bg-light" 
-    :class="{ 'bg-second-small': isUnread }"
+    :class="{ 'bg-second-nano': isUnread }"
     @click="handleClick"
   >
     <div class="notification-icon">

package/src/modules/notifications/components/layouts/NotificationsLayout.vue

@@ -1,69 +1,25 @@
 <template>
-  <div class="notifications-layout">
-    <div class="">
-      <router-view></router-view>
-    </div>
-    
-    <div v-if="!wsConnected" class="connection-status">
-      <div class="connection-warning">
-        <span class="warning-icon">⚠️</span>
-        <span class="warning-text">
-          Notification service disconnected. 
-          <button @click="reconnect" class="reconnect-btn">Reconnect</button>
-        </span>
-      </div>
+  <div>
+    <router-view />
+
+    <!-- Показываем только если WS был подключен и потом отвалился -->
+    <div v-if="wsManager.state.wasConnected && !wsManager.state.isConnected" class="pos-fixed pos-b-0 pos-l-0 pos-r-0 pd-small bg-warning t-center">
+      <span>⚠️ Notification service disconnected.</span>
+      <button class="mn-l-thin bg-none bd-none cursor-pointer t-main" @click="reconnect">Reconnect</button>
     </div>
   </div>
 </template>
 
 <script setup>
-import { computed, inject, ref, onMounted, onUnmounted } from 'vue';
+import { computed, inject } from 'vue';
 import wsManager from '@martyrs/src/modules/core/views/classes/ws.manager.js';
 
-// Get notification manager from store
 const store = inject('store');
-
 const notificationManager = computed(() => store.notificationManager || null);
 
-// Реактивное состояние WebSocket
-const wsConnected = ref(wsManager.isConnected);
-
-// ID слушателей для очистки
-const openListenerId = ref(null);
-const closeListenerId = ref(null);
-
-onMounted(() => {
-  // Подписываемся на события WebSocket
-  openListenerId.value = wsManager.addEventListener('open', () => {
-    wsConnected.value = true;
-  });
-  
-  closeListenerId.value = wsManager.addEventListener('close', () => {
-    wsConnected.value = false;
-  });
-  
-  // Устанавливаем начальное состояние
-  wsConnected.value = wsManager.isConnected;
-});
-
-onUnmounted(() => {
-  // Очищаем слушатели
-  if (openListenerId.value) {
-    wsManager.removeEventListener('open', openListenerId.value);
-  }
-  if (closeListenerId.value) {
-    wsManager.removeEventListener('close', closeListenerId.value);
-  }
-});
-
-
-// Methods
 const reconnect = () => {
   if (notificationManager.value) {
     notificationManager.value.initialize();
   }
 };
-</script>
-
-<style scoped>
-</style>
+</script>

package/src/modules/notifications/components/pages/Notifications.vue

@@ -1,36 +1,35 @@
 <template>
-  <div class="notifications-page pd-small">
-    <Tab
-      v-model:selected="activeTab"
-      :tabs="[
-        { label: `All Notifications${unreadCount > 0 ? ` (${unreadCount})` : ''}`, value: 'all' },
-        { label: 'Notification Settings', value: 'preferences' }
+  <div class="mobile:pd-thin pd-medium">
+    <SectionPageTitle
+      v-if="!MOBILE_APP"
+      :title="`Notifications${unreadCount > 0 ? ` (${unreadCount})` : ''}`"
+      :actions="[
+        { method: () => isSettingsPopup = true, label: 'Settings' }
       ]"
-      class="flex-child-default gap-micro scroll-hide bg-light radius-medium h-max pd-thin mn-b-thin o-x-scroll"
-      classTab="bg-white"
+      class="mn-b-small"
     />
-    
-    <div class="tab-content">
-      <notifications-list v-if="activeTab === 'all'" />
-      <notification-preferences v-else-if="activeTab === 'preferences'" />
-    </div>
+
+    <NotificationsList />
+
+    <Popup
+      :isPopupOpen="isSettingsPopup"
+      @close-popup="isSettingsPopup = false"
+      title="Notification Settings"
+      class="bg-white pd-medium w-m-30r radius-big"
+    >
+      <NotificationPreferences />
+    </Popup>
   </div>
 </template>
 
 <script setup>
 import { ref, inject } from 'vue';
-import { useRoute } from 'vue-router';
-import Tab from "@martyrs/src/components/Tab/Tab.vue";
+import SectionPageTitle from '@martyrs/src/modules/core/views/components/sections/SectionPageTitle.vue';
+import Popup from '@martyrs/src/components/Popup/Popup.vue';
 import NotificationsList from '../sections/NotificationsList.vue';
 import NotificationPreferences from '../sections/NotificationPreferences.vue';
 
-// Get route and notification state
-const route = useRoute();
 const { unreadCount } = inject('useNotifications')();
 
-// Set initial active tab based on route query param or default to 'all'
-const activeTab = ref(route.query.tab || 'all');
+const isSettingsPopup = ref(false);
 </script>
-
-<style scoped>
-</style>

package/src/modules/notifications/components/sections/NotificationPreferences.vue

@@ -1,51 +1,49 @@
 <template>
-  <div class="notification-preferences">
-    <h2 class="mn-b-small">Notification Preferences</h2>
-    <p class="description">Choose how you want to receive notifications</p>
-    
-    <div v-if="loading" class="preferences-loading">
-      <div class="loading-spinner">🔄</div>
-      <p>Loading preferences...</p>
+  <div>
+    <p class="t-transp mn-b-small">Choose how you want to receive notifications</p>
+
+    <div v-if="loading" class="pd-large t-center t-transp">
+      <Loader />
     </div>
-    
-    <div v-else class="preferences-form">
-      <div 
-        v-for="(enabled, channelType) in preferences" 
-        :key="channelType" 
-        class="preference-item"
+
+    <div v-else class="gap-thin flex-column flex">
+      <div
+        v-for="(enabled, channelType) in preferences"
+        :key="channelType"
+        class="flex flex-v-center flex-between bg-light radius-small pd-small"
       >
-        <div class="preference-info">
-          <div class="preference-icon">{{ getChannelIcon(channelType) }}</div>
-          <div class="preference-details">
-            <h3>{{ getChannelName(channelType) }}</h3>
-            <p>{{ getChannelDescription(channelType) }}</p>
+        <div class="flex w-100 flex-v-center gap-small mn-r-small">
+          <div class="h4">{{ getChannelIcon(channelType) }}</div>
+          <div class="flex-column flex gap-micro">
+            <p class="fw-medium lh-1">{{ getChannelName(channelType) }}</p>
+            <p class="p-small t-transp lh-1">{{ getChannelDescription(channelType) }}</p>
           </div>
         </div>
-        <label class="toggle-switch">
-          <input
-            type="checkbox"
-            :checked="enabled"
-            @change="updatePreference(channelType, $event.target.checked)"
-          >
-          <span class="toggle-slider"></span>
-        </label>
+        <Checkbox
+          mode="switch"
+          :radio="enabled"
+          @update:radio="updatePreference(channelType, $event)"
+          class="flex-shrink-0"
+        />
       </div>
-      
-      <div class="form-actions">
-        <button 
-          class="save-btn" 
-          :disabled="!hasChanges || saving" 
-          @click="savePreferences"
-        >
-          {{ saving ? 'Saving...' : 'Save Changes' }}
-        </button>
-        <button 
-          v-if="hasChanges" 
-          class="cancel-btn" 
-          @click="resetChanges"
+
+      <div class="flex flex-end gap-small mn-t-thin">
+        <Button
+          v-if="hasChanges"
+          :submit="resetChanges"
+          :showLoader="false"
+          :showSucces="false"
+          class="bg-white t-dark"
         >
           Cancel
-        </button>
+        </Button>
+        <Button
+          :submit="savePreferences"
+          :validation="!hasChanges || saving"
+          class="bg-main t-white"
+        >
+          {{ saving ? 'Saving...' : 'Save Changes' }}
+        </Button>
       </div>
     </div>
   </div>
@@ -53,6 +51,9 @@
 
 <script setup>
 import { ref, reactive, computed, onMounted, inject } from 'vue';
+import Checkbox from '@martyrs/src/components/Checkbox/Checkbox.vue';
+import Button from '@martyrs/src/components/Button/Button.vue';
+import Loader from '@martyrs/src/components/Loader/Loader.vue';
 
 // Get notification preferences functionality
 const { 
@@ -154,143 +155,3 @@ onMounted(async () => {
 });
 </script>
 
-<style scoped>
-
-.description {
-  color: #666;
-  margin-bottom: 24px;
-}
-
-.preferences-loading {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 48px 0;
-}
-
-.loading-spinner {
-  font-size: 2rem;
-  margin-bottom: 16px;
-  animation: spin 2s linear infinite;
-}
-
-@keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
-}
-
-.preference-item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 16px;
-  border-bottom: 1px solid #eee;
-}
-
-.preference-item:last-child {
-  border-bottom: none;
-}
-
-.preference-info {
-  display: flex;
-  align-items: center;
-  flex: 1;
-}
-
-.preference-icon {
-  font-size: 1.5rem;
-  margin-right: 16px;
-  width: 40px;
-  height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.preference-details h3 {
-  margin: 0 0 4px 0;
-  font-size: 1rem;
-}
-
-.preference-details p {
-  margin: 0;
-  color: #666;
-  font-size: 0.875rem;
-}
-
-/* Toggle switch styles */
-.toggle-switch {
-  position: relative;
-  display: inline-block;
-  width: 50px;
-  height: 24px;
-}
-
-.toggle-switch input {
-  opacity: 0;
-  width: 0;
-  height: 0;
-}
-
-.toggle-slider {
-  position: absolute;
-  cursor: pointer;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: #ccc;
-  transition: .4s;
-  border-radius: 24px;
-}
-
-.toggle-slider:before {
-  position: absolute;
-  content: "";
-  height: 16px;
-  width: 16px;
-  left: 4px;
-  bottom: 4px;
-  background-color: white;
-  transition: .4s;
-  border-radius: 50%;
-}
-
-input:checked + .toggle-slider {
-  background-color: #2196F3;
-}
-
-input:checked + .toggle-slider:before {
-  transform: translateX(26px);
-}
-
-.form-actions {
-  margin-top: 24px;
-  display: flex;
-  justify-content: flex-end;
-  gap: 16px;
-}
-
-.save-btn, .cancel-btn {
-  padding: 8px 16px;
-  border-radius: 4px;
-  cursor: pointer;
-}
-
-.save-btn {
-  background-color: #2196F3;
-  border: none;
-  color: white;
-}
-
-.save-btn:disabled {
-  background-color: #ccc;
-  cursor: not-allowed;
-}
-
-.cancel-btn {
-  background-color: white;
-  border: 1px solid #ccc;
-}
-</style>