npm - @oss-ma/tpl - Versions diffs - 1.0.31 → 1.0.33 - Mend

@oss-ma/tpl 1.0.31 → 1.0.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (21) hide show

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@oss-ma/tpl",
-  "version": "1.0.31",
+  "version": "1.0.33",
   "description": "Generate, enforce and maintain clean project architectures",
   "type": "module",
   "repository": {

package/resources/templates/react-next/files/env.example ADDED Viewed

@@ -0,0 +1,10 @@
+# Application
+NEXT_PUBLIC_APP_NAME={{appName}}
+NEXT_PUBLIC_APP_VERSION=0.1.0
+# API
+NEXT_PUBLIC_API_BASE_URL=https://api.example.com
+# Server-side only (never exposed to browser)
+# DATABASE_URL=postgresql://user:password@localhost:5432/mydb
+# SECRET_KEY=your-secret-key

package/resources/templates/react-next/files/gitignore ADDED Viewed

@@ -0,0 +1,19 @@
+# Dependencies
+node_modules/
+# Next.js
+.next/
+out/
+# Environment
+.env
+.env.local
+.env.*.local
+# Build
+dist/
+# Misc
+.DS_Store
+*.pem
+npm-debug.log*

package/resources/templates/react-next/files/jest.config.ts ADDED Viewed

@@ -0,0 +1,15 @@
+import type { Config } from "jest";
+import nextJest from "next/jest.js";
+const createJestConfig = nextJest({ dir: "./" });
+const config: Config = {
+  coverageProvider: "v8",
+  testEnvironment: "jsdom",
+  setupFilesAfterFramework: ["<rootDir>/src/tests/setup.ts"],
+  moduleNameMapper: {
+    "^@/(.*)$": "<rootDir>/src/$1",
+  },
+};
+export default createJestConfig(config);

package/resources/templates/react-next/files/next.config.mjs ADDED Viewed

File without changes

package/resources/templates/react-next/files/package.json ADDED Viewed

@@ -0,0 +1,50 @@
+{
+  "name": "{{appName}}",
+  "private": true,
+  "version": "0.1.0",
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "format": "prettier -w .",
+    "typecheck": "tsc --noEmit",
+    "test": "jest --passWithNoTests",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "prepare": "husky",
+    "audit": "npm audit --audit-level=high"
+  },
+  "dependencies": {
+    "next": "^15.1.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"{{#if state}},
+    "zustand": "^5.0.0"{{/if}}{{#if fetching}},
+    "@tanstack/react-query": "^5.56.0"{{/if}}
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^19.3.0",
+    "@commitlint/config-conventional": "^19.2.0",{{#if fetching}}
+    "@tanstack/react-query-devtools": "^5.56.0",{{/if}}
+    "@testing-library/jest-dom": "^6.5.0",
+    "@testing-library/react": "^16.0.0",
+    "@testing-library/user-event": "^14.5.0",
+    "@types/jest": "^29.5.0",
+    "@types/node": "^20.0.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "eslint": "^8.57.0",
+    "eslint-config-next": "^15.1.0",
+    "husky": "^9.0.0",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "lint-staged": "^15.2.0",
+    "prettier": "^3.3.0",
+    "ts-jest": "^29.2.0",
+    "typescript": "^5.5.0"
+  },
+  "lint-staged": {
+    "*.{ts,tsx,js,jsx,json,md,yml,yaml}": ["prettier -w"],
+    "*.{ts,tsx,js,jsx}": ["eslint --fix"]
+  }
+}

package/resources/templates/react-next/files/src/app/globals.css ADDED Viewed

@@ -0,0 +1,18 @@
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+:root {
+  font-family: Inter, system-ui, sans-serif;
+  line-height: 1.5;
+}
+body {
+  min-height: 100vh;
+  background: #0a0a0a;
+  color: #ededed;
+}

package/resources/templates/react-next/files/src/app/layout.tsx ADDED Viewed

@@ -0,0 +1,32 @@
+import type { Metadata } from "next";
+import { Inter } from "next/font/google";
+{{#if fetching}}
+import { QueryProvider } from "@/lib/QueryProvider";
+{{/if}}
+import "./globals.css";
+const inter = Inter({ subsets: ["latin"] });
+export const metadata: Metadata = {
+  title: "{{appName}}",
+  description: "Generated by @oss-ma/tpl",
+};
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en">
+      <body className={inter.className}>
+        {{#if fetching}}
+        <QueryProvider>{children}</QueryProvider>
+        {{/if}}
+        {{#unless fetching}}
+        {children}
+        {{/unless}}
+      </body>
+    </html>
+  );
+}

package/resources/templates/react-next/files/src/app/loading.tsx ADDED Viewed

@@ -0,0 +1,7 @@
+export default function Loading() {
+  return (
+    <div style={{ padding: "2rem", textAlign: "center" }}>
+      <p>Loading...</p>
+    </div>
+  );
+}

package/resources/templates/react-next/files/src/app/not-found.tsx ADDED Viewed

@@ -0,0 +1,13 @@
+import Link from "next/link";
+export default function NotFound() {
+  return (
+    <main style={{ padding: "2rem", textAlign: "center" }}>
+      <h1>404</h1>
+      <p>Page not found.</p>
+      <Link href="/" style={{ marginTop: "1rem", display: "inline-block" }}>
+        Go home
+      </Link>
+    </main>
+  );
+}

package/resources/templates/react-next/files/src/app/page.tsx ADDED Viewed

@@ -0,0 +1,13 @@
+import { ExampleFeature } from "@/features/example/ExampleFeature";
+export default function HomePage() {
+  return (
+    <main style={{ padding: "2rem", maxWidth: 800, margin: "0 auto" }}>
+      <h1>{{appName}}</h1>
+      <p style={{ marginTop: "0.5rem", opacity: 0.7 }}>
+        Next.js 14 · App Router · TypeScript
+      </p>
+      <ExampleFeature />
+    </main>
+  );
+}

package/resources/templates/react-next/files/src/features/example/ExampleFeature.tsx ADDED Viewed

@@ -0,0 +1,74 @@
+"use client";
+{{#if fetching}}
+import { useQuery } from "@tanstack/react-query";
+{{/if}}
+{{#if state}}
+import { useCounterStore } from "./store";
+{{/if}}
+import { Button } from "@/shared/ui/Button";
+{{#if fetching}}
+interface Post {
+  id: number;
+  title: string;
+}
+async function fetchPosts(): Promise<Post[]> {
+  const res = await fetch(
+    "https://jsonplaceholder.typicode.com/posts?_limit=3",
+    { cache: "no-store" }
+  );
+  if (!res.ok) throw new Error("Failed to fetch posts");
+  return res.json();
+}
+{{/if}}
+export function ExampleFeature() {
+  {{#if state}}
+  const { count, increment, decrement, reset } = useCounterStore();
+  {{/if}}
+  {{#if fetching}}
+  const { data: posts, isLoading, isError } = useQuery({
+    queryKey: ["posts"],
+    queryFn: fetchPosts,
+  });
+  {{/if}}
+  return (
+    <section style={{ marginTop: "2rem" }}>
+      {{#if state}}
+      <div style={{ marginBottom: "2rem" }}>
+        <h2>Counter (Zustand)</h2>
+        <p style={{ fontSize: "2rem", margin: "0.5rem 0" }}>{count}</p>
+        <div style={{ display: "flex", gap: "0.5rem" }}>
+          <Button onClick={decrement}>−</Button>
+          <Button onClick={increment}>+</Button>
+          <Button onClick={reset} variant="secondary">Reset</Button>
+        </div>
+      </div>
+      {{/if}}
+      {{#if fetching}}
+      <div>
+        <h2>Posts (TanStack Query)</h2>
+        {isLoading && <p>Loading...</p>}
+        {isError && <p>Error loading posts.</p>}
+        {posts && (
+          <ul style={{ marginTop: "0.5rem", paddingLeft: "1.2rem" }}>
+            {posts.map((post) => (
+              <li key={post.id} style={{ marginBottom: "0.25rem" }}>
+                {post.title}
+              </li>
+            ))}
+          </ul>
+        )}
+      </div>
+      {{/if}}
+      {{#unless state}}
+      {{#unless fetching}}
+      <p>Feature module — add your components here.</p>
+      {{/unless}}
+      {{/unless}}
+    </section>
+  );
+}

package/resources/templates/react-next/files/src/features/example/store.ts ADDED Viewed

@@ -0,0 +1,15 @@
+import { create } from "zustand";
+interface CounterState {
+  count: number;
+  increment: () => void;
+  decrement: () => void;
+  reset: () => void;
+}
+export const useCounterStore = create<CounterState>((set) => ({
+  count: 0,
+  increment: () => set((state) => ({ count: state.count + 1 })),
+  decrement: () => set((state) => ({ count: state.count - 1 })),
+  reset: () => set({ count: 0 }),
+}));

package/resources/templates/react-next/files/src/lib/QueryProvider.tsx ADDED Viewed

@@ -0,0 +1,26 @@
+"use client";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+import { useState } from "react";
+export function QueryProvider({ children }: { children: React.ReactNode }) {
+  const [queryClient] = useState(
+    () =>
+      new QueryClient({
+        defaultOptions: {
+          queries: {
+            staleTime: 1000 * 60 * 5,
+            retry: 1,
+          },
+        },
+      })
+  );
+  return (
+    <QueryClientProvider client={queryClient}>
+      {children}
+      <ReactQueryDevtools initialIsOpen={false} />
+    </QueryClientProvider>
+  );
+}

package/resources/templates/react-next/files/src/shared/ui/Button.test.tsx ADDED Viewed

@@ -0,0 +1,21 @@
+import { render, screen, fireEvent } from "@testing-library/react";
+import { Button } from "@/shared/ui/Button";
+describe("Button", () => {
+  it("renders children", () => {
+    render(<Button>Click me</Button>);
+    expect(screen.getByRole("button", { name: /click me/i })).toBeInTheDocument();
+  });
+  it("calls onClick when clicked", () => {
+    const handler = jest.fn();
+    render(<Button onClick={handler}>Click</Button>);
+    fireEvent.click(screen.getByRole("button"));
+    expect(handler).toHaveBeenCalledTimes(1);
+  });
+  it("is disabled when disabled prop is set", () => {
+    render(<Button disabled>Disabled</Button>);
+    expect(screen.getByRole("button")).toBeDisabled();
+  });
+});

package/resources/templates/react-next/files/src/shared/ui/Button.tsx ADDED Viewed

@@ -0,0 +1,34 @@
+"use client";
+import type { ButtonHTMLAttributes } from "react";
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: "primary" | "secondary";
+}
+export function Button({
+  variant = "primary",
+  children,
+  style,
+  ...props
+}: ButtonProps) {
+  const base: React.CSSProperties = {
+    padding: "0.4rem 1rem",
+    borderRadius: 6,
+    border: "none",
+    cursor: "pointer",
+    fontWeight: 500,
+    fontSize: "0.9rem",
+  };
+  const variants: Record<string, React.CSSProperties> = {
+    primary: { background: "#646cff", color: "#fff" },
+    secondary: { background: "#3a3a3a", color: "#fff" },
+  };
+  return (
+    <button style={{ ...base, ...variants[variant], ...style }} {...props}>
+      {children}
+    </button>
+  );
+}

package/resources/templates/react-next/files/src/tests/setup.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ import "@testing-library/jest-dom";

package/resources/templates/react-next/files/tsconfig.json ADDED Viewed

@@ -0,0 +1,24 @@
+{
+  "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": "preserve",
+    "incremental": true,
+    "plugins": [{ "name": "next" }],
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

package/resources/templates/react-next/template.yaml ADDED Viewed

@@ -0,0 +1,37 @@
+name: react-next
+version: 1.0.0
+description: "Next.js 14 App Router + TypeScript with optional state and fetching"
+engine: "v1"
+questions:
+  - name: appName
+    message: "Nom du projet ?"
+    default: "my-next-app"
+  - name: packageManager
+    message: "Package manager ?"
+    choices: ["npm", "pnpm", "yarn"]
+    default: "npm"
+  - name: state
+    message: "State management ?"
+    choices: ["zustand", "none"]
+    default: "zustand"
+  - name: fetching
+    message: "Data fetching ?"
+    choices: ["tanstack-query", "none"]
+    default: "tanstack-query"
+hooks:
+  postGenerate:
+    - run: "git init"
+    - run: "npm install --ignore-scripts"
+      when: "{{packageManager}} == npm"
+    - run: "pnpm install --ignore-scripts"
+      when: "{{packageManager}} == pnpm"
+    - run: "yarn install --ignore-scripts"
+      when: "{{packageManager}} == yarn"

package/resources/templates/react-ts/files/src/features/example/ExampleFeature.tsx CHANGED Viewed

@@ -24,7 +24,6 @@ export function ExampleFeature() {
   const { count, increment, decrement, reset } = useCounterStore();
   {{/if}}
   {{#if fetching}}
   const { data: posts, isLoading, isError } = useQuery({
     queryKey: ["posts"],
     queryFn: fetchPosts,
@@ -60,11 +59,6 @@ export function ExampleFeature() {
         )}
       </div>
       {{/if}}
-      {{#unless state}}
-      {{#unless fetching}}
-      <p>Feature module — add your components here.</p>
-      {{/unless}}
-      {{/unless}}
     </section>
   );
 }

package/resources/templates/react-ts/files/src/pages/HomePage.tsx CHANGED Viewed

@@ -2,18 +2,14 @@
 import { ExampleFeature } from "@/features/example/ExampleFeature";
 {{/if}}
 {{#unless state}}
-{{#unless fetching}}
 import { Button } from "@/shared/ui/Button";
 import { useState } from "react";
 {{/unless}}
-{{/unless}}
 export function HomePage() {
   {{#unless state}}
-  {{#unless fetching}}
   const [msg, setMsg] = useState<string | null>(null);
   {{/unless}}
-  {{/unless}}
   return (
     <main style={{ padding: "2rem", maxWidth: 800, margin: "0 auto" }}>
@@ -25,13 +21,11 @@ export function HomePage() {
       <ExampleFeature />
       {{/if}}
       {{#unless state}}
-      {{#unless fetching}}
       <section style={{ marginTop: "2rem" }}>
         <Button onClick={() => setMsg("Hello!")}>Click me</Button>
         {msg && <p style={{ marginTop: "0.5rem" }}>{msg}</p>}
       </section>
       {{/unless}}
-      {{/unless}}
     </main>
   );
 }