Merge pull request 'feature/prettier' (#4) from feature/prettier into develop

Reviewed-on: witel-flix/frontend#4
This commit is contained in:
2026-04-15 08:20:44 +00:00
22 changed files with 410 additions and 270 deletions

14
.prettierrc Normal file
View File

@@ -0,0 +1,14 @@
{
"plugins": ["prettier-plugin-tailwindcss"],
"printWidth": 120,
"tabWidth": 4,
"useTabs": false,
"semi": true,
"singleQuote": false,
"trailingComma": "es5",
"bracketSpacing": true,
"jsxBracketSameLine": false,
"arrowParens": "always",
"endOfLine": "crlf"
}

View File

@@ -0,0 +1 @@
Hello from docker ReadMe

View File

@@ -1,16 +1,16 @@
services:
witelflix-front:
image: witelflix:${VERSION}
container_name: witelflix
# build: #just if we have internet uncomment
# context: .
# dockerfile: Dockerfile
ports:
- "3000:3000"
env_file:
- .env
restart: unless-stopped
# volumes:
# - .:/app # کل پروژه mount شده به /app در کانتینر
# - /app/node_modules # node_modules داخل کانتینر بماند تا با host override نشود
# - /app/.next # next داخل کانتینر بماند تا با host override نشود
services:
witelflix-front:
image: witelflix:${VERSION}
container_name: witelflix
# build: #just if we have internet uncomment
# context: .
# dockerfile: Dockerfile
ports:
- "3000:3000"
env_file:
- .env
restart: unless-stopped
# volumes:
# - .:/app # کل پروژه mount شده به /app در کانتینر
# - /app/node_modules # node_modules داخل کانتینر بماند تا با host override نشود
# - /app/.next # next داخل کانتینر بماند تا با host override نشود

4
messages/fa.json Normal file
View File

@@ -0,0 +1,4 @@
{
"loading": "درحال دریافت داده",
"error_fetch_data": "مشکلی در دریافت داده رخ داده است."
}

2
next-env.d.ts vendored
View File

@@ -1,6 +1,6 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
import "./.next/dev/types/routes.d.ts";
import "./.next/types/routes.d.ts";
// NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

25
next.config.ts Normal file
View File

@@ -0,0 +1,25 @@
// next.config.ts
import type { NextConfig } from "next";
import createNextIntlPlugin from "next-intl/plugin";
// @ts-ignore no types for next-pwa
const withPWA = require("next-pwa")({
dest: "public",
disable: process.env.NODE_ENV === "development",
register: true,
skipWaiting: true,
navigateFallback: "/offline.html", // fallback page
});
const withNextIntl = createNextIntlPlugin();
const nextConfig: NextConfig = {
// output : "standalone",
images: {
remotePatterns: [],
},
};
const configWithIntl = withNextIntl(nextConfig);
export default withPWA(configWithIntl);

View File

@@ -1,47 +1,48 @@
{
"name": "witelflix",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
},
"dependencies": {
"@types/js-cookie": "^3.0.6",
"axios": "^1.15.0",
"clsx": "^2.1.1",
"date-fns": "^4.1.0",
"date-fns-jalali": "4.1.0-0",
"embla-carousel": "^8.6.0",
"embla-carousel-autoplay": "^8.6.0",
"embla-carousel-react": "^8.6.0",
"framer-motion": "^12.38.0",
"js-cookie": "^3.0.5",
"lucide-react": "^1.8.0",
"next": "16.1.6",
"next-intl": "^4.9.1",
"next-pwa": "^5.6.0",
"next-sitemap": "^4.2.3",
"next-themes": "^0.4.6",
"nextjs-toploader": "^3.9.17",
"prettier": "^3.8.2",
"prettier-plugin-tailwindcss": "^0.7.2",
"radix-ui": "^1.4.3",
"react": "19.2.4",
"react-dom": "19.2.4",
"react-hook-form": "^7.72.1",
"react-hot-toast": "^2.6.0",
"tailwind-merge": "^3.5.0",
"tailwind-scrollbar": "^4.0.2",
"zustand": "^5.0.12"
},
"devDependencies": {
"@tailwindcss/postcss": "^4.1.18",
"@types/node": "25.0.10",
"@types/react": "19.2.10",
"@types/react-dom": "19.2.3",
"postcss": "8.5.6",
"tailwindcss": "4.1.18",
"typescript": "5.9.3"
}
}
{
"name": "witelflix",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"format": "npx prettier . --write"
},
"dependencies": {
"@types/js-cookie": "^3.0.6",
"axios": "^1.15.0",
"clsx": "^2.1.1",
"date-fns": "^4.1.0",
"date-fns-jalali": "4.1.0-0",
"embla-carousel": "^8.6.0",
"embla-carousel-autoplay": "^8.6.0",
"embla-carousel-react": "^8.6.0",
"framer-motion": "^12.38.0",
"js-cookie": "^3.0.5",
"lucide-react": "^1.8.0",
"next": "16.1.6",
"next-intl": "^4.9.1",
"next-pwa": "^5.6.0",
"next-sitemap": "^4.2.3",
"next-themes": "^0.4.6",
"nextjs-toploader": "^3.9.17",
"prettier": "^3.8.2",
"prettier-plugin-tailwindcss": "^0.7.2",
"radix-ui": "^1.4.3",
"react": "19.2.4",
"react-dom": "19.2.4",
"react-hook-form": "^7.72.1",
"react-hot-toast": "^2.6.0",
"tailwind-merge": "^3.5.0",
"tailwind-scrollbar": "^4.0.2",
"zustand": "^5.0.12"
},
"devDependencies": {
"@tailwindcss/postcss": "^4.1.18",
"@types/node": "25.0.10",
"@types/react": "19.2.10",
"@types/react-dom": "19.2.3",
"postcss": "8.5.6",
"tailwindcss": "4.1.18",
"typescript": "5.9.3"
}
}

View File

@@ -1,6 +1,5 @@
export default {
plugins: {
"@tailwindcss/postcss": {},
},
};
export default {
plugins: {
"@tailwindcss/postcss": {},
},
};

BIN
public/logo/144px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

BIN
public/logo/152px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
public/logo/192px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

BIN
public/logo/384px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
public/logo/512px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

38
public/manifest.json Normal file
View File

@@ -0,0 +1,38 @@
{
"id": "/",
"name": "Theater of dreams",
"short_name": "Theater of dreams",
"description": "Theater of dreams",
"start_url": "/",
"display": "standalone",
"orientation": "portrait",
"theme_color": "#283618",
"background_color": "#ffffff",
"icons": [
{
"src": "logo/144px.png",
"sizes": "144x144",
"type": "image/png"
},
{
"src": "logo/152px.png",
"sizes": "152x152",
"type": "image/png"
},
{
"src": "logo/192px.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "logo/384px.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "logo/512px.png",
"sizes": "512x512",
"type": "image/png"
}
]
}

View File

@@ -1,38 +1,59 @@
import { ClientAppProvider } from '@/providers/ClientAppProvider'
import '@/styles/globals.css'
import type { Metadata } from 'next'
export const metadata: Metadata = {
title: 'Theater of dreams',
}
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<html lang='en' suppressHydrationWarning>
<head>
{/* Prevent theme flicker before hydration */}
<script
dangerouslySetInnerHTML={{
__html: `
(function() {
try {
const stored = localStorage.getItem('theme');
const theme = stored || 'dark';
document.documentElement.setAttribute('data-theme', theme);
} catch (e) {}
})();
`,
}}
/>
</head>
<body className='bg-primary'>
<ClientAppProvider>{children}</ClientAppProvider>
</body>
</html>
)
}
import { ClientAppProvider } from "@/providers/ClientAppProvider";
import "@/styles/globals.css";
import type { Metadata } from "next";
import { getLocale, getMessages } from "next-intl/server";
import { NextIntlClientProvider } from "next-intl";
export const metadata: Metadata = {
title: {
template: "%s | Theater of dreams",
default: "Theater of dreams",
},
description: "Theater of dreams",
authors: {
name: "شرکت دانش بنیان ویرا ارتباطات یکتا تلفن (وایتل)",
url: "https://witel.ir",
},
manifest: "/manifest.json",
icons: {
icon: "/logo/192px.png",
apple: "/logo/512px.png",
},
};
export const viewport = {
width: "device-width",
initialScale: 1,
maximumScale: 1,
};
export default async function RootLayout({ children }: { children: React.ReactNode }) {
const locale = await getLocale();
const messages = await getMessages({ locale });
return (
<html lang="en" suppressHydrationWarning>
<head>
{/* Prevent theme flicker before hydration */}
<script
dangerouslySetInnerHTML={{
__html: `
(function() {
try {
const stored = localStorage.getItem('theme');
const theme = stored || 'dark';
document.documentElement.setAttribute('data-theme', theme);
} catch (e) {}
})();
`,
}}
/>
</head>
<body className="bg-primary">
<NextIntlClientProvider locale={locale} messages={messages}>
<ClientAppProvider>{children}</ClientAppProvider>
</NextIntlClientProvider>
</body>
</html>
);
}

39
src/app/not-found.tsx Normal file
View File

@@ -0,0 +1,39 @@
import Link from "next/link";
export default function NotFound() {
return (
<div className="bg-pwa-primary text-text flex min-h-screen items-center justify-center">
<div className="bg-pwa-primary mx-4 w-full max-w-md rounded-xl p-8 text-center">
{/* آیکون خطا */}
{/*<div className="mb-4 flex justify-center">*/}
{/* <svg*/}
{/* xmlns="http://www.w3.org/2000/svg"*/}
{/* className="h-16 w-16 text-core-red"*/}
{/* fill="none"*/}
{/* viewBox="0 0 24 24"*/}
{/* stroke="currentColor"*/}
{/* >*/}
{/* <path*/}
{/* strokeLinecap="round"*/}
{/* strokeLinejoin="round"*/}
{/* strokeWidth={2}*/}
{/* d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"*/}
{/* />*/}
{/* </svg>*/}
{/*</div>*/}
{/* متن خطا */}
<h2 className="text-text mb-2 text-2xl font-bold">صفحه مورد نظر یافت نشد</h2>
<p className="text-text mb-6 leading-relaxed">متاسفانه صفحهای مورد نظر وجود ندارد.</p>
{/* دکمه بازگشت با استفاده از کامپوننت Link */}
<Link
href="/"
className="bg-neo-aqua hover:bg-neo-aqua/70 inline-block rounded-lg px-6 py-3 font-medium text-white shadow-md transition-colors duration-200 hover:shadow-lg"
>
بازگشت به صفحه اصلی
</Link>
</div>
</div>
);
}

View File

@@ -1,11 +1,11 @@
import ThemeToggle from '@/components/UI/ThemeToggle'
export default function Home() {
return (
<main>
<ThemeToggle />
<h1>Offline Next.js Template 🚀</h1>
<p>This project was generated completely offline.</p>
</main>
)
}
import ThemeToggle from "@/components/UI/ThemeToggle";
export default function Home() {
return (
<main>
<ThemeToggle />
<h1>Offline Next.js Template 🚀</h1>
<p>This project was generated completely offline.</p>
</main>
);
}

View File

@@ -1,30 +1,26 @@
'use client'
import { motion } from 'framer-motion'
import { Moon, Sun } from 'lucide-react'
import { useTheme } from 'next-themes'
export default function ThemeToggle() {
const { theme, setTheme } = useTheme()
return (
<button
onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
className='flex cursor-pointer items-center py-2'
>
<motion.div
key={theme}
initial={{ rotate: -90, opacity: 0 }}
animate={{ rotate: 0, opacity: 1 }}
exit={{ rotate: 90, opacity: 0 }}
transition={{ duration: 0.5, ease: 'easeInOut' }}
>
{theme === 'dark' ? (
<Moon className='text-text size-6' />
) : (
<Sun className='text-text size-6' />
)}
</motion.div>
</button>
)
}
"use client";
import { motion } from "framer-motion";
import { Moon, Sun } from "lucide-react";
import { useTheme } from "next-themes";
export default function ThemeToggle() {
const { theme, setTheme } = useTheme();
return (
<button
onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
className="flex cursor-pointer items-center py-2"
>
<motion.div
key={theme}
initial={{ rotate: -90, opacity: 0 }}
animate={{ rotate: 0, opacity: 1 }}
exit={{ rotate: 90, opacity: 0 }}
transition={{ duration: 0.5, ease: "easeInOut" }}
>
{theme === "dark" ? <Moon className="text-text size-6" /> : <Sun className="text-text size-6" />}
</motion.div>
</button>
);
}

12
src/i18n/request.ts Normal file
View File

@@ -0,0 +1,12 @@
import { cookies } from "next/headers";
import { getRequestConfig } from "next-intl/server";
export default getRequestConfig(async () => {
const cookieStore = await cookies();
const locale = cookieStore.get("language")?.value || "fa";
return {
locale,
messages: (await import(`../../messages/${locale}.json`)).default,
};
});

View File

@@ -1,44 +1,40 @@
'use client'
import { AnimatePresence, motion } from 'framer-motion'
import { ThemeProvider } from 'next-themes'
import { useEffect, useState } from 'react'
export function ClientAppProvider({ children }: { children: React.ReactNode }) {
const [mounted, setMounted] = useState(false)
// wait for hydration
useEffect(() => {
setMounted(true)
}, [])
return (
<ThemeProvider
attribute='data-theme'
defaultTheme='dark'
enableSystem={false}
>
<AnimatePresence mode='wait'>
{!mounted ? (
<motion.div
key='splash'
className='bg-map-bg flex h-dvh w-dvw items-center justify-center'
initial={{ opacity: 1 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
/>
) : (
<motion.div
key='app'
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 0.3, ease: 'easeOut' }}
className='bg-map-bg'
>
{children}
</motion.div>
)}
</AnimatePresence>
</ThemeProvider>
)
}
"use client";
import { AnimatePresence, motion } from "framer-motion";
import { ThemeProvider } from "next-themes";
import { useEffect, useState } from "react";
export function ClientAppProvider({ children }: { children: React.ReactNode }) {
const [mounted, setMounted] = useState(false);
// wait for hydration
useEffect(() => {
setMounted(true);
}, []);
return (
<ThemeProvider attribute="data-theme" defaultTheme="dark" enableSystem={false}>
<AnimatePresence mode="wait">
{!mounted ? (
<motion.div
key="splash"
className="bg-map-bg flex h-dvh w-dvw items-center justify-center"
initial={{ opacity: 1 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
/>
) : (
<motion.div
key="app"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 0.3, ease: "easeOut" }}
className="bg-map-bg"
>
{children}
</motion.div>
)}
</AnimatePresence>
</ThemeProvider>
);
}

View File

@@ -1,43 +1,43 @@
@import 'tailwindcss';
*,
*::before,
*::after,
*::-webkit-scrollbar {
box-sizing: border-box;
}
* {
-ms-overflow-style: none;
scrollbar-width: none;
transition:
background-color 0.3s ease,
color 0.3s ease,
border-color 0.3s ease;
}
*::-webkit-scrollbar {
display: none;
}
body {
margin: 0;
}
@theme {
--color-primary: #cbd5e1;
--color-text: #273343;
/* constants */
--color-neo-aqua: #16a795;
--color-core-red: #ef4444;
--color-warning: #eedd55;
--color-information: #0ea5e9;
--color-error: #ef4444;
--color-success: #22c55e;
}
[data-theme='dark'] {
--color-primary: #273343;
--color-text: #cbd5e1;
}
@import "tailwindcss";
*,
*::before,
*::after,
*::-webkit-scrollbar {
box-sizing: border-box;
}
* {
-ms-overflow-style: none;
scrollbar-width: none;
transition:
background-color 0.3s ease,
color 0.3s ease,
border-color 0.3s ease;
}
*::-webkit-scrollbar {
display: none;
}
body {
margin: 0;
}
@theme {
--color-primary: #cbd5e1;
--color-text: #273343;
/* constants */
--color-neo-aqua: #16a795;
--color-core-red: #ef4444;
--color-warning: #eedd55;
--color-information: #0ea5e9;
--color-error: #ef4444;
--color-success: #22c55e;
}
[data-theme="dark"] {
--color-primary: #273343;
--color-text: #cbd5e1;
}

View File

@@ -1,34 +1,28 @@
{
"compilerOptions": {
"target": "ES2017",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "react-jsx",
"incremental": true,
"plugins": [
{
"name": "next"
}
],
"paths": {
"@/*": ["./src/*"],
"&/*": ["./public/*"]
}
},
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx",
".next/types/**/*.ts",
".next/dev/types/**/*.ts"
],
"exclude": ["node_modules"]
}
{
"compilerOptions": {
"target": "ES2017",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "react-jsx",
"incremental": true,
"plugins": [
{
"name": "next"
}
],
"paths": {
"@/*": ["./src/*"],
"&/*": ["./public/*"]
}
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", ".next/dev/types/**/*.ts"],
"exclude": ["node_modules"]
}