Added Defi_spring and Spotnet Documentation

docker-compose.back.yaml

@@ -1,4 +1,4 @@
-version: '3.8'
+
 
 networks:
   app_network:

docker-compose.dev.yaml

@@ -1,4 +1,4 @@
-version: '3.8'
+
 
 networks:
   app_network:

docker-compose.yaml

@@ -1,4 +1,4 @@
-version: '3.8'
+
 
 networks:
   app_network:
@@ -21,8 +21,6 @@ services:
       - app_network
   backend:
     build: .
-    command:
-      - bash /app/entrypoint.sh
     restart: always
     volumes:
       - ./entrypoint.sh:/app/entrypoint.sh
@@ -36,7 +34,7 @@ services:
       - app_network
 
   db:
-    image: postgres:16
+    image: postgres:14
     container_name: postgres
     restart: always
     environment:
@@ -55,36 +53,5 @@ services:
       timeout: 5s
       retries: 5
 
-  celery:
-    build: .
-    command: celery -A spotnet_tracker.celery_config worker --loglevel=INFO
-    volumes:
-      - .:/app
-    depends_on:
-      - redis
-    networks:
-      - app_network
-
-  celery_beat:
-    build: .
-    command: celery -A spotnet_tracker.celery_config beat --loglevel=INFO
-    volumes:
-      - .:/app
-    depends_on:
-      - redis
-    networks:
-      - app_network
-
-  redis:
-    image: redis:latest
-    restart: always
-    ports:
-      - "6379:6379"
-    volumes:
-      - redis_data:/data
-    networks:
-      - app_network
-
 volumes:
-  postgres_data:
-  redis_data:
+  postgres_data:

frontend/src/App.jsx

@@ -16,6 +16,8 @@ import { useWalletStore } from 'stores/useWalletStore';
 import { Notifier } from 'components/Notifier/Notifier';
 import { useConnectWallet } from 'hooks/useConnectWallet';
 import OverviewPage from 'pages/spotnet/overview/Overview';
+import SpringDefiPage from 'pages/spotnet/defi-spring/Defi-spring';
+
 import { ActionModal } from 'components/ui/ActionModal';
 import Stake from 'pages/vault/stake/Stake';
 
@@ -102,6 +104,7 @@ function App() {
           <Route path="/dashboard" element={<Dashboard telegramId={tgUser} />} />
           <Route path="/withdraw" element={<Withdraw />} />
           <Route path="/overview" element={<OverviewPage />} />
+          <Route path="/springdefi" element={<SpringDefiPage />} />
           <Route path="/form" element={<Form />} />
           <Route path="/documentation" element={<Documentation />} />
 

frontend/src/components/Footer/Footer.jsx

@@ -59,7 +59,7 @@ function Footer() {
           Overview
         </NavLink>
         <Link to="/terms">Terms & Conditions</Link>
-        <Link to="/defi">Defi Spring Rewards</Link>
+        <Link to="/springdefi">Defi Spring Rewards</Link>
       </nav>
       <div className="footer-social">
         {socialLinks.map(({ name, href, icon: Icon }) => (

frontend/src/pages/spotnet/defi-spring/Defi-spring.jsx

@@ -0,0 +1,118 @@
+import React, { useEffect } from 'react';
+import './defi-spring.css';
+import TableOfContents from '../../../components/TableOfContent/TableOfContents';
+import ScrollButton from '../../../components/scrollButton/ScrollButton';
+import Sections from 'components/Sections';
+
+const Documentation = () => {
+
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, []);
+
+
+  const tableOfContents = [
+    { title: 'Introduction', link: '#introduction' },
+    {
+      title: 'Program overview',
+      link: '#overview',
+    },
+    { title: 'Claiming rewards', link: '#claiming-rewards' },
+    { title: 'Important notes', link: '#important-notes' },
+    { title: 'Maximize your profit', link: '#maximize-your-profit' },
+    { title: 'The Hub And Zones', link: '#hub-2' },
+    { title: 'The Hub And Zones', link: '#hub-3' },
+    { title: 'The Hub And Zones', link: '#hub-4' },
+    { title: 'The Hub And Zones', link: '#hub-5' }
+  ];
+
+  const sectionsData = [
+    {
+      id: 'Introduction',
+      title: 'introduction',
+      content: [
+        {
+          type: 'text',
+          value:
+            'Welcome to the DeFi Spring Program!\nwhere you can earn rewards through the zkLend protocol. As part of this initiative, participants will have the opportunity to receive STRK token rewards for engaging with the platform. Here’s everything you need to know to get started and make the most of your participation.',
+        },
+      ],
+    },
+    {
+      id: 'overview',
+      title: 'Program Overview',
+      content: [
+        {
+          type: 'list',
+          items: [
+            'Start Date: March 14, 2024, at 00:00 UTC.',
+            'Duration: 6-8 months.',
+            'Eligibility: Open to everyone!.',
+            'Reward APR: The approximate $STRK rewards APR will be displayed next to eligible supply and borrow pools, in addition to the base interest rate.',
+          ]
+        },
+      ],
+    },
+    {
+      id: 'claiming-rewards',
+      title: 'Claiming rewards',
+      content: [
+        {
+          type: 'list',
+          items: [
+            'Reward Phases: Rewards are earned in phases, each lasting from Thursday to Wednesday. After each phase ends, it will take about 1 day for the rewards to be claimable.',
+            'Reward Claims: Rewards can be claimed via zkLend Rewards.',
+            'Accrued Rewards: The total rewards earned will be visible at the end of the program. You can claim your rewards all at once at that time.',
+            'Final Claim Deadline: Be sure to claim your rewards before the DeFi Spring program ends. Any unclaimed rewards will be returned to the Starknet Foundation.'
+          ],
+        },
+      ],
+    },
+
+    {
+      id: 'important-notes',
+      title: 'Important notes',
+      content: [
+        {
+          type: 'list',
+          items: [
+            'Dynamic APRs: The APRs (Annual Percentage Rates) are updated daily based on market conditions, pool sizes, and allocations from the Starknet Foundation. These rates may change throughout the program.',
+            'Incentive Strategy: Different actions, such as depositing or borrowing, may receive varying rewards depending on market dynamics',
+            'Recursive Borrow Adjustment: Rewards are based on your net deposit after accounting for borrowed funds. For example, if you deposit 100 ETH and borrow 50 ETH, your net deposit is considered 50 ETH. Recursive borrowers will see a higher APR than what they ultimately claim.',
+            'Stablecoin Considerations: From Phase 3 onward, stablecoins (USDC, USDT, DAI) will be treated as the same asset for reward calculations. Your eligible net deposit for these will be calculated as the value of stablecoins deposited minus the value of stablecoins borrowed.'
+          ],
+        },
+
+      ],
+    },
+
+    {
+      id: 'maximize-your-profit',
+      title: 'Maximize your profit',
+      content: [
+        {
+          type: 'text',
+          value: 'By participating in the DeFi Spring program, you can leverage your assets and earn additional rewards, contributing to a more liquid and dynamic DeFi ecosystem. Keep an eye on your rewards as you participate, and make the most out of the program!'
+        },
+
+      ],
+    },
+
+  ];
+
+  return (
+    <div className="documentation-page">
+      <TableOfContents tabelTitle={"Table Of Content"} defaultActiveId={"introduction"} headerHeight={80} items={tableOfContents} />
+
+      <div className="main-content">
+        <h1 className="main-title">Defi Spring Documentation</h1>
+        <Sections sections={sectionsData} />
+      </div>
+
+      <ScrollButton />
+    </div>
+
+  );
+};
+
+export default Documentation;

frontend/src/pages/spotnet/defi-spring/defi-spring.css

@@ -0,0 +1,70 @@
+.documentation-container {
+  display: flex;
+  min-height: 100vh;
+  color: var(--primary);
+  position: relative;
+  padding-top: 70px;
+}
+
+.documentation-container::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+  background-image: radial-gradient(circle at 85% 15%, rgba(255, 255, 255, 0.25) 1px, transparent 1px),
+    radial-gradient(circle at 15% 85%, rgba(255, 255, 255, 0.25) 1px, transparent 1px),
+    radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.25) 1px, transparent 1px);
+  background-size: 100px 100px;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.main-content {
+  margin-left: 370px;
+  flex: 1;
+  background: url('../../../../public/background.png') no-repeat;
+  background-size: cover;
+  background-position: center 39%;
+  position: relative;
+  min-height: 100vh;
+}
+
+.sections-container {
+  margin-left: 20px;
+}
+
+.main-title {
+  font-size: 2.5rem;
+  font-weight: 700;
+  margin-top: 94px;
+  margin-bottom: 3rem;
+  margin-left: 40px;
+  color: white !important;
+  background: white;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+html {
+  scroll-behavior: smooth;
+  scroll-padding-top: 80px;
+}
+
+@media (max-width: 1440px) {
+  .main-content {
+    margin-left: 280px;
+  }
+}
+
+@media (max-width: 768px) {
+  .main-content {
+    margin-left: 0;
+    padding: 1rem;
+  }
+
+  .main-title {
+    font-size: 2rem;
+  }
+}

frontend/src/pages/spotnet/documentation/Documentation.jsx

@@ -23,8 +23,8 @@ const Documentation = () => {
         { title: 'Cosmos Overview', link: '#cosmos-4' }
       ]
     },
+    { title: 'How it performs', link: '#how-it-performs' },
     { title: 'Getting Started', link: '#getting-started' },
-    { title: 'Features Overview', link: '#features' },
     { title: 'The Hub And Zones', link: '#hub-1' },
     { title: 'The Hub And Zones', link: '#hub-2' },
     { title: 'The Hub And Zones', link: '#hub-3' },
@@ -40,7 +40,7 @@ const Documentation = () => {
         {
           type: 'text',
           value:
-            'Welcome to [Product Name] Documentation\n[Product Name] is a decentralized platform designed to [describe purpose, e.g., "empower users to securely manage digital assets and access DeFi tools effortlessly"]. This documentation provides a comprehensive guide on using [Product Name] and making the most of its features.',
+            'Welcome to zkLend Documentation\nzkLend is a decentralized platform designed to [describe purpose, e.g., "empower users to securely manage digital assets and access DeFi tools effortlessly"]. This documentation provides a comprehensive guide on using SpotNet and making the most of its features.',
         },
       ],
     },
@@ -67,6 +67,52 @@ const Documentation = () => {
         },
       ],
     },
+    {
+      id: 'how-it-performs',
+      title: 'How it performs',
+      content: [
+        {
+          type: 'text',
+          value: 'Spot Leverage Strategy with ZkLend',
+        },
+        {
+          type: 'list',
+          items: [
+            'You put some ETH collateral into deposit as ZkLend.',
+            'Then, we swap your ETH into USDC and use it as collateral for a loan in the ZkLend position.',
+            'This process can be repeated 2 to 5 times, depending on the leverage multiplier you choose, to increase your collateral and borrowing capacity.',
+          ],
+        },
+        {
+          type: 'text',
+          value: 'Once your position is opened, you can view it on the Dashboard page. There, you’ll see:',
+        },
+        {
+          type: 'list',
+          items: [
+            'Health Factor: A measure of how safe your position is (the higher, the better).',
+            'Collateral: The value of your assets in the position.',
+            'Borrowed Amount: The total amount you have borrowed.'
+          ],
+        },
+        {
+          type: 'text',
+          value: 'About position',
+        },
+        {
+          type: 'list',
+          items:
+            [
+              'If you wish to close your position, simply click on `Reedem` in the Dashboard page. This will allow you to withdraw your collateral and repay the loan.',
+              'Currently, Spotnet only allows you to open a single position.',
+              'If your health ratio level will be zero, you will be liquidated by ZkLend.',
+              'You also have the option to enable notifications on Telegram, so you will be alerted if your health ratio reaches a dangerous level.'
+            ],
+        },
+
+      ],
+    },
+
     {
       id: 'getting-started',
       title: 'Getting Started',
@@ -92,8 +138,8 @@ const Documentation = () => {
       <TableOfContents tabelTitle={"Table Of Content"} defaultActiveId={"introduction"} headerHeight={80} items={tableOfContents} />
 
       <div className="main-content">
-        <h1 className="main-title">zkLend Documentation</h1>
-          <Sections sections={sectionsData} />
+        <h1 className="main-title">Spot Documentation</h1>
+        <Sections sections={sectionsData} />
       </div>
 
       <ScrollButton />