@cloud-ru/uikit-product-calculator 0.33.3

package/src/services/getOnShareClick.ts

@@ -0,0 +1,56 @@
+import { copyToClipboard } from '@cloud-ru/ft-copy-to-clipboard';
+
+import { State } from '../types';
+import { DEFAULT_BACKEND_HOST, DEFAULT_BASE_URL, DEFAULT_HEADERS } from './constants';
+
+const CALCULATOR_SHARE_SAVE_URL = '/calculator-share/v2/save';
+
+/**
+ *
+ * Функция для получения ссылки на расчет
+ * @function helper
+ */
+function getShareSaveService(backendHost: string) {
+  return async function shareSaveService(state: State) {
+    const totalUrl = backendHost + CALCULATOR_SHARE_SAVE_URL;
+
+    const body = {
+      calculatorType: state.calculatorType,
+      products: state.products,
+    };
+    const params = {
+      method: 'POST',
+      headers: DEFAULT_HEADERS,
+      body: JSON.stringify(body),
+    };
+
+    const res = await fetch(totalUrl, params);
+
+    if (!res.ok) throw new Error(`fetcher`);
+    const response = await res.json();
+    if (!response.data) throw new Error(`fetcher`);
+
+    return response.data;
+  };
+}
+
+type GetOnShareClickProps = {
+  /** @default 'https://api.cloud.ru' */
+  backendHost?: string;
+  /** @default 'https://cloud.ru' */
+  baseUrl?: string;
+};
+
+export function getOnShareClick(props: GetOnShareClickProps = {}) {
+  const { backendHost = DEFAULT_BACKEND_HOST, baseUrl = DEFAULT_BASE_URL } = props;
+
+  const shareSaveService = getShareSaveService(backendHost);
+
+  return async function onShareClick(state: State) {
+    return shareSaveService(state).then(({ Hash: hash }) => {
+      const shareLink = `${baseUrl}/calculator?hash=${hash}`;
+
+      shareLink && copyToClipboard(shareLink);
+    });
+  };
+}

package/src/services/index.ts

@@ -0,0 +1,4 @@
+export * from './getOnDownloadFileClick';
+export * from './getOnShareClick';
+export * from './getFetcherFn';
+export * from './getInitPrice';

package/src/types/CalculatorType.ts

@@ -0,0 +1,16 @@
+import { ValueOf } from '@snack-uikit/utils';
+
+export const CALCULATOR_TYPE = {
+  /** калькулятор на странице /calculator */
+  Main: 'main',
+  /** калькулятор на странице партнеров /calculator/partners */
+  Partners: 'partners',
+  /** калькулятор на страницах продуктах и на промо страницах посвященных продукту */
+  Product: 'product',
+  /**  остальные калькуляторы на сайте */
+  Additional: 'additional',
+  /** тестовый калькулятор /calculator/test */
+  Test: 'test',
+} as const;
+
+export type CalculatorType = ValueOf<typeof CALCULATOR_TYPE>;

package/src/types/CatalogConfig.ts

@@ -0,0 +1,13 @@
+import { Category } from './Category';
+import { Platform, PlatformType } from './Platform';
+import { Product } from './Product';
+
+/** Конфигурация каталога */
+export type CatalogConfig = {
+  /** Платформы */
+  platforms: Platform[];
+  /** Продукты */
+  products: Record<string, Product>;
+  /** Каталог */
+  catalog: Record<PlatformType, Category[]>;
+};

package/src/types/Category.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+
+export type Category = {
+  /** Уникальный идентификатор категории */
+  id: string;
+  /** Название */
+  label: string;
+  /** data-test-id */
+  dataTestId: string;
+  /** Массив Id продуктов отображаемых в категории */
+  visibleProducts: string[];
+  /** Слот для "промо" баннера */
+  banner?: ReactNode;
+};

package/src/types/FetcherFn.ts

@@ -0,0 +1,26 @@
+import { CalculatorType } from './CalculatorType';
+import { AnyType, FormValues } from './FormValues';
+import { Price } from './Price';
+
+export type FetcherFnProps = {
+  /** Продукт */
+  productId: string;
+  /** Конфигурация продукта */
+  formData: AnyType;
+  /** Тип калькулятора */
+  calculatorType: CalculatorType;
+};
+
+export type FetcherFnResponse =
+  | {
+      /** Цена */
+      price: Price;
+      /** Цены по отдельным опциям */
+      priceList?: FormValues;
+      /** Дополнительные поля по продукту */
+      values?: FormValues;
+    }
+  | undefined;
+
+/** Функция для запроса цен по продукту */
+export type FetcherFn = (props: FetcherFnProps) => Promise<FetcherFnResponse>;

package/src/types/FormValues.ts

@@ -0,0 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type AnyType = any;
+
+export type FormValues = Record<string, AnyType>;

package/src/types/Platform.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+
+import { PLATFORM } from '../constants';
+
+type ValueOf<T> = T[keyof T];
+
+export type PlatformType = ValueOf<typeof PLATFORM>;
+
+export type Platform = {
+  /** Уникальный id */
+  id: PlatformType;
+  /** Иконка */
+  icon: ReactNode;
+  /** Название */
+  label: string;
+  /** Дополнительное описание */
+  description: string;
+  /** Доступ к платформе */
+  access: 'public' | 'request' | 'legal';
+  /** data-test-id */
+  dataTestId: string;
+  /** Колбек клика на карточку платформы */
+  onClick?(id: PlatformType): void;
+};

package/src/types/Price.ts

@@ -0,0 +1,18 @@
+import { ValueOf } from '@snack-uikit/utils';
+
+export type Price = {
+  priceHourNds: number;
+  priceDayNds: number;
+  priceMonthNds: number;
+  pricePartnersHourNds: number;
+  pricePartnersDayNds: number;
+  pricePartnersMonthNds: number;
+};
+
+export enum PRICE_PERIOD {
+  Month = 'month',
+  Day = 'day',
+  Hour = 'hour',
+}
+
+export type PricePeriod = ValueOf<typeof PRICE_PERIOD>;

package/src/types/Product.ts

@@ -0,0 +1,39 @@
+import { JSXElementConstructor } from 'react';
+
+import { FormConfig } from '../components';
+import { PlatformType } from './Platform';
+
+export type Product = {
+  /** Уникальный id */
+  id: string;
+  /** Название продукта */
+  label: string;
+  /** Дополнительное описание */
+  caption: string;
+  /** Иконка */
+  icon: JSXElementConstructor<{
+    size?: number;
+    className?: string;
+  }>;
+  /** Платформа */
+  platform: PlatformType;
+  /** data-test-id */
+  dataTestId?: string;
+  /** Флаг является ли продукт фритирным */
+  freeTier?: boolean;
+  /** Можно ли менять кол-во продуктов текущей конфигурации в чеке */
+  enableChangeProductQuantity?: boolean;
+  /** Задизейблить изменение количества продуктов */
+  disabledProductQuantity?: boolean;
+  /** Ограничить минимальное и максимальное количество продукта */
+  productQuantityValues?: {
+    min?: number;
+    max?: number;
+  };
+  /** Можно ли подключить продукта в консоли */
+  enableConnectToConsole?: boolean;
+  /** Конфиг страницы расчета по продукту */
+  formConfig?: FormConfig;
+  /** Имеет ли продукт сервисы hasPayaGo (только с помесячной тарификацией) */
+  hasPayaGo?: boolean;
+};

package/src/types/ProductState.ts

@@ -0,0 +1,11 @@
+import { FormValues } from './FormValues';
+import { Price } from './Price';
+
+export type ProductState = {
+  /** Конфигурация продукта */
+  data: FormValues;
+  /** Цена продукта */
+  price: Price;
+  /** Цены по отдельным опциям */
+  priceList?: FormValues;
+};

package/src/types/State.ts

@@ -0,0 +1,7 @@
+import { CalculatorType } from './CalculatorType';
+import { ProductState } from './ProductState';
+
+export type State = {
+  products: Record<string, ProductState[]>;
+  calculatorType: CalculatorType;
+};

package/src/types/index.ts

@@ -0,0 +1,10 @@
+export * from './Category';
+export * from './Platform';
+export * from './Product';
+export * from './Price';
+export * from './FormValues';
+export * from './CatalogConfig';
+export * from './CalculatorType';
+export * from './FetcherFn';
+export * from './State';
+export * from './ProductState';

package/src/utils/filterNonEmptyArrays.ts

@@ -0,0 +1,13 @@
+import { FormValues } from '../types';
+
+export function filterNonEmptyArrays(input: FormValues): FormValues {
+  const result: FormValues = {};
+
+  for (const key in input) {
+    if (input[key]?.length > 0) {
+      result[key] = input?.[key];
+    }
+  }
+
+  return result;
+}

package/src/utils/formatNumber.ts

@@ -0,0 +1,5 @@
+export function formatNumber(value: number = 0) {
+  return new Intl.NumberFormat('ru-RU', {
+    maximumFractionDigits: 2,
+  }).format(value);
+}

package/src/utils/getPrice.ts

@@ -0,0 +1,38 @@
+import { DEFAULT_PRICE } from '../constants';
+
+export function getPrice({
+  price = DEFAULT_PRICE,
+  pricePeriod,
+  partners,
+}: {
+  price?: typeof DEFAULT_PRICE;
+  pricePeriod: string;
+  partners?: boolean;
+}) {
+  if (partners) {
+    switch (pricePeriod) {
+      case 'day': {
+        return price?.pricePartnersDayNds;
+      }
+      case 'hour': {
+        return price?.pricePartnersHourNds;
+      }
+      case 'month':
+      default: {
+        return price?.pricePartnersMonthNds;
+      }
+    }
+  }
+  switch (pricePeriod) {
+    case 'day': {
+      return price?.priceDayNds;
+    }
+    case 'hour': {
+      return price?.priceHourNds;
+    }
+    case 'month':
+    default: {
+      return price?.priceMonthNds;
+    }
+  }
+}

package/src/utils/index.ts

@@ -0,0 +1,5 @@
+export * from './value';
+export * from './formatNumber';
+export * from './getPrice';
+export * from './filterNonEmptyArrays';
+export * from './parseKeyToDataTest';

package/src/utils/parseKeyToDataTest.ts

@@ -0,0 +1,14 @@
+import { CALCULATOR_DATA_TEST_ID } from '../constants';
+
+export function parseKeyToDataTest(component: string, value?: string) {
+  if (!value) {
+    return `${CALCULATOR_DATA_TEST_ID}-${component}`;
+  }
+
+  const parsed = value
+    .replace(/\./g, '-')
+    .replace(/([a-z])([A-Z])/g, '$1-$2')
+    .toLowerCase();
+
+  return `${CALCULATOR_DATA_TEST_ID}-${component}-${parsed}`;
+}

package/src/utils/value.ts

@@ -0,0 +1,11 @@
+import { get, set } from 'lodash';
+
+import { AnyType } from '../types';
+
+export function getValue(obj: AnyType, key: string): AnyType {
+  return get(obj, key);
+}
+
+export function setValue(obj: AnyType, key: string, value: AnyType): AnyType {
+  return set(obj, key, value);
+}