e2e tests

.github/dependabot.yml

@@ -0,0 +1,15 @@
+version: 2
+
+updates:
+  - package-ecosystem: 'npm'
+    directory: '/'
+    schedule:
+      interval: 'weekly'
+    labels:
+      - 'dependencies'
+  - package-ecosystem: 'github-actions'
+    directory: '/'
+    schedule:
+      interval: 'weekly'
+    labels:
+      - 'dependencies'

.github/workflows/ci.yml

@@ -0,0 +1,41 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+
+permissions:
+  actions: read
+  contents: read
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  main:
+    runs-on: ubuntu-latest
+    env:
+      NEXT_PUBLIC_TURNSTILE_SITEKEY: 'e2e-sitekey'
+      GIT_COMMIT_SHA: ${{ github.sha }}
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: .nvmrc
+          cache: 'pnpm'
+      - name: Setup dependencies
+        run: pnpm install --frozen-lockfile
+      # Install Cypress dependencies
+      - run: pnpm cypress install --force
+      - uses: nrwl/nx-set-shas@v4
+      - run: pnpm exec nx affected --parallel 3 --target lint test build
+      - run: pnpm exec nx affected --parallel 1 --target e2e-ci

.github/workflows/codeql.yml

@@ -0,0 +1,38 @@
+name: 'CodeQL'
+
+on:
+  push:
+    branches:
+      - dev
+      - prod
+  pull_request:
+    branches:
+      - dev
+  schedule:
+    - cron: '0 8 * * 1'
+  merge_group:
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-cpu16-ram64
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+    strategy:
+      fail-fast: false
+      matrix:
+        language: ['javascript']
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v2
+        with:
+          queries: security-and-quality
+          languages: ${{ matrix.language }}
+      - name: Autobuild
+        uses: github/codeql-action/autobuild@v2
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v2

.prettierignore

@@ -5,4 +5,5 @@
 .yarnrc.yml
 .next
 /.nx/cache
-/.nx/workspace-data
+/.nx/workspace-data
+pnpm-lock.yaml

e2e/cypress.config.ts

@@ -1,13 +1,12 @@
 import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
-
 import { defineConfig } from 'cypress';
 
 export default defineConfig({
   e2e: {
     ...nxE2EPreset(__filename, {
       cypressDir: 'src',
       webServerCommands: { default: 'nx run islamic-website:start' },
-      ciWebServerCommand: 'nx run islamic-website:serve-static',
+      ciWebServerCommand: 'nx run islamic-website:start',
     }),
     baseUrl: 'http://localhost:3000',
   },

e2e/src/e2e/main-page.cy.ts

@@ -0,0 +1,65 @@
+describe('main-page', () => {
+  beforeEach(() => {
+    return cy.visit('/');
+  });
+
+  it('should have correct title', () => {
+    cy.title().should('include', 'IslamicCoin');
+  });
+
+  it('should display main heading', () => {
+    cy.get('h1')
+      .contains('Your Gateway to Shariah Compliant Web3')
+      .should('be.visible');
+  });
+
+  it('should have a visible "Why Islamic Coin?" section', () => {
+    cy.get('h2').contains('Why Islamic Coin?').should('be.visible');
+  });
+
+  it('should display "Backed by" section with logos', () => {
+    cy.get('h2').contains('Backed by').should('be.visible');
+    cy.get('img[alt*="logo"]').should('have.length.at.least', 3);
+  });
+
+  it('should display "Pioneering the Future of Islamic Finance" section', () => {
+    cy.get('h2')
+      .contains('Pioneering the Future of Islamic Finance')
+      .should('be.visible');
+  });
+
+  it('should show "Latest Islamic Coin News" section', () => {
+    cy.get('h2').contains('Latest Islamic Coin News').should('be.visible');
+    cy.get('[data-attr="news-card"]').should('have.length.at.least', 3);
+  });
+
+  it('should display Advisory Board members', () => {
+    cy.get('h2').contains('Advisory Board').should('be.visible');
+    cy.get('[data-attr="board-member-card"]').should('have.length.at.least', 4);
+  });
+
+  it('should have HAQQ Wallet section with app store links', () => {
+    cy.get('h2')
+      .contains('Manage Your Shariah Portfolio with HAQQ Wallet')
+      .should('be.visible');
+    cy.get('a[data-attr*="download"]').should('be.visible');
+  });
+
+  it('should have "Learn and Grow" section', () => {
+    cy.get('h2')
+      .contains('Learn and Grow with Islamic Coin')
+      .should('be.visible');
+  });
+
+  it('should have "Join Our Community" section', () => {
+    cy.get('h2').contains('Join Our Community').scrollIntoView();
+    cy.get('h2').contains('Join Our Community').should('be.visible');
+  });
+
+  it('should have footer with social media links in footer', () => {
+    cy.get('footer').scrollIntoView();
+    cy.get('footer a[data-attr*="community"]')
+      .should('be.visible')
+      .should('have.length.at.least', 3);
+  });
+});

e2e/src/support/app.po.ts

@@ -1 +1,3 @@
-export const getGreeting = () => cy.get('h1');
+export const getGreeting = () => {
+  return cy.get('h1');
+};

e2e/tsconfig.json

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "allowJs": true,
     "outDir": "../dist/out-tsc",
-    "module": "commonjs",
+    "module": "es2020",
     "types": ["cypress", "node"],
     "sourceMap": false
   },

index.d.ts

@@ -4,5 +4,3 @@ declare module '*.svg' {
   export const ReactComponent: any;
   export default content;
 }
-
-declare module 'app-store-scraper';

package.json

@@ -104,5 +104,5 @@
   "nx": {
     "includedScripts": []
   },
-  "packageManager": "pnpm@9.3.0"
+  "packageManager": "pnpm@9.4.0+sha512.f549b8a52c9d2b8536762f99c0722205efc5af913e77835dbccc3b0b0b2ca9e7dc8022b78062c17291c48e88749c70ce88eb5a74f1fa8c4bf5e18bb46c8bd83a"
 }

src/app/sitemap.ts

@@ -1,6 +1,5 @@
 import { MetadataRoute } from 'next';
-import { SITE_URL } from '@/constants';
-import { SUPPORTED_LOCALES } from '@/constants';
+import { SITE_URL, SUPPORTED_LOCALES } from '@/constants';
 import { academyModules } from '@/lib/academy-modules';
 
 export interface SitemapUrl {

src/components/pages/main-page/join-community-block.tsx

@@ -16,9 +16,9 @@ export function JoinCommunityBlock() {
           <div className="pointer-events-none h-[120px] w-[304px] select-none md:h-[140px] md:w-[354px]">
             <Image src={cubesImgData} alt="" loading="lazy" />
           </div>
-          <span className="mt-[16px] text-[28px] font-[600] leading-[32px] md:text-[44px] md:leading-[48px]">
+          <h2 className="mt-[16px] text-[28px] font-[600] leading-[32px] md:text-[44px] md:leading-[48px]">
             {t('join-community-block.title')}
-          </span>
+          </h2>
           <Text isMono className="mt-[8px]">
             {t('join-community-block.subtitle')}
           </Text>

src/components/pages/main-page/main-page.tsx

@@ -1,6 +1,6 @@
 import { Fragment } from 'react';
 import clsx from 'clsx';
-import dynamic from 'next/dynamic';
+// import dynamic from 'next/dynamic';
 import { useTranslations } from 'next-intl';
 import { Container } from '@/components/ui/container';
 import { Marquee } from '@/components/ui/marquee';
@@ -16,13 +16,13 @@ import { LearnAndGrowBlock } from './learn-and-grow-block';
 import { NewsBlock } from './news-block';
 import { WhyBlock } from './why-block';
 
-const WalletBlock = dynamic(
-  async () => {
-    const { WalletBlock } = await import('./wallet-block');
-    return { default: WalletBlock };
-  },
-  // { ssr: false },
-);
+// const WalletBlock = dynamic(
+//   async () => {
+//     const { WalletBlock } = await import('./wallet-block');
+//     return { default: WalletBlock };
+//   },
+//   // { ssr: false },
+// );
 
 export function MainPage({
   news,
@@ -42,7 +42,6 @@ export function MainPage({
     googlePlay: number;
   };
 }) {
-  console.log({ storeRatings });
   return (
     <Fragment>
       <Hero stats={stats} />
@@ -54,7 +53,7 @@ export function MainPage({
         shariahMembers={shariahMembers}
         advisoryMembers={advisoryMembers}
       />
-      <WalletBlock storeRatings={storeRatings} />
+      {/* <WalletBlock storeRatings={storeRatings} /> */}
       <LearnAndGrowBlock />
       <JoinCommunityBlock />
     </Fragment>

src/components/pages/main-page/wallet-block.tsx

@@ -104,6 +104,7 @@ export function WalletBlock({
                     <RatingBadge rating={storeRatings.googlePlay} />
                   </div>
                 </div>
+
                 <div className="hidden lg:mt-[24px] lg:flex lg:flex-row lg:gap-x-[16px]">
                   <div className="w-fit">
                     <Link
@@ -138,6 +139,7 @@ export function WalletBlock({
                     </Link>
                   </div>
                 </div>
+
                 <div className="mt-[20px] flex flex-col gap-y-[20px] lg:hidden">
                   <div>
                     <Link