@redneckz/wildless-cms-uni-blocks 0.14.899 → 0.14.901

package/src/components/ExchangeRateTile/ExchangeRateTile.ui.json

@@ -0,0 +1,8 @@
+{
+  "content": {},
+  "style": {
+    "ui:options": {
+      "minCols": 6
+    }
+  }
+}

package/src/components/ExchangeRateTile/ExchangeRateTileContent.ts

@@ -0,0 +1,11 @@
+import { type TitleProps } from '../../model/HeadlineType';
+import { type LinkButtonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
+import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
+
+/**
+ * @title Курсы обмена валют
+ */
+export type ExchangeRateTileContent = UniBlockContent &
+  TitleProps & {
+    button?: LinkButtonContent;
+  };

package/src/components/ExchangeRateTile/calculateResult.ts

@@ -0,0 +1,9 @@
+import { roundTo } from '../../utils/roundTo';
+
+export const calculateResult = (value: string, rate: number, precision: boolean) => {
+  const result = Number(formatValue(value)) * Math.pow(rate, precision ? -1 : 1);
+
+  return Number.isInteger(result) ? result : roundTo(result);
+};
+
+export const formatValue = (value: string) => value.replace(/[^\d.,]/g, '').replace(',', '.');

package/src/components/ExchangeRateTile/callbackCurrencySelect.ts

@@ -0,0 +1,25 @@
+import { tableFunc } from '../../utils/tableFunc';
+import { Currency } from './CurrencyProps';
+
+interface TableFuncProps {
+  value: Currency;
+  oppositeValue: Currency;
+  handleConvert: (currencyFrom?: Currency, currencyTo?: Currency) => void;
+}
+
+export const callbackCurrencySelect = (props: TableFuncProps) =>
+  tableFunc<TableFuncProps, () => void>([
+    [
+      (_) => _.value !== Currency.RUB && _.oppositeValue !== Currency.RUB,
+      () => props.handleConvert(props.value, Currency.RUB),
+    ],
+    [
+      (_) => _.value === Currency.RUB && _.oppositeValue === Currency.RUB,
+      () => props.handleConvert(props.value, Currency.USD),
+    ],
+    [
+      (_) => _.value === Currency.RUB && _.oppositeValue === Currency.RUB,
+      () => props.handleConvert(props.value, Currency.CNY),
+    ],
+    [() => true, () => props.handleConvert(props.value)],
+  ])(props)?.();

package/src/components/ExchangeRateTile/formatCurrency.ts

@@ -0,0 +1,8 @@
+import { Currency } from './CurrencyProps';
+
+const currencyNumberFormat = new Intl.NumberFormat('ru', {
+  style: 'currency',
+  currency: Currency.RUB,
+});
+
+export const formatCurrency = (value?: number) => (value ? currencyNumberFormat.format(value) : '');

package/src/components/ExchangeRateTile/renderInput.tsx

@@ -0,0 +1,43 @@
+import { type ControlProps } from '../../model/ControlProps';
+import { type PlaceholderProps } from '../../model/PlaceholderProps';
+import { Input } from '../../ui-kit/Input/Input';
+import { type Option } from '../../ui-kit/Select/Option';
+import { Select } from '../../ui-kit/Select/Select';
+import { type Currency } from './CurrencyProps';
+import { type ExchangeCurrencyItem } from './ExchangeCurrencyCalculator';
+
+interface InputProps extends PlaceholderProps, ControlProps<string> {
+  rates: ExchangeCurrencyItem[];
+  selected: string;
+  setSelected: (value: Currency) => void;
+}
+
+export function renderInput(props: InputProps) {
+  const { placeholder, rates, selected, value, onChange, setSelected } = props;
+  const ratesOptions: Option[] = rates.map((_) => ({
+    key: _?.currency?.currency ?? '',
+    text: _?.currency?.currency ?? '',
+  }));
+  const selectedValue: Option = { key: selected, text: selected };
+
+  return (
+    <div className="relative flex">
+      <Input
+        className="shrink-0 text-l w-full appearance-none -mr-20"
+        placeholder={placeholder}
+        type="text"
+        value={value}
+        onChange={onChange}
+      />
+      {ratesOptions.length ? (
+        <Select
+          className="absolute right-0"
+          isBorder={false}
+          onChange={(_) => setSelected(_.key as Currency)}
+          options={ratesOptions}
+          value={selectedValue}
+        />
+      ) : null}
+    </div>
+  );
+}

package/src/components/ExchangeRateTile/useFetchExchangeRateData.ts

@@ -0,0 +1,25 @@
+import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
+import { API_BASE_URI } from '../../api/apiBaseUrl';
+import { type ExchangeCurrencyItem } from '../../components/ExchangeRateTile/ExchangeCurrencyCalculator';
+import { type Region } from '../../hooks/useRegions';
+import { fetchJSONUnsafe, type FetchJSONUnsafeType } from '../../utils/fetchJSON';
+
+export interface ExchangeData {
+  exchangeRate?: {
+    currencies?: ExchangeCurrencyItem[];
+  };
+  address?: string;
+}
+
+const EXCHANGE_RATES_URL = `${API_BASE_URI}/exchangerates`;
+
+export function useFetchExchangeRateData(currentRegion: Region) {
+  const regionCode = currentRegion?.code || '000';
+
+  const { data } = useAsyncData(
+    EXCHANGE_RATES_URL + `?regionCode=${regionCode}`,
+    fetchJSONUnsafe as FetchJSONUnsafeType<ExchangeData>,
+  );
+
+  return data || {};
+}