Test GitHub Action

.editorconfig

@@ -0,0 +1,12 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.{js,json,ts,tsx,html,svg,css}]
+indent_size = 2
+indent_style = space
+max_line_length = 80

.eslintrc.json

@@ -1,6 +1,3 @@
 {
-  "extends": "next/core-web-vitals",
-  "rules": {
-    "indent": ["error", 2]
-  }
-}
+  "extends": "next/core-web-vitals"
+}

.github/workflows/publish.yml

@@ -3,6 +3,7 @@ on:
   push:
     branches:
       - main
+      - release/0.2.x
 
 permissions:
   contents: read
@@ -48,4 +49,4 @@ jobs:
     steps:
       - name: Publish to GitHub Pages 🚀
         id: deployment
-        uses: actions/deploy-pages@v4
+        uses: actions/deploy-pages@v4

.github/workflows/setup-node/action.yml

@@ -6,7 +6,7 @@ runs:
     - name: Setup Node.js ⚙️
       uses: actions/setup-node@v4
       with:
-        node-version: 20
+        node-version-file: ".nvmrc"
 
     - name: Cache dependencies ⚡
       id: cache_dependencies
@@ -18,4 +18,4 @@ runs:
     - name: Install dependencies 🔧
       shell: bash
       if: steps.cache_dependencies.outputs.cache-hit != 'true'
-      run: npm ci
+      run: npm ci

.github/workflows/test.yml

@@ -0,0 +1,16 @@
+name: test
+on: push
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js ⚙️ - Cache dependencies ⚡ - Install dependencies 🔧
+        uses: ./.github/workflows/setup-node
+
+      - name: Test 🧪
+        run: npm run test-coverage

.gitignore

@@ -1,31 +1,21 @@
-# Firebase
-.firebase
-.firebaserc
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
-# Bun
-bun.lockb
-
-# IDE files
-/.vscode/*
-/.idea/*
-
-# Dependencies
+# dependencies
 /node_modules
 /.pnp
 .pnp.js
-.yarn/install-state.gz
 
-# Testing
+# testing
 /coverage
 
-# Next.js
+# next.js
 /.next/
 /out/
 
-# Production
+# production
 /build
 
-# Misc
+# misc
 .DS_Store
 *.pem
 
@@ -34,115 +24,12 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-# Local env files
-.env
-.env.local
+# local env files
+.env*.local
 
-# Vercel
+# vercel
 .vercel
 
-# TypeScript
+# typescript
 *.tsbuildinfo
 next-env.d.ts
-
-# Logs
-logs
-*.log
-
-# Diagnostic reports
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
-
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Instrumented libs
-lib-cov
-
-# Coverage data
-coverage
-*.lcov
-
-# nyc test coverage
-.nyc_output
-
-# Grunt cache
-.grunt
-
-# Bower components
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons
-build/Release
-
-# Snowpack dependency directory
-web_modules/
-
-# Optional npm cache
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Optional stylelint cache
-.stylelintcache
-
-# Microbundle cache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-.node_repl_history
-
-# Output of `npm pack`
-*.tgz
-
-# Yarn integrity file
-.yarn-integrity
-
-# dotenv environment files
-.env
-.env.development.local
-.env.test.local
-.env.production.local
-
-# parcel-bundler cache
-.cache
-.parcel-cache
-
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# TernJS port file
-.tern-port
-
-# Stores VSCode versions used for testing VSCode extensions
-.vscode-test
-
-# yarn v2
-.yarn/cache
-.yarn/unplugged
-.yarn/build-state.yml
-
-# Optional lerna debug log
-lerna-debug.log*
-
-# Optional pnpm debug log
-.pnpm-debug.log*
-
-# Misc
-.DS_Store
-DS_Store

.nvmrc

@@ -0,0 +1 @@
+20.10.0

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "tabWidth": 2
+}

README.md

@@ -1,35 +1,41 @@
-# VerifEye
-A verifiability tool for social media platforms that serves short-form video content.
-
-## Prerequisites
-The following are the frameworks and tools that you must be familiar with to be able to contribute to this project:
-1. [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference) and [TypeScript](https://www.typescriptlang.org/docs/handbook/intro.html)
-2. [Node.js](https://nodejs.org/en/download/) or [Bun](https://bun.sh/) (we personally prefer Bun)
-3. [Git](https://git-scm.com/downloads)
-4. [React](https://react.dev/learn)
-5. [Next.js](https://nextjs.org/learn)
-6. [Tailwind CSS](https://tailwindcss.com/docs)
-7. [Vercel](https://vercel.com/docs)
-8. [Supabase](https://github.com/supabase/supabase)
-
-## Running Locally
-1. Run the following in your terminal starting with cloning the repository:
-```bash
-git clone https://github.com/dlsucomet/verifeye.git
-```
-2. Install dependencies:
-```bash
-npm install    # or bun install
-```
-3. Create a `.env.local` file with the contents of `.env.template` and fill in the keys.
-
-> [!IMPORTANT]
-> The project will not run properly without the environment variables. Seek assistance from the project owner if you don't have the necessary values for the variables.
-
-4. Run the development server:
-```bash
-npm run dev    # or bun dev
-```
-
-## Deployment
-As of this moment, we are still deciding which platform to use for deployment. Regardless, we will create a pipeline that would automatically deploy the application to the chosen platform whenever a new commit is pushed to the main branch.
+# 2048-in-react
+
+[![Open issues][issues-badge]][issues-url]
+[![CI][lint-badge]][lint-url]
+[![CI][test-badge]][test-url]
+[![TypeScript][typescript-badge]][typescript-url]
+
+[![](.docs/demo.gif)](https://mateuszsokola.github.io/2048-in-react/)
+
+## [Play 2048 💥](https://mateuszsokola.github.io/2048-in-react/)
+
+## Features
+
+- Fully-functional 2048 clone
+- Animations
+- Supports **keyboard**, **mouse** and **touch** events
+
+## Development
+
+_Easily set up a local development environment!_
+
+Just start dev server on [localhost](http://localhost:3000):
+
+- clone
+- `npm install`
+- `npm run dev`
+
+**Start coding!** 🎉
+
+## Build your own 2048 Game! 🚀
+
+[![Build 2048 Game in React](https://assets.mateu.sh/assets/github-2048-in-react-readme)](https://assets.mateu.sh/r/github-2048-in-react-readme)
+
+[lint-badge]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/lint.yml/badge.svg
+[lint-url]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/actions/workflows/lint.yml
+[test-badge]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/test.yml/badge.svg
+[test-url]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/test.yml
+[issues-badge]: https://img.shields.io/github/issues/mateuszsokola/2048-in-react
+[issues-url]: https://github.com/mateuszsokola/2048-in-react/issues
+[typescript-badge]: https://badges.frapsoft.com/typescript/code/typescript.svg?v=101
+[typescript-url]: https://github.com/microsoft/TypeScript

__tests__/compontents/board.test.tsx

@@ -0,0 +1,27 @@
+import { render } from "@testing-library/react";
+import Board from "@/components/board";
+import GameProvider from "@/context/game-context";
+
+describe("Board", () => {
+  it("should render board with 16 cells", () => {
+    const { container } = render(
+      <GameProvider>
+        <Board />
+      </GameProvider>,
+    );
+    const cellElements = container.querySelectorAll(".cell");
+
+    expect(cellElements.length).toEqual(16);
+  });
+
+  it("should render board with 2 tiles", async () => {
+    const { container } = render(
+      <GameProvider>
+        <Board />
+      </GameProvider>,
+    );
+    const tiles = container.querySelectorAll(".tile");
+
+    expect(tiles.length).toEqual(2);
+  });
+});

__tests__/compontents/mobile-swiper.test.tsx

@@ -0,0 +1,49 @@
+import React from "react";
+import { render, fireEvent } from "@testing-library/react";
+import MobileSwiper, { SwipeInput } from "@/components/mobile-swiper";
+
+describe("MobileSwiper", () => {
+  it("should trigger onSwipe with correct input on touch end", () => {
+    const onSwipeMock = jest.fn();
+    const { container } = render(
+      <MobileSwiper onSwipe={onSwipeMock}>
+        <div data-testid="swipe-target">Swipe me!</div>
+      </MobileSwiper>,
+    );
+
+    const swipeTarget = container.querySelector(
+      "[data-testid='swipe-target']",
+    ) as HTMLElement;
+
+    fireEvent.touchStart(swipeTarget, {
+      touches: [{ clientX: 0, clientY: 0 }],
+    });
+    fireEvent.touchEnd(swipeTarget, {
+      changedTouches: [{ clientX: 50, clientY: 0 }],
+    });
+
+    expect(onSwipeMock).toHaveBeenCalledWith({ deltaX: 50, deltaY: 0 });
+  });
+
+  it("should not trigger onSwipe if touch is outside the component", () => {
+    const onSwipeMock = jest.fn();
+    const { container } = render(
+      <MobileSwiper onSwipe={onSwipeMock}>
+        <div data-testid="swipe-target">Swipe me!</div>
+      </MobileSwiper>,
+    );
+
+    const swipeTarget = container.querySelector(
+      "[data-testid='swipe-target']",
+    ) as HTMLElement;
+
+    fireEvent.touchStart(swipeTarget, {
+      touches: [{ clientX: 0, clientY: 0 }],
+    });
+    fireEvent.touchEnd(document.body, {
+      changedTouches: [{ clientX: 50, clientY: 0 }],
+    });
+
+    expect(onSwipeMock).not.toHaveBeenCalled();
+  });
+});