fix styles for payment tab

README.md

@@ -40,3 +40,5 @@ docker volume prune - удалить неиспользуемые базы да
 {URL}/api/payments/webhook/yookassa
 
 https://dev-workspace.not-copy.com/api/payments/webhook/yookassa
+
+https://mutely-profound-sandfish.cloudpub.ru/api/payments/webhook/yookassa

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "no-copy-frontend",
-	"version": "0.69.0",
+	"version": "0.70.0",
 	"private": true,
 	"scripts": {
 		"dev": "next dev -p 2999",

src/app/styles/payment-container.scss

@@ -202,7 +202,8 @@
 
 		.subscription-grid {
 			display: grid;
-			grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+			/* grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); */
+			grid-template-columns: 1fr 1fr 1fr 1fr;
 			gap: 20px;
 			margin-bottom: 25px;
 		}

src/app/ui/payment/payment-tab-tariffs.tsx

@@ -225,7 +225,8 @@ export default function PaymentTabTariffs() {
 							tokens: number;
 							maxFilesCount: number;
 							diskSize: number;
-						}) => (
+						}) => {
+							return (
 								<div className="plan-card animate-card" key={item.id}>
 									<div className="plan-header">
 										<h3 className="plan-name">
@@ -266,7 +267,9 @@ export default function PaymentTabTariffs() {
 										</button>
 									</div>
 								</div>
-						))}
+							)
+						}
+						)}
 					</div>
 				)}
 			</div>

src/app/ui/payment/payment-tabs.tsx

@@ -5,7 +5,7 @@ import PaymentTabTariffs from '@/app/ui/payment/payment-tab-tariffs';
 import PaymentTubBuyTokens from './payment-tab-buy-tokens';
 import PaymentTabTransactionHistory from './payment-tab-transaction-history';
 import { useTranslations } from 'next-intl';
-
+import { useUserProfile } from '@/app/hooks/react-query/useUserDataInfo';
 
 export default function PaymentTabs() {
 	let [selectedTab, setSelectedTab] = useState('1');
@@ -14,6 +14,12 @@ export default function PaymentTabs() {
 		setSelectedTab(tab);
 	}
 
+	const { data: userData, isLoading, isError, error } = useUserProfile();
+
+	if (typeof userData?.tariffInfo?.tokens !== 'number') {
+		return null
+	}
+
 	return (
 		<>
 			<div className="payment-tabs">