From 77afbbf9d592156eb45506b37141b4a6337f3524 Mon Sep 17 00:00:00 2001
From: Vladislav Kibenko <wolfram.deus@gmail.com>
Date: Wed, 2 Oct 2024 00:29:22 +0500
Subject: [PATCH] feat(sdk,secondary-button): add position-related
 functionality

---
 .../components/secondary-button/methods.ts    |  5 ++--
 .../components/secondary-button/signals.ts    | 26 ++++++++++---------
 2 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/packages/sdk/src/scopes/components/secondary-button/methods.ts b/packages/sdk/src/scopes/components/secondary-button/methods.ts
index d35fdccf3..8f895e86f 100644
--- a/packages/sdk/src/scopes/components/secondary-button/methods.ts
+++ b/packages/sdk/src/scopes/components/secondary-button/methods.ts
@@ -76,12 +76,13 @@ function onStateChanged(s: State): void {
   // crash due to the empty value of the text.
   if (s.text) {
     postEvent(MINI_APPS_METHOD, {
+      color: s.backgroundColor,
       has_shine_effect: s.hasShineEffect,
-      is_visible: s.isVisible,
       is_active: s.isEnabled,
       is_progress_visible: s.isLoaderVisible,
+      is_visible: s.isVisible,
+      position: s.position,
       text: s.text,
-      color: s.backgroundColor,
       text_color: s.textColor,
     });
   }
diff --git a/packages/sdk/src/scopes/components/secondary-button/signals.ts b/packages/sdk/src/scopes/components/secondary-button/signals.ts
index b6325a4b0..be0f9dee7 100644
--- a/packages/sdk/src/scopes/components/secondary-button/signals.ts
+++ b/packages/sdk/src/scopes/components/secondary-button/signals.ts
@@ -2,8 +2,6 @@ import { computed, type Computed, signal } from '@telegram-apps/signals';
 
 import type { State } from './types.js';
 
-/* USUAL */
-
 /**
  * Complete component state.
  */
@@ -13,6 +11,7 @@ export const state = signal<State>({
   isEnabled: true,
   isLoaderVisible: false,
   isVisible: false,
+  position: 'left',
   text: 'Cancel',
   textColor: '#2481cc',
 });
@@ -22,43 +21,46 @@ export const state = signal<State>({
  */
 export const isMounted = signal(false);
 
-/* COMPUTED */
-
-function createStateComputed<K extends keyof State>(key: K): Computed<State[K]> {
+function fromState<K extends keyof State>(key: K): Computed<State[K]> {
   return computed(() => state()[key]);
 }
 
 /**
  * @see State.backgroundColor
  */
-export const backgroundColor = createStateComputed('backgroundColor');
+export const backgroundColor = fromState('backgroundColor');
 
 /**
  * @see State.hasShineEffect
  */
-export const hasShineEffect = createStateComputed('hasShineEffect');
+export const hasShineEffect = fromState('hasShineEffect');
 
 /**
  * @see State.isEnabled
  */
-export const isEnabled = createStateComputed('isEnabled');
+export const isEnabled = fromState('isEnabled');
 
 /**
  * @see State.isLoaderVisible
  */
-export const isLoaderVisible = createStateComputed('isLoaderVisible');
+export const isLoaderVisible = fromState('isLoaderVisible');
 
 /**
  * @see State.isVisible
  */
-export const isVisible = createStateComputed('isVisible');
+export const isVisible = fromState('isVisible');
+
+/**
+ * @see State.position
+ */
+export const position = fromState('position');
 
 /**
  * @see State.text
  */
-export const text = createStateComputed('text');
+export const text = fromState('text');
 
 /**
  * @see State.textColor
  */
-export const textColor = createStateComputed('textColor');
+export const textColor = fromState('textColor');