Skip to content

F
frontend
Commit 09695c1d authored by Yuri Mikhin's avatar Yuri Mikhin Committed by Yuri Mikhin
Browse files
Options

Improve code style in Apps page.

parent 3dbee58b
Hide whitespace changes
Inline Side-by-side
Showing with 122 additions and 127 deletions
ui/apps/contants.ts → data/apps.ts
View file @ 09695c1d
import type { AppCategory, AppItemOverview } from '~/types/client/apps'; import type { AppItemOverview } from 'types/client/apps';
export const APP_CATEGORIES: Array<AppCategory> = [ import { APP_CATEGORIES } from 'ui/apps/constants';
{
id: 'defi',
name: 'DeFi',
},
{
id: 'exchanges',
name: 'Exchanges',
},
{
id: 'finance',
name: 'Finance',
},
{
id: 'games',
name: 'Games',
},
{
id: 'marketplaces',
name: 'Marketplaces',
},
{
id: 'nft',
name: 'NFT',
},
{
id: 'security',
name: 'Security',
},
{
id: 'social',
name: 'Social',
},
{
id: 'tools',
name: 'Tools',
},
{
id: 'Yield-farming',
name: 'yield-farming',
},
];
export const TEMPORARY_DEMO_APPS: Array<AppItemOverview> = [ export const TEMPORARY_DEMO_APPS: Array<AppItemOverview> = [
{ {
......
icons/empty.svg deleted 100644 → 0
View file @ 3dbee58b
<svg width="240" height="192" viewBox="0 0 240 192" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M82.6667 4H56C53.7909 4 52 5.79086 52 8.00001V34.6667C52 36.8758 53.7909 38.6667 56 38.6667H82.6667C84.8758 38.6667 86.6667 36.8758 86.6667 34.6667V8C86.6667 5.79087 84.8758 4 82.6667 4ZM56 0C51.5817 0 48 3.58173 48 8.00001V34.6667C48 39.0849 51.5817 42.6667 56 42.6667H82.6667C87.0849 42.6667 90.6667 39.0849 90.6667 34.6667V8C90.6667 3.58172 87.0849 0 82.6667 0H56ZM178.667 4H152C149.791 4 148 5.79086 148 8.00001V34.6667C148 36.8758 149.791 38.6667 152 38.6667H178.667C180.876 38.6667 182.667 36.8758 182.667 34.6667V8C182.667 5.79087 180.876 4 178.667 4ZM152 0C147.582 0 144 3.58173 144 8.00001V34.6667C144 39.0849 147.582 42.6667 152 42.6667H178.667C183.085 42.6667 186.667 39.0849 186.667 34.6667V8C186.667 3.58172 183.085 0 178.667 0H152ZM56 52H82.6667C84.8758 52 86.6667 53.7909 86.6667 56V82.6667C86.6667 84.8758 84.8758 86.6667 82.6667 86.6667H56C53.7909 86.6667 52 84.8758 52 82.6667V56C52 53.7909 53.7909 52 56 52ZM48 56C48 51.5817 51.5817 48 56 48H82.6667C87.0849 48 90.6667 51.5817 90.6667 56V82.6667C90.6667 87.0849 87.0849 90.6667 82.6667 90.6667H56C51.5817 90.6667 48 87.0849 48 82.6667V56ZM82.6667 100H56C53.7909 100 52 101.791 52 104V130.667C52 132.876 53.7909 134.667 56 134.667H82.6667C84.8758 134.667 86.6667 132.876 86.6667 130.667V104C86.6667 101.791 84.8758 100 82.6667 100ZM56 96C51.5817 96 48 99.5817 48 104V130.667C48 135.085 51.5817 138.667 56 138.667H82.6667C87.0849 138.667 90.6667 135.085 90.6667 130.667V104C90.6667 99.5817 87.0849 96 82.6667 96H56ZM56 148H82.6667C84.8758 148 86.6667 149.791 86.6667 152V178.667C86.6667 180.876 84.8758 182.667 82.6667 182.667H56C53.7909 182.667 52 180.876 52 178.667V152C52 149.791 53.7909 148 56 148ZM48 152C48 147.582 51.5817 144 56 144H82.6667C87.0849 144 90.6667 147.582 90.6667 152V178.667C90.6667 183.085 87.0849 186.667 82.6667 186.667H56C51.5817 186.667 48 183.085 48 178.667V152ZM178.667 52H152C149.791 52 148 53.7909 148 56V82.6667C148 84.8758 149.791 86.6667 152 86.6667H178.667C180.876 86.6667 182.667 84.8758 182.667 82.6667V56C182.667 53.7909 180.876 52 178.667 52ZM152 48C147.582 48 144 51.5817 144 56V82.6667C144 87.0849 147.582 90.6667 152 90.6667H178.667C183.085 90.6667 186.667 87.0849 186.667 82.6667V56C186.667 51.5817 183.085 48 178.667 48H152ZM152 100H178.667C180.876 100 182.667 101.791 182.667 104V130.667C182.667 132.876 180.876 134.667 178.667 134.667H152C149.791 134.667 148 132.876 148 130.667V104C148 101.791 149.791 100 152 100ZM144 104C144 99.5817 147.582 96 152 96H178.667C183.085 96 186.667 99.5817 186.667 104V130.667C186.667 135.085 183.085 138.667 178.667 138.667H152C147.582 138.667 144 135.085 144 130.667V104ZM178.667 148H152C149.791 148 148 149.791 148 152V178.667C148 180.876 149.791 182.667 152 182.667H178.667C180.876 182.667 182.667 180.876 182.667 178.667V152C182.667 149.791 180.876 148 178.667 148ZM152 144C147.582 144 144 147.582 144 152V178.667C144 183.085 147.582 186.667 152 186.667H178.667C183.085 186.667 186.667 183.085 186.667 178.667V152C186.667 147.582 183.085 144 178.667 144H152ZM8 28H34.6667C36.8758 28 38.6667 29.7909 38.6667 32V58.6667C38.6667 60.8758 36.8758 62.6667 34.6667 62.6667H8.00001C5.79086 62.6667 4 60.8758 4 58.6667V32C4 29.7909 5.79087 28 8 28ZM0 32C0 27.5817 3.58172 24 8 24H34.6667C39.0849 24 42.6667 27.5817 42.6667 32V58.6667C42.6667 63.0849 39.0849 66.6667 34.6667 66.6667H8.00001C3.58173 66.6667 0 63.0849 0 58.6667V32ZM104 28H130.667C132.876 28 134.667 29.7909 134.667 32V58.6667C134.667 60.8758 132.876 62.6667 130.667 62.6667H104C101.791 62.6667 100 60.8758 100 58.6667V32C100 29.7909 101.791 28 104 28ZM96 32C96 27.5817 99.5817 24 104 24H130.667C135.085 24 138.667 27.5817 138.667 32V58.6667C138.667 63.0849 135.085 66.6667 130.667 66.6667H104C99.5817 66.6667 96 63.0849 96 58.6667V32ZM226.667 28H200C197.791 28 196 29.7909 196 32V58.6667C196 60.8758 197.791 62.6667 200 62.6667H226.667C228.876 62.6667 230.667 60.8758 230.667 58.6667V32C230.667 29.7909 228.876 28 226.667 28ZM200 24C195.582 24 192 27.5817 192 32V58.6667C192 63.0849 195.582 66.6667 200 66.6667H226.667C231.085 66.6667 234.667 63.0849 234.667 58.6667V32C234.667 27.5817 231.085 24 226.667 24H200ZM104 76H130.667C132.876 76 134.667 77.7909 134.667 80V106.667C134.667 108.876 132.876 110.667 130.667 110.667H104C101.791 110.667 100 108.876 100 106.667V80C100 77.7909 101.791 76 104 76ZM96 80C96 75.5817 99.5817 72 104 72H130.667C135.085 72 138.667 75.5817 138.667 80V106.667C138.667 111.085 135.085 114.667 130.667 114.667H104C99.5817 114.667 96 111.085 96 106.667V80ZM130.667 124H104C101.791 124 100 125.791 100 128V154.667C100 156.876 101.791 158.667 104 158.667H130.667C132.876 158.667 134.667 156.876 134.667 154.667V128C134.667 125.791 132.876 124 130.667 124ZM104 120C99.5817 120 96 123.582 96 128V154.667C96 159.085 99.5817 162.667 104 162.667H130.667C135.085 162.667 138.667 159.085 138.667 154.667V128C138.667 123.582 135.085 120 130.667 120H104ZM200 76H226.667C228.876 76 230.667 77.7909 230.667 80V106.667C230.667 108.876 228.876 110.667 226.667 110.667H200C197.791 110.667 196 108.876 196 106.667V80C196 77.7909 197.791 76 200 76ZM192 80C192 75.5817 195.582 72 200 72H226.667C231.085 72 234.667 75.5817 234.667 80V106.667C234.667 111.085 231.085 114.667 226.667 114.667H200C195.582 114.667 192 111.085 192 106.667V80ZM226.667 124H200C197.791 124 196 125.791 196 128V154.667C196 156.876 197.791 158.667 200 158.667H226.667C228.876 158.667 230.667 156.876 230.667 154.667V128C230.667 125.791 228.876 124 226.667 124ZM200 120C195.582 120 192 123.582 192 128V154.667C192 159.085 195.582 162.667 200 162.667H226.667C231.085 162.667 234.667 159.085 234.667 154.667V128C234.667 123.582 231.085 120 226.667 120H200ZM8 76H34.6667C36.8758 76 38.6667 77.7909 38.6667 80V106.667C38.6667 108.876 36.8758 110.667 34.6667 110.667H8.00001C5.79086 110.667 4 108.876 4 106.667V80C4 77.7909 5.79087 76 8 76ZM0 80C0 75.5817 3.58172 72 8 72H34.6667C39.0849 72 42.6667 75.5817 42.6667 80V106.667C42.6667 111.085 39.0849 114.667 34.6667 114.667H8.00001C3.58173 114.667 0 111.085 0 106.667V80ZM34.6667 124H8C5.79087 124 4 125.791 4 128V154.667C4 156.876 5.79086 158.667 8.00001 158.667H34.6667C36.8758 158.667 38.6667 156.876 38.6667 154.667V128C38.6667 125.791 36.8758 124 34.6667 124ZM8 120C3.58172 120 0 123.582 0 128V154.667C0 159.085 3.58173 162.667 8.00001 162.667H34.6667C39.0849 162.667 42.6667 159.085 42.6667 154.667V128C42.6667 123.582 39.0849 120 34.6667 120H8Z"
fill="url(#paint0_radial_455_8492)"/>
<path d="M135.337 94.3762L146.519 105.618L142.825 109.333L131.645 98.0885C127.485 101.442 122.311 103.266 116.979 103.258C104.008 103.258 93.4807 92.6722 93.4807 79.629C93.4807 66.5858 104.008 56 116.979 56C129.95 56 140.478 66.5858 140.478 79.629C140.485 84.9902 138.671 90.1931 135.337 94.3762ZM130.099 92.4281C133.413 89.0016 135.263 84.4085 135.256 79.629C135.256 69.4738 127.076 61.2509 116.979 61.2509C106.88 61.2509 98.7026 69.4738 98.7026 79.629C98.7026 89.7816 106.88 98.0072 116.979 98.0072C121.732 98.0147 126.3 96.1539 129.708 92.8219L130.099 92.4281Z"
fill="#A0AEC0"/>
<defs>
<radialGradient id="paint0_radial_455_8492" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
gradientTransform="translate(113.939 81.3333) rotate(103.716) scale(58.3301 137.703)">
<stop offset="0.0806157" stop-color="#CBD5E0" stop-opacity="0"/>
<stop offset="0.562745" stop-color="#CBD5E0" stop-opacity="0.54"/>
<stop offset="1" stop-color="#CBD5E0" stop-opacity="0"/>
</radialGradient>
</defs>
</svg>
icons/empty_search_result.svg 0 → 100644
View file @ 09695c1d
<svg viewBox="0 0 240 192" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M82.667 4H56a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V8a4 4 0 0 0-4-4ZM56 0a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V8a8 8 0 0 0-8-8H56Zm122.667 4H152a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V8a4 4 0 0 0-4-4ZM152 0a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V8a8 8 0 0 0-8-8H152ZM56 52h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H56a4 4 0 0 1-4-4V56a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H56a8 8 0 0 1-8-8V56Zm34.667 44H56a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V104a4 4 0 0 0-4-4ZM56 96a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V104a8 8 0 0 0-8-8H56Zm0 52h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H56a4 4 0 0 1-4-4V152a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H56a8 8 0 0 1-8-8V152ZM178.667 52H152a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V56a4 4 0 0 0-4-4ZM152 48a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V56a8 8 0 0 0-8-8H152Zm0 52h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H152a4 4 0 0 1-4-4V104a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H152a8 8 0 0 1-8-8V104Zm34.667 44H152a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V152a4 4 0 0 0-4-4ZM152 144a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V152a8 8 0 0 0-8-8H152ZM8 28h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H8a8 8 0 0 1-8-8V32Zm104-4h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H104a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H104a8 8 0 0 1-8-8V32Zm130.667-4H200a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V32a4 4 0 0 0-4-4ZM200 24a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V32a8 8 0 0 0-8-8H200Zm-96 52h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H104a4 4 0 0 1-4-4V80a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H104a8 8 0 0 1-8-8V80Zm34.667 44H104a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V128a4 4 0 0 0-4-4ZM104 120a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V128a8 8 0 0 0-8-8H104Zm96-44h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H200a4 4 0 0 1-4-4V80a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H200a8 8 0 0 1-8-8V80Zm34.667 44H200a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V128a4 4 0 0 0-4-4ZM200 120a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V128a8 8 0 0 0-8-8H200ZM8 76h26.667a4 4 0 0 1 4 4v26.667a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V80a4 4 0 0 1 4-4Zm-8 4a8 8 0 0 1 8-8h26.667a8 8 0 0 1 8 8v26.667a8 8 0 0 1-8 8H8a8 8 0 0 1-8-8V80Zm34.667 44H8a4 4 0 0 0-4 4v26.667a4 4 0 0 0 4 4h26.667a4 4 0 0 0 4-4V128a4 4 0 0 0-4-4ZM8 120a8 8 0 0 0-8 8v26.667a8 8 0 0 0 8 8h26.667a8 8 0 0 0 8-8V128a8 8 0 0 0-8-8H8Z" fill="url(#empty_svg__a)"/>
<path d="m135.337 94.376 11.182 11.242-3.694 3.715-11.18-11.245a23.31 23.31 0 0 1-14.666 5.17c-12.971 0-23.498-10.586-23.498-23.629C93.48 66.586 104.008 56 116.979 56c12.971 0 23.499 10.586 23.499 23.629a23.614 23.614 0 0 1-5.141 14.747Zm-5.238-1.948a18.372 18.372 0 0 0 5.157-12.799c0-10.155-8.18-18.378-18.277-18.378-10.099 0-18.276 8.223-18.276 18.378 0 10.153 8.177 18.378 18.276 18.378a18.166 18.166 0 0 0 12.729-5.185l.391-.394Z" fill="#A0AEC0"/>
<defs>
<radialGradient id="empty_svg__a" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(103.716 25.035 85.404) scale(58.3301 137.703)">
<stop offset=".081" stop-color="#CBD5E0" stop-opacity="0"/>
<stop offset=".563" stop-color="#CBD5E0" stop-opacity=".54"/>
<stop offset="1" stop-color="#CBD5E0" stop-opacity="0"/>
</radialGradient>
</defs>
</svg>
lib/html-entities.ts
View file @ 09695c1d
...@@ -18,3 +18,4 @@ export const disk = String.fromCharCode(8226); // диск • ...@@ -18,3 +18,4 @@ export const disk = String.fromCharCode(8226); // диск •
export const minus = String.fromCharCode(8722); // минус − export const minus = String.fromCharCode(8722); // минус −
export const leftLineArrow = String.fromCharCode(8592); // стрелка ← export const leftLineArrow = String.fromCharCode(8592); // стрелка ←
export const rightLineArrow = String.fromCharCode(8594); // стрелка → export const rightLineArrow = String.fromCharCode(8594); // стрелка →
export const apos = String.fromCharCode(39); // апостроф '
package.json
View file @ 09695c1d
...@@ -28,7 +28,6 @@ ...@@ -28,7 +28,6 @@
"dayjs": "^1.11.5", "dayjs": "^1.11.5",
"framer-motion": "^6", "framer-motion": "^6",
"lodash": "^4.0.0", "lodash": "^4.0.0",
"lodash.debounce": "^4.0.8",
"next": "12.2.5", "next": "12.2.5",
"next-react-svg": "1.1.3", "next-react-svg": "1.1.3",
"node-fetch": "^3.2.9", "node-fetch": "^3.2.9",
...@@ -42,7 +41,6 @@ ...@@ -42,7 +41,6 @@
"use-font-face-observer": "^1.2.1" "use-font-face-observer": "^1.2.1"
}, },
"devDependencies": { "devDependencies": {
"@types/lodash.debounce": "^4.0.7",
"@types/node": "17.0.36", "@types/node": "17.0.36",
"@types/react": "18.0.9", "@types/react": "18.0.9",
"@types/react-dom": "18.0.5", "@types/react-dom": "18.0.5",
......
pages/[network_type]/[network_sub_type]/apps.tsx
View file @ 09695c1d
import Apps from '~/ui/pages/Apps';
import Page from '~/ui/shared/Page';
import PageHeader from '~/ui/shared/PageHeader';
import Head from 'next/head'; import Head from 'next/head';
import React from 'react'; import React from 'react';
import Apps from 'ui/pages/Apps';
import Page from 'ui/shared/Page';
import PageHeader from 'ui/shared/PageHeader';
const AppsPage = () => { const AppsPage = () => {
return ( return (
<Page> <Page>
......
ui/apps/AppCard.tsx
View file @ 09695c1d
import { Box, Image, Text, useColorModeValue } from '@chakra-ui/react'; import { Box, Heading, Image, Text, useColorModeValue } from '@chakra-ui/react';
import React from 'react'; import React from 'react';
import type { AppItemPreview } from '~/types/client/apps'; import type { AppItemPreview } from 'types/client/apps';
const AppCard = ({ title, logo, shortDescription, categories }: AppItemPreview) => { const AppCard = ({ title, logo, shortDescription, categories }: AppItemPreview) => {
const categoriesLabel = categories.map(c => c.name).join(', '); const categoriesLabel = categories.map(c => c.name).join(', ');
...@@ -25,14 +25,14 @@ const AppCard = ({ title, logo, shortDescription, categories }: AppItemPreview) ...@@ -25,14 +25,14 @@ const AppCard = ({ title, logo, shortDescription, categories }: AppItemPreview)
/> />
</Box> </Box>
<Text <Heading
as="h3" as="h3"
marginBottom={ 2 } marginBottom={ 2 }
fontSize={{ base: 'sm', sm: 'sm' }} fontSize={{ base: 'sm', sm: 'lg' }}
fontWeight="semibold" fontWeight="semibold"
> >
{ title } { title }
</Text> </Heading>
<Text <Text
marginBottom={ 2 } marginBottom={ 2 }
...@@ -45,14 +45,7 @@ const AppCard = ({ title, logo, shortDescription, categories }: AppItemPreview) ...@@ -45,14 +45,7 @@ const AppCard = ({ title, logo, shortDescription, categories }: AppItemPreview)
<Text <Text
fontSize={{ base: 'xs', sm: 'sm' }} fontSize={{ base: 'xs', sm: 'sm' }}
lineHeight="20px" lineHeight="20px"
style={{ noOfLines={ 4 }
display: '-webkit-box',
WebkitBoxOrient: 'vertical',
WebkitLineClamp: 4,
overflow: 'hidden',
textOverflow: 'ellipsis',
}}
overflow="hidden"
> >
{ shortDescription } { shortDescription }
</Text> </Text>
......
ui/apps/AppList.tsx
View file @ 09695c1d
import { Box, Text, Grid, GridItem, VisuallyHidden, Icon } from '@chakra-ui/react'; import { Grid, GridItem, VisuallyHidden, Heading } from '@chakra-ui/react';
import emptyIcon from '~/icons/empty.svg';
import AppCard from '~/ui/apps/AppCard';
import React from 'react'; import React from 'react';
import type { AppItemOverview } from '~/types/client/apps'; import type { AppItemOverview } from 'types/client/apps';
import AppCard from 'ui/apps/AppCard';
import EmptySearchResult from 'ui/apps/EmptySearchResult';
type Props = { type Props = {
apps: Array<AppItemOverview>; apps: Array<AppItemOverview>;
...@@ -13,7 +14,7 @@ const AppList = ({ apps }: Props) => { ...@@ -13,7 +14,7 @@ const AppList = ({ apps }: Props) => {
return ( return (
<> <>
<VisuallyHidden> <VisuallyHidden>
<Text as="h2">App list</Text> <Heading as="h2">App list</Heading>
</VisuallyHidden> </VisuallyHidden>
{ apps.length > 0 ? ( { apps.length > 0 ? (
...@@ -41,34 +42,7 @@ const AppList = ({ apps }: Props) => { ...@@ -41,34 +42,7 @@ const AppList = ({ apps }: Props) => {
)) } )) }
</Grid> </Grid>
) : ( ) : (
<Box <EmptySearchResult/>
display="flex"
flexDirection="column"
alignItems="center"
>
<Icon
as={ emptyIcon }
boxSize={ 60 }
display="block"
/>
<Text
as="h3"
marginBottom={ 2 }
fontSize={{ base: '2xl', sm: '3xl' }}
fontWeight="semibold"
>
No results
</Text>
<Text
fontSize={{ base: 'sm' }}
variant="secondary"
align="center"
>
Couldn&apos;t find an app that matches your filter query.
</Text>
</Box>
) } ) }
</> </>
); );
......
ui/apps/EmptySearchResult.tsx 0 → 100644
View file @ 09695c1d
import { Box, Heading, Icon, Text } from '@chakra-ui/react';
import React from 'react';
import emptyIcon from 'icons/empty_search_result.svg';
import { apos } from 'lib/html-entities';
const EmptySearchResult = () => {
return (
<Box
display="flex"
flexDirection="column"
alignItems="center"
>
<Icon
as={ emptyIcon }
boxSize={ 60 }
display="block"
/>
<Heading
as="h3"
marginBottom={ 2 }
fontSize={{ base: '2xl', sm: '3xl' }}
fontWeight="semibold"
>
No results
</Heading>
<Text
fontSize={{ base: 'sm' }}
variant="secondary"
align="center"
>
Couldn{ apos }t find an app that matches your filter query.
</Text>
</Box>
);
};
export default EmptySearchResult;
ui/apps/FilterInput.tsx
View file @ 09695c1d
import { SearchIcon } from '@chakra-ui/icons'; import { SearchIcon } from '@chakra-ui/icons';
import { Input, InputGroup, InputLeftElement } from '@chakra-ui/react'; import { Input, InputGroup, InputLeftElement, useColorModeValue } from '@chakra-ui/react';
import type { ChangeEvent } from 'react'; import type { ChangeEvent } from 'react';
import React, { useCallback, useState } from 'react'; import React, { useCallback, useState } from 'react';
...@@ -24,7 +24,7 @@ const FilterInput = ({ onChange }: Props) => { ...@@ -24,7 +24,7 @@ const FilterInput = ({ onChange }: Props) => {
<InputLeftElement <InputLeftElement
pointerEvents="none" pointerEvents="none"
> >
<SearchIcon color="gray.300"/> <SearchIcon color={ useColorModeValue('blackAlpha.600', 'whiteAlpha.600') }/>
</InputLeftElement> </InputLeftElement>
<Input <Input
......
ui/apps/constants.ts 0 → 100644
View file @ 09695c1d
import type { AppCategory } from 'types/client/apps';
export const APP_CATEGORIES: Array<AppCategory> = [
{
id: 'defi',
name: 'DeFi',
},
{
id: 'exchanges',
name: 'Exchanges',
},
{
id: 'finance',
name: 'Finance',
},
{
id: 'games',
name: 'Games',
},
{
id: 'marketplaces',
name: 'Marketplaces',
},
{
id: 'nft',
name: 'NFT',
},
{
id: 'security',
name: 'Security',
},
{
id: 'social',
name: 'Social',
},
{
id: 'tools',
name: 'Tools',
},
{
id: 'Yield-farming',
name: 'yield-farming',
},
];
ui/pages/Apps.tsx
View file @ 09695c1d
import AppList from '~/ui/apps/AppList'; import debounce from 'lodash/debounce';
import { TEMPORARY_DEMO_APPS } from '~/ui/apps/contants';
import FilterInput from '~/ui/apps/FilterInput';
import debounce from 'lodash.debounce';
import React, { useCallback, useState } from 'react'; import React, { useCallback, useState } from 'react';
import { TEMPORARY_DEMO_APPS } from 'data/apps';
import AppList from 'ui/apps/AppList';
import FilterInput from 'ui/apps/FilterInput';
const defaultDisplayedApps = [ ...TEMPORARY_DEMO_APPS ] const defaultDisplayedApps = [ ...TEMPORARY_DEMO_APPS ]
.sort((a, b) => a.title.localeCompare(b.title)); .sort((a, b) => a.title.localeCompare(b.title));
......
yarn.lock
View file @ 09695c1d
...@@ -1679,13 +1679,6 @@ ...@@ -1679,13 +1679,6 @@
resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee" resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ== integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
"@types/lodash.debounce@^4.0.7":
version "4.0.7"
resolved "https://registry.yarnpkg.com/@types/lodash.debounce/-/lodash.debounce-4.0.7.tgz#0285879defb7cdb156ae633cecd62d5680eded9f"
integrity sha512-X1T4wMZ+gT000M2/91SYj0d/7JfeNZ9PeeOldSNoE/lunLeQXKvkmIumI29IaKMotU/ln/McOIvgzZcQ/3TrSA==
dependencies:
"@types/lodash" "*"
"@types/lodash.mergewith@4.6.6": "@types/lodash.mergewith@4.6.6":
version "4.6.6" version "4.6.6"
resolved "https://registry.yarnpkg.com/@types/lodash.mergewith/-/lodash.mergewith-4.6.6.tgz#c4698f5b214a433ff35cb2c75ee6ec7f99d79f10" resolved "https://registry.yarnpkg.com/@types/lodash.mergewith/-/lodash.mergewith-4.6.6.tgz#c4698f5b214a433ff35cb2c75ee6ec7f99d79f10"
...@@ -3977,11 +3970,6 @@ locate-path@^3.0.0: ...@@ -3977,11 +3970,6 @@ locate-path@^3.0.0:
p-locate "^3.0.0" p-locate "^3.0.0"
path-exists "^3.0.0" path-exists "^3.0.0"
lodash.debounce@^4.0.8:
version "4.0.8"
resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==
lodash.merge@^4.6.2: lodash.merge@^4.6.2:
version "4.6.2" version "4.6.2"
resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a" resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment