@coopenomics/desktop 2025.7.3 → 2025.11.8-alpha-2

package/src/shared/lib/widget/widget-mode.ts

@@ -0,0 +1,363 @@
+import { reactive, computed } from 'vue';
+import { IWidgetConfig, DEFAULT_WIDGET_CONFIG } from 'src/shared/config/widget';
+
+// Проверка на существование window (для SSR)
+const isClient = typeof window !== 'undefined';
+
+// Глобальное состояние виджета
+const widgetState = reactive({
+  isWidget: false,
+  isReady: false,
+  parentOrigin: '',
+  config: { ...DEFAULT_WIDGET_CONFIG } as IWidgetConfig,
+});
+
+// Параметры URL для widget режима
+const WIDGET_URL_PARAMS = {
+  WIDGET_MODE: 'widget',
+  WIDGET_CONFIG: 'widget_config',
+  WIDGET_ORIGIN: 'widget_origin',
+  WIDGET_PAGE: 'widget_page',
+} as const;
+
+export class WidgetMode {
+  private static instance: WidgetMode | null = null;
+  private isInitialized = false;
+
+  private constructor() {
+    // Инициализация только на клиенте
+    if (isClient) {
+      this.detectWidgetMode();
+      this.isInitialized = true;
+    }
+  }
+
+  // Singleton pattern
+  public static getInstance(): WidgetMode {
+    if (!WidgetMode.instance) {
+      WidgetMode.instance = new WidgetMode();
+    }
+    return WidgetMode.instance;
+  }
+
+  // Определение режима виджета
+  private detectWidgetMode(): void {
+    // Проверяем только на клиенте
+    if (!isClient) return;
+
+    const urlParams = new URLSearchParams(window.location.search);
+    const isInIframe = window.parent !== window;
+    const widgetModeParam = urlParams.get(WIDGET_URL_PARAMS.WIDGET_MODE);
+
+    // Проверяем различные условия для widget режима
+    widgetState.isWidget = isInIframe || widgetModeParam === 'true';
+
+    if (widgetState.isWidget) {
+      this.initializeWidgetMode(urlParams);
+    }
+  }
+
+  // Инициализация widget режима
+  private initializeWidgetMode(urlParams: URLSearchParams): void {
+    if (!isClient) return;
+
+    // Получаем origin родительского окна
+    try {
+      widgetState.parentOrigin = document.referrer || '*';
+    } catch (e) {
+      widgetState.parentOrigin = '*';
+    }
+
+    // Загружаем конфигурацию из URL параметров
+    const configParam = urlParams.get(WIDGET_URL_PARAMS.WIDGET_CONFIG);
+    if (configParam) {
+      try {
+        const urlConfig = JSON.parse(decodeURIComponent(configParam));
+        widgetState.config = { ...widgetState.config, ...urlConfig };
+      } catch (e) {
+        console.warn('[Widget Mode] Invalid config in URL:', e);
+      }
+    }
+
+    // Добавляем parent origin в разрешенные если не указан
+    if (
+      widgetState.parentOrigin &&
+      !widgetState.config.allowedOrigins.includes(widgetState.parentOrigin)
+    ) {
+      widgetState.config.allowedOrigins.push(widgetState.parentOrigin);
+    }
+
+    // Включаем widget режим
+    widgetState.config.enabled = true;
+
+    // Применяем настройки для iframe
+    this.applyWidgetStyles();
+    this.setupWidgetEnvironment();
+  }
+
+  // Применение стилей для widget режима
+  private applyWidgetStyles(): void {
+    if (!isClient) return;
+
+    // Убираем лишние элементы UI
+    const style = document.createElement('style');
+    style.textContent = `
+      /* Widget Mode Styles */
+      body.widget-mode {
+        margin: 0;
+        padding: 0;
+        overflow: hidden;
+        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+      }
+
+      .widget-mode .q-layout {
+        min-height: auto !important;
+      }
+
+      .widget-mode .q-page {
+        min-height: auto !important;
+      }
+
+      /* Скрываем элементы если нужно */
+      .widget-mode .widget-hide-header .q-header {
+        display: none !important;
+      }
+
+      .widget-mode .widget-hide-footer .q-footer {
+        display: none !important;
+      }
+
+      /* Компактные отступы */
+      .widget-mode .q-page-container {
+        padding-top: 0 !important;
+        padding-bottom: 0 !important;
+      }
+
+      /* Темная тема */
+      .widget-mode.widget-theme-dark {
+        background: #1a1a1a;
+        color: white;
+      }
+
+      /* Светлая тема */
+      .widget-mode.widget-theme-light {
+        background: white;
+        color: #1a1a1a;
+      }
+    `;
+
+    document.head.appendChild(style);
+  }
+
+  // Настройка окружения для widget режима
+  private setupWidgetEnvironment(): void {
+    if (!isClient) return;
+
+    // Добавляем CSS классы
+    document.body.classList.add('widget-mode');
+
+    if (widgetState.config.theme) {
+      document.body.classList.add(`widget-theme-${widgetState.config.theme}`);
+    }
+
+    if (widgetState.config.hideHeader) {
+      document.body.classList.add('widget-hide-header');
+    }
+
+    if (widgetState.config.hideFooter) {
+      document.body.classList.add('widget-hide-footer');
+    }
+
+    // Предотвращаем навигацию если отключена
+    if (widgetState.config.disableNavigation) {
+      this.disableNavigation();
+    }
+
+    // Ограничиваем размеры если заданы
+    if (widgetState.config.maxWidth || widgetState.config.maxHeight) {
+      this.applyDimensionLimits();
+    }
+  }
+
+  // Отключение навигации
+  private disableNavigation(): void {
+    if (!isClient) return;
+
+    // Перехватываем попытки навигации
+    const originalPushState = history.pushState;
+    const originalReplaceState = history.replaceState;
+
+    history.pushState = function (state, title, url) {
+      console.log('[Widget Mode] Navigation blocked:', url);
+      return originalPushState.call(this, state, title, url);
+    };
+
+    history.replaceState = function (state, title, url) {
+      console.log('[Widget Mode] Navigation blocked:', url);
+      return originalReplaceState.call(this, state, title, url);
+    };
+  }
+
+  // Применение ограничений размеров
+  private applyDimensionLimits(): void {
+    if (!isClient) return;
+
+    const style = document.createElement('style');
+    let cssRules = '';
+
+    if (widgetState.config.maxWidth) {
+      cssRules += `max-width: ${widgetState.config.maxWidth}px;`;
+    }
+
+    if (widgetState.config.maxHeight) {
+      cssRules += `max-height: ${widgetState.config.maxHeight}px;`;
+    }
+
+    if (cssRules) {
+      style.textContent = `
+        .widget-mode {
+          ${cssRules}
+          overflow: hidden;
+        }
+      `;
+      document.head.appendChild(style);
+    }
+  }
+
+  // Получение текущего состояния
+  public getState() {
+    return {
+      ...widgetState,
+      isWidget: computed(() => widgetState.isWidget),
+      isReady: computed(() => widgetState.isReady),
+      config: computed(() => widgetState.config),
+    };
+  }
+
+  // Обновление конфигурации
+  public updateConfig(newConfig: Partial<IWidgetConfig>): void {
+    Object.assign(widgetState.config, newConfig);
+
+    // Переприменяем стили если изменились настройки отображения
+    if (newConfig.theme || newConfig.hideHeader || newConfig.hideFooter) {
+      this.reapplyStyles();
+    }
+  }
+
+  // Переприменение стилей
+  private reapplyStyles(): void {
+    if (!isClient) return;
+
+    // Убираем старые классы
+    document.body.classList.remove('widget-theme-light', 'widget-theme-dark');
+    document.body.classList.remove('widget-hide-header', 'widget-hide-footer');
+
+    // Добавляем новые
+    if (widgetState.config.theme) {
+      document.body.classList.add(`widget-theme-${widgetState.config.theme}`);
+    }
+
+    if (widgetState.config.hideHeader) {
+      document.body.classList.add('widget-hide-header');
+    }
+
+    if (widgetState.config.hideFooter) {
+      document.body.classList.add('widget-hide-footer');
+    }
+  }
+
+  // Установка готовности
+  public setReady(ready: boolean): void {
+    widgetState.isReady = ready;
+  }
+
+  // Получение layout для router
+  public getLayout(): string {
+    return widgetState.isWidget ? 'widget' : 'default';
+  }
+
+  // Проверка инициализации
+  public get initialized(): boolean {
+    return this.isInitialized;
+  }
+
+  // Принудительная инициализация (для использования на клиенте)
+  public forceInitialize(): void {
+    if (!this.isInitialized && isClient) {
+      this.detectWidgetMode();
+      this.isInitialized = true;
+    }
+  }
+
+  // Создание URL для widget режима
+  public static createWidgetUrl(
+    baseUrl: string,
+    options: {
+      page?: string;
+      config?: Partial<IWidgetConfig>;
+      origin?: string;
+    } = {},
+  ): string {
+    const url = new URL(baseUrl);
+
+    // Добавляем параметры widget режима
+    url.searchParams.set(WIDGET_URL_PARAMS.WIDGET_MODE, 'true');
+
+    if (options.page) {
+      url.searchParams.set(WIDGET_URL_PARAMS.WIDGET_PAGE, options.page);
+    }
+
+    if (options.config) {
+      const configJson = JSON.stringify(options.config);
+      url.searchParams.set(
+        WIDGET_URL_PARAMS.WIDGET_CONFIG,
+        encodeURIComponent(configJson),
+      );
+    }
+
+    if (options.origin) {
+      url.searchParams.set(WIDGET_URL_PARAMS.WIDGET_ORIGIN, options.origin);
+    }
+
+    return url.toString();
+  }
+}
+
+// Экспорт для использования в композаблах
+export function useWidgetMode() {
+  const widgetMode = WidgetMode.getInstance();
+  return widgetMode.getState();
+}
+
+// Lazy singleton instance - создается только при первом обращении
+let _widgetModeInstance: WidgetMode | null = null;
+
+export const widgetModeInstance = {
+  getState: () => {
+    if (!_widgetModeInstance) {
+      _widgetModeInstance = WidgetMode.getInstance();
+    }
+    return _widgetModeInstance.getState();
+  },
+  updateConfig: (config: Partial<IWidgetConfig>) => {
+    if (!_widgetModeInstance) {
+      _widgetModeInstance = WidgetMode.getInstance();
+    }
+    _widgetModeInstance.updateConfig(config);
+  },
+  setReady: (ready: boolean) => {
+    if (!_widgetModeInstance) {
+      _widgetModeInstance = WidgetMode.getInstance();
+    }
+    _widgetModeInstance.setReady(ready);
+  },
+  forceInitialize: () => {
+    if (!_widgetModeInstance) {
+      _widgetModeInstance = WidgetMode.getInstance();
+    }
+    _widgetModeInstance.forceInitialize();
+  },
+  get initialized() {
+    return _widgetModeInstance ? _widgetModeInstance.initialized : false;
+  },
+};

package/src/shared/store/index.ts

@@ -24,7 +24,7 @@ interface IGlobalStore {
   hashMessage: (message: string | Uint8Array) => Promise<string>;
   formActionFromAbi: (action: any) => any;
   transact: (
-    actionOrActions: any | any[]
+    actionOrActions: any | any[],
   ) => Promise<TransactResult | undefined>;
 }
 
@@ -36,27 +36,26 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
 
   const password = ''; // это временное намеренное решение. Позже заменим на пользовательский пин-код.
 
-  const { info } = useSystemStore()
+  const { info } = useSystemStore();
 
   // Инициализация
   const init = async () => {
-
     try {
       // Получите зашифрованный ключ и токены из хранилища
       const encryptedKey = await getFromIndexedDB(
         info.coopname,
         'store',
-        'encryptedKey'
+        'encryptedKey',
       );
       const encryptedTokens = await getFromIndexedDB(
         info.coopname,
         'store',
-        'encryptedTokens'
+        'encryptedTokens',
       );
       const encryptedUsername = await getFromIndexedDB(
         info.coopname,
         'store',
-        'encryptedUsername'
+        'encryptedUsername',
       );
 
       // Если ключ или токены не найдены, выбросите ошибку
@@ -77,14 +76,13 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
       // Установите hasCreditials в true
       hasCreditials.value = true;
 
-      if (tokens.value?.access.token){
-        client.setToken(tokens.value.access.token)
+      if (tokens.value?.access.token) {
+        client.setToken(tokens.value.access.token);
       }
 
       if (decryptedKey && decryptedUsername) {
-        client.setWif(decryptedUsername, decryptedKey)
+        client.setWif(decryptedUsername, decryptedKey);
       }
-
     } catch (error: any) {
       await setToIndexedDB(info.coopname, 'store', 'encryptedKey', '');
       await setToIndexedDB(info.coopname, 'store', 'encryptedUsername', '');
@@ -102,7 +100,7 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
       info.coopname,
       'store',
       'encryptedUsername',
-      encryptedUsername
+      encryptedUsername,
     );
 
     wif.value = PrivateKey.fromString(key);
@@ -111,7 +109,12 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
 
   const setTokens = async (newTokens: ITokens) => {
     const encryptedTokens = await encrypt(JSON.stringify(newTokens), password);
-    await setToIndexedDB(info.coopname, 'store', 'encryptedTokens', encryptedTokens);
+    await setToIndexedDB(
+      info.coopname,
+      'store',
+      'encryptedTokens',
+      encryptedTokens,
+    );
     tokens.value = newTokens;
   };
 
@@ -123,6 +126,8 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
     await setToIndexedDB(info.coopname, 'store', 'encryptedKey', '');
     await setToIndexedDB(info.coopname, 'store', 'encryptedUsername', '');
     await setToIndexedDB(info.coopname, 'store', 'encryptedTokens', '');
+    // Сбрасываем активный workspace из localStorage
+    localStorage.removeItem('monocoop-active-workspace');
   };
 
   const signDigest = (digest: string): IMessageSignature => {
@@ -147,7 +152,7 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
 
   async function transact(
     actionOrActions: any | any[],
-    broadcast = true
+    broadcast = true,
   ): Promise<TransactResult | undefined> {
     if (Array.isArray(actionOrActions)) {
       return await sendActions(actionOrActions, broadcast);
@@ -156,7 +161,9 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
     }
   }
   const formActionFromAbi = async (action: any) => {
-    const { abi } = (await readBlockchain?.v1.chain.get_abi(action.account)) ?? {
+    const { abi } = (await readBlockchain?.v1.chain.get_abi(
+      action.account,
+    )) ?? {
       abi: undefined,
     };
     return Action.from(action, abi);
@@ -164,17 +171,24 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
 
   const sendAction = async (action: any, broadcast: boolean) => {
     // Получаем хранилище сессии с помощью импорта, избегая циклической зависимости
-    const sessionStore = (await import('src/entities/Session')).useSessionStore();
+    const sessionStore = (
+      await import('src/entities/Session')
+    ).useSessionStore();
     const formedAction = await formActionFromAbi(action);
 
-    return sessionStore.session?.transact({
-      action: formedAction,
-    }, { broadcast });
+    return sessionStore.session?.transact(
+      {
+        action: formedAction,
+      },
+      { broadcast },
+    );
   };
 
   const sendActions = async (actions: any[], broadcast: boolean) => {
     // Получаем хранилище сессии с помощью импорта, избегая циклической зависимости
-    const sessionStore = (await import('src/entities/Session')).useSessionStore();
+    const sessionStore = (
+      await import('src/entities/Session')
+    ).useSessionStore();
     const data: Action[] = [];
 
     for (const action of actions) {
@@ -182,9 +196,12 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
       data.push(formedAction);
     }
 
-    return sessionStore.session?.transact({
-      actions: data,
-    }, { broadcast });
+    return sessionStore.session?.transact(
+      {
+        actions: data,
+      },
+      { broadcast },
+    );
   };
 
   return {
@@ -199,6 +216,6 @@ export const useGlobalStore = defineStore('global', (): IGlobalStore => {
     signDigest,
     hashMessage,
     transact,
-    formActionFromAbi
+    formActionFromAbi,
   };
 });

package/src/shared/ui/AutoSaveIndicator/AutoSaveIndicator.vue

@@ -0,0 +1,48 @@
+<template lang="pug">
+.row.items-center(
+  :style="{ minHeight: '24px', padding: '0px !important' }"
+)
+  .text-caption(
+    :class="statusTextClass"
+    style='transition: opacity 0.3s ease'
+  )
+    | {{ statusText }}
+
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+
+interface Props {
+  isAutoSaving?: boolean
+  autoSaveError?: string | null
+  savingText?: string
+  errorText?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  isAutoSaving: false,
+  autoSaveError: null,
+  savingText: 'Авто-сохранение...',
+  errorText: 'Ошибка сохранения'
+})
+
+
+// Класс для текста статуса
+const statusTextClass = computed(() => ({
+  'text-grey-6': props.isAutoSaving,
+  'text-negative': props.autoSaveError,
+  'text-transparent': !props.isAutoSaving && !props.autoSaveError
+}))
+
+// Текст статуса
+const statusText = computed(() => {
+  if (props.isAutoSaving) return props.savingText
+  if (props.autoSaveError) return props.autoSaveError
+  return ' ' // Невидимый текст для сохранения места
+})
+</script>
+
+<style scoped>
+
+</style>

package/src/shared/ui/AutoSaveIndicator/index.ts

@@ -0,0 +1 @@
+export { default as AutoSaveIndicator } from './AutoSaveIndicator.vue'

package/src/shared/ui/BlockchainStatusBar/BlockchainStatusBar.vue

@@ -16,32 +16,18 @@ div.footer-root.blockinfo.no-select
 </template>
 
 <script setup lang="ts">
-import { computed, ref, onUnmounted } from 'vue'
-import config from 'src/app/config'
-import { useSessionStore } from 'src/entities/Session'
+import { computed } from 'vue'
+import { useSystemStore } from 'src/entities/System/model'
 
-//TODO delete entity from here and make with props and subscription
-const session = useSessionStore()
-
-const intervalId = ref()
-
-if (config.production)
-  intervalId.value = setInterval(() => {
-    session.getInfo()
-  }, 1000)
-
-onUnmounted(() => {
-  if (intervalId.value) {
-    clearInterval(intervalId.value)
-  }
-})
+const { info } = useSystemStore()
 
 let currentBlock = computed(() => {
-  return session.BCInfo.info?.head_block_num
+  return info.blockchain_info?.head_block_num
 })
 
+// Всегда считаем, что соединение есть, поскольку blockchain_info обновляется автоматически
 let missedConnection = computed(() => {
-  return session.BCInfo.connected
+  return false
 })
 
 </script>