Dev payment

.github/workflows/pr_closed_test.yml

@@ -62,6 +62,8 @@ jobs:
             echo DEBUG=${{ secrets.TEST_DEBUG }} >> .env
             echo EMAIL_BACKEND_TYPE=${{ secrets.EMAIL_BACKEND_TYPE }} >> .env
             echo REACT_APP_SERVER_TYPE=${{ secrets.REACT_APP_SERVER_TYPE_TEST }} >> .env
+            echo YOOKASSA_CLIENT_ID=${{ secrets.YOOKASSA_CLIENT_ID }} >> .env
+            echo YOOKASSA_CLIENT_SECRET=${{ secrets.YOOKASSA_CLIENT_SECRET }} >> .env
             sudo docker-compose pull
             sudo docker-compose up -d
 

src/hooks/useValidation.js

@@ -8,6 +8,7 @@ const useValidation = (value, validations, errorValidateMessage) => {
   const [minLengthError, setMinLengthError] = useState(false);
   const [maxLengthError, setMaxLengthError] = useState(false);
   const [regexError, setRegexError] = useState(false);
+  const [isZeroError, setIsZeroError] = useState(false);
 
   useEffect(() => {
     if (!validations.notEmpty && !value) {
@@ -28,6 +29,9 @@ const useValidation = (value, validations, errorValidateMessage) => {
         case 'regex':
           validations[validation].test(value) ? setRegexError(false) : setRegexError(true);
           break;
+        case 'isZero':
+          parseInt(value, 10) === 0 ? setIsZeroError(true) : setIsZeroError(false);
+          break;
         default:
           break;
       }
@@ -43,10 +47,12 @@ const useValidation = (value, validations, errorValidateMessage) => {
       setErrorText(errorValidateMessage.TOO_LONG);
     } else if (regexError) {
       setErrorText(errorValidateMessage.INVALID);
+    } else if (isZeroError) {
+      setErrorText(errorValidateMessage.IS_ZERO);
     } else {
       setErrorText('');
     }
-  }, [emptyError, minLengthError, maxLengthError, regexError]);
+  }, [emptyError, minLengthError, maxLengthError, regexError, isZeroError]);
 
   return errorText;
 };

src/modules/AboutShelter/AboutShelter.jsx

@@ -9,19 +9,28 @@ import EditIcon from '../../images/EditIcon/EditIcon';
 import DeleteIcon from '../../images/DeleteIcon/DeleteIcon';
 import ShelterOwnerStatistics from '../ShelterOwnerStatistics/ShelterOwnerStatistics';
 import petLogo from '../../images/pet.jpg';
+import { setPayment } from './api';
 
 // TODO переделать названия классов (объединить?), не совсем понятно, по какому принципу about-shelter, shelter-info
 
 const AboutShelter = () => {
   const { shelter, isOwner, isLoading } = useOutletContext();
-
   if (isLoading) {
     return null;
   }
 
   // TODO подключить рероутер на редактирование инфо о приюте (6.2.1.4 в фигме)
   // TODO сделать попап при удалении приюта (6.2.1.3 в фигме)
 
+  const handleSetPayment = async () => {
+    try {
+      const paymentConfirmUrl = await setPayment();
+      window.open(paymentConfirmUrl, '_blank');
+    } catch (error) {
+      throw new Error(error.message);
+    }
+  };
+
   return (
     <section className='shelter-section shelter-section__about'>
       <div className='shelter-section__top'>
@@ -100,7 +109,9 @@ const AboutShelter = () => {
           <h3 className='standard-font_type_h3 standard-font'>
             Подключить платежную систему
           </h3>
-          <Button>Подключить платеж</Button>
+          <Button
+            onClick={handleSetPayment}
+          >Подключить платеж</Button>
         </div>
       )}
     </section>

src/modules/AboutShelter/api.js

@@ -0,0 +1,24 @@
+import { baseUrl, apiHeaders } from '../../utils/constants';
+
+// eslint-disable-next-line
+export const setPayment = async (id, amount) => {
+  try {
+    if (localStorage.getItem('access')) {
+      const token = localStorage.getItem('access');
+      apiHeaders.authorization = `Bearer ${token}`;
+    }
+    const response = await fetch(`${baseUrl}/v1/payments/get-partner-link/`, {
+      method: 'GET',
+      headers: apiHeaders,
+    });
+
+    if (response.ok) {
+      const data = await response.json();
+      delete apiHeaders.authorization;
+      return data.partner_link;
+    }
+    throw new Error('Ошибка при отправке запроса');
+  } catch (error) {
+    throw new Error('Ошибка:', error);
+  }
+};

src/modules/HelpToShelter/ApiHelpToShelter.js

@@ -1,20 +1,23 @@
-import { baseUrl } from '../../utils/constants';
+import { baseUrl, apiHeaders } from '../../utils/constants';
 
 // eslint-disable-next-line
 export const donateToShelter = async (id, amount) => {
   try {
+    if (localStorage.getItem('access')) {
+      const token = localStorage.getItem('access');
+      apiHeaders.authorization = `Bearer ${token}`;
+    }
     const response = await fetch(`${baseUrl}/v1/payments/shelters/${id}/donate/`, {
       method: 'POST',
-      headers: {
-        'Content-Type': 'application/json'
-      },
+      headers: apiHeaders,
       body: JSON.stringify({
         amount
       })
     });
 
     if (response.ok) {
       const data = await response.json();
+      delete apiHeaders.authorization;
       return data.payment_confirm_url;
     }
     throw new Error('Ошибка при отправке запроса');

src/modules/HelpToShelter/HelpToShelter.jsx

@@ -8,14 +8,14 @@ import * as errorMessage from '../../utils/errorMessage';
 import useInput from '../../hooks/useInput';
 import { donateToShelter } from './ApiHelpToShelter';
 
+
 const HelpToShelter = () => {
   const { id } = useParams();
-  const materialAid = useInput('', { notEmpty: true, maxLength: 12, regex: regex.NUMBER }, errorMessage.DONATION_AMOUNT);
-  const { isOwner, isAuth, isShelterOwner } = useOutletContext();
-
+  const materialAid = useInput('', { notEmpty: true, maxLength: 12, regex: regex.NUMBER, isZero: true }, errorMessage.DONATION_AMOUNT);
+  const { shelter } = useOutletContext();
   const handleDonate = async () => {
-    if (materialAid.value !== '') {
-      const donationAmount = parseInt(materialAid.value, 10);
+    const donationAmount = parseInt(materialAid.value, 10);
+    if ((donationAmount > 0) && (materialAid.value.length < 12)) {
       try {
         const paymentConfirmUrl = await donateToShelter(id, donationAmount);
         window.open(paymentConfirmUrl, '_blank');
@@ -27,23 +27,21 @@ const HelpToShelter = () => {
 
   return (
     <section className='shelter-section help-to-shelter'>
-      { !isOwner && (
+      {shelter.is_partner && (
         <div className='help-to-shelter__mat'>
           <h2 className='shelter-section__title help-to-shelter__title'>Материальная помощь</h2>
-          { (isShelterOwner || isAuth) && (isAuth || isShelterOwner) && (
-            <DeclarationInput
-              caption='Какую сумму вы хотите пожертвовать?'
-              inputState={materialAid}
-              type='number'
-              name='salaryInput'
-              required
-              placeholder='1000'
-            />
-          )}
+          <DeclarationInput
+            caption='Какую сумму вы хотите пожертвовать?'
+            inputState={materialAid}
+            type='number'
+            name='salaryInput'
+            required
+            placeholder='1000'
+          />
           <Button
             className='help-to-shelter__button'
             onClick={handleDonate}
-            disabled={(!isAuth && !isShelterOwner) || materialAid.value === ''}
+            disabled={materialAid.value === ''}
           >
             Пожертвовать деньги
           </Button>

src/modules/ShelterOwnerProfile/ShelterOwnerProfile.jsx

@@ -6,7 +6,6 @@ import ProfileSheltersBlock from '../../components/ProfileSheltersBlock/ProfileS
 const ShelterOwnerProfile = () => {
   const currentUser = useContext(CurrentUserContext);
   const myShelters = [currentUser.own_shelter];
-
   return (
     <div>
       <ProfileSheltersBlock

src/ui/DeclarationInput/DeclarationInput.jsx

@@ -2,9 +2,10 @@ import React from 'react';
 import './DeclarationInput.scss';
 
 // TODO убрать li,  это форма, а не список. Выше, где используется, заменить ul на form
+// li изменено на div
 const DeclarationInput = ({ caption, inputState, type, name, placeholder, required, showError = true }) => {
   return (
-    <li className='declaration-input'>
+    <div className='declaration-input'>
       <label className='declaration-input__caption' htmlFor={name}>
         {caption}
       </label>
@@ -20,7 +21,7 @@ const DeclarationInput = ({ caption, inputState, type, name, placeholder, requir
         required={required}
       />
       {showError && <p className='declaration-input__error'>{inputState.dirty && inputState.invalidText}</p>}
-    </li>
+    </div>
   );
 };
 

src/utils/errorMessage.js

@@ -123,4 +123,5 @@ export const VACANCY_DESCRIPTION = {
 export const DONATION_AMOUNT = {
   TOO_LONG: tooLong,
   NOT_FOUND: 'Введите сумму пожертвования',
+  IS_ZERO: 'Cумма должно превышать нулевое значение',
 };