Merge pull request #7 from uninus-opensource/feat/sample-page-market

feat: sample page market

apps/web/backoffice/app/(auth)/auth/(nested)/register/_modules/organization/organization.spec.tsx

@@ -1,11 +1,16 @@
 import { PropsWithChildren } from 'react';
 import { AuthRegisterOrganizationModule } from '.';
 import { render } from '@testing-library/react';
+import { TMetaErrorResponse } from '@psu/entities';
 
 jest.mock('drizzle-orm/node-postgres', () => ({
   drizzle: jest.fn(() => ({})),
 }));
 
+jest.mock('next/image', () => ({
+  Image: jest.fn(() => <></>),
+}));
+
 jest.mock('pg', () => {
   return {
     Pool: jest.fn(() => ({})),
@@ -94,7 +99,9 @@ jest.mock('next-usequerystate', () => ({ useQueryState: () => ({}) }));
 
 describe('Auth Register Personal Module', () => {
   it('Should render successfully', () => {
-    const { baseElement } = render(<AuthRegisterOrganizationModule />);
+    const { baseElement } = render(
+      <AuthRegisterOrganizationModule errorData={{} as TMetaErrorResponse} />
+    );
     expect(baseElement).toBeTruthy();
   });
 });

apps/web/backoffice/app/(auth)/auth/(nested)/register/_modules/personal/personal.spec.tsx

@@ -2,6 +2,10 @@ import { PropsWithChildren } from 'react';
 import { AuthRegisterPersonalModule } from '.';
 import { render } from '@testing-library/react';
 
+jest.mock('next/image', () => ({
+  Image: jest.fn(() => <></>),
+}));
+
 jest.mock('react-avatar', () => ({
   Avatar: jest.fn(() => <></>),
 }));

apps/web/backoffice/app/(auth)/auth/login/_modules/login.spec.tsx

@@ -6,6 +6,10 @@ jest.mock('react-avatar', () => ({
   Avatar: jest.fn(() => <></>),
 }));
 
+jest.mock('next/image', () => ({
+  Image: jest.fn(() => <></>),
+}));
+
 jest.mock('react-hook-form', () => ({
   ...jest.requireActual('react-hook-form'),
   Controller: () => <></>,

apps/web/backoffice/app/(protected)/template.tsx

@@ -1,19 +1,15 @@
 'use client';
 import { Navbar, Sidebar } from '@psu/web-component-molecules';
 import { FC, PropsWithChildren, ReactElement } from 'react';
-import { useSession } from 'next-auth/react';
-import { TUser } from '@psu/entities';
 
 const ProtectedTemplate: FC<Readonly<PropsWithChildren>> = ({
   children,
 }): ReactElement => {
-  const { data } = useSession();
-
   return (
     <main className="w-full flex min-h-screen h-full bg-grey-50">
       <Sidebar />
       <section className="flex flex-col w-full">
-        <Navbar user={data?.user as TUser} />
+        <Navbar logoUrl="" />
         <div className="flex px-8 py-6">{children}</div>
       </section>
     </main>

apps/web/market/app/(landing)/_modules/index.tsx

@@ -0,0 +1,23 @@
+'use client';
+// import { trpc } from '@psu/web-services';
+import { NavbarMarket } from '@psu/web-component-molecules';
+import { FC, ReactElement } from 'react';
+
+export const MarketModule: FC = (): ReactElement => {
+  return (
+    <main className="w-full h-screen flex flex-col">
+      <NavbarMarket />
+      <section className="flex flex-col justify-center items-center w-full h-full px-[6rem]">
+        <div className="w-full h-[443px] bg-neutral-30% rounded-md flex flex-col justify-center items-center gap-12">
+          <h1 className="text-3xl">Digitalisasi Pasar Desa</h1>
+          <p className="text-base w-[50%] text-center">
+            Digitalisasi Pasar Desa di desa Bojongsari kecamatan Bojongsoang
+            merujuk pada proses memanfaatkan teknologi digital, seperti platform
+            online yang bertujuan untuk meningkatkan pendapatan hingga
+            memperluas akses pasar.
+          </p>
+        </div>
+      </section>
+    </main>
+  );
+};

apps/web/market/app/(landing)/page.tsx

@@ -0,0 +1,7 @@
+import { NextPage } from 'next';
+import { MarketModule } from './_modules';
+import { ReactElement } from 'react';
+
+const Home: NextPage = (): ReactElement => <MarketModule />;
+
+export default Home;

apps/web/market/specs/index.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import Page from '../app/page';
+import Page from '../app/(landing)/page';
 import { MarketProvider } from '@psu/web-services';
 
 describe('Page', () => {

apps/web/market/tsconfig.storybook.json

@@ -1,7 +1,9 @@
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
-    "emitDecoratorMetadata": true
+    "emitDecoratorMetadata": true,
+    "composite": true,
+    "noEmit": false
   },
   "exclude": ["components/**/*.spec.ts", "components/**/*.test.ts"],
   "include": [

apps/web/tourism/tsconfig.json

@@ -16,10 +16,7 @@
         "name": "next"
       }
     ],
-    "types": [
-      "jest",
-      "node"
-    ]
+    "types": ["jest", "node"]
   },
   "include": [
     "**/*.ts",

apps/web/tourism/tsconfig.storybook.json

@@ -1,7 +1,8 @@
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
-    "emitDecoratorMetadata": true
+    "emitDecoratorMetadata": true,
+    "composite": true
   },
   "exclude": ["components/**/*.spec.ts", "components/**/*.test.ts"],
   "include": [

design-token.js

@@ -2,138 +2,102 @@ export const colors = {
   white: '#ffffff',
   black: '#000000',
   slate: '#E4E5E7',
+  gray: '#999999',
   primary: {
-    DEFAULT: '#009647',
-    50: '#edfff5',
-    100: '#d6ffe9',
-    200: '#afffd4',
-    300: '#71ffb4',
-    400: '#2dfb8c',
-    500: '#02e56d',
-    600: '#00bf56',
-    700: '#009647',
-    800: '#06753b',
-    900: '#085f33',
-    950: '#00361a',
-  },
-
-  'primary-2': {
-    DEFAULT: '#175349',
-    50: '#f1fcf8',
-    100: '#d0f7eb',
-    200: '#a2edd7',
-    300: '#6bddbf',
-    400: '#3cc5a5',
-    500: '#23a98c',
-    600: '#198873',
-    700: '#186d5d',
-    800: '#175349',
-    900: '#184940',
-    950: '#082b26',
+    DEFAULT: '#189146',
+    '10%': '#d1e9da',
+    '20%': '#b2dac1',
+    '30%': '#8cc8a3',
+    '40%': '#65b684',
+    '50%': '#3ea365',
+    '60%': '#14793a',
+    '70%': '#10612f',
+    '80%': '#0c4923',
+    '90%': '#083017',
+    '100%': '#051d0e',
   },
 
   secondary: {
-    DEFAULT: '#f8bf02',
-    50: '#fffeea',
-    100: '#fffcc5',
-    200: '#fff986',
-    300: '#fff047',
-    400: '#ffe21d',
-    500: '#f8bf02',
-    600: '#e09700',
-    700: '#ba6c03',
-    800: '#96530a',
-    900: '#7c440b',
-    950: '#472301',
+    DEFAULT: '#f6df09',
+    '10%': '#fdf9ce',
+    '20%': '#fcf4ad',
+    '30%': '#fbef84',
+    '40%': '#f9ea5b',
+    '50%': '#f8e432',
+    '60%': '#cdba08',
+    '70%': '#a49506',
+    '80%': '#7b7005',
+    '90%': '#524a03',
+    '100%': '#312d02',
   },
 
-  success: {
-    DEFAULT: '#53cc55',
-    50: '#f1fcf1',
-    100: '#dff9df',
-    200: '#c1f1c1',
-    300: '#91e492',
-    400: '#53cc55',
-    500: '#34b337',
-    600: '#259427',
-    700: '#217423',
-    800: '#1f5c21',
-    900: '#1b4c1d',
-    950: '#092a0c',
+  green: {
+    DEFAULT: '#189146',
+    '10%': '#d1e9da',
+    '20%': '#b2dac1',
+    '30%': '#8cc8a3',
+    '40%': '#65b684',
+    '50%': '#3ea365',
+    '60%': '#14793a',
+    '70%': '#10612f',
+    '80%': '#0c4923',
+    '90%': '#083017',
+    '100%': '#051d0e',
   },
 
-  info: {
-    DEFAULT: '#1b81f7',
-    50: '#eef9ff',
-    100: '#d9f0ff',
-    200: '#bbe5ff',
-    300: '#8dd6ff',
-    400: '#57bdff',
-    500: '#309eff',
-    600: '#1b81f7',
-    700: '#1268e3',
-    800: '#1554b8',
-    900: '#174991',
-    950: '#132d58',
+  blue: {
+    DEFAULT: '#309eff',
+    '10%': '#d6ecff',
+    '20%': '#badfff',
+    '30%': '#98cfff',
+    '40%': '#75beff',
+    '50%': '#53aeff',
+    '60%': '#2884d5',
+    '70%': '#2069aa',
+    '80%': '#184f80',
+    '90%': '#103555',
+    '100%': '#0a2033',
   },
 
-  warning: {
-    DEFAULT: '#ffb800',
-    50: '#fffeea',
-    100: '#fff9c5',
-    200: '#fff485',
-    300: '#ffe846',
-    400: '#ffd81b',
-    500: '#ffb800',
-    600: '#e28d00',
-    700: '#bb6302',
-    800: '#984c08',
-    900: '#7c3f0b',
-    950: '#482000',
+  yellow: {
+    DEFAULT: '#f6df09',
+    '10%': '#fdf9ce',
+    '20%': '#fcf4ad',
+    '30%': '#fbef84',
+    '40%': '#f9ea5b',
+    '50%': '#f8e432',
+    '60%': '#cdba08',
+    '70%': '#a49506',
+    '80%': '#7b7005',
+    '90%': '#524a03',
+    '100%': '#312d02',
   },
 
-  error: {
-    DEFAULT: '#ff601c',
-    50: '#fff5ed',
-    100: '#ffe8d4',
-    200: '#ffcda8',
-    300: '#ffaa70',
-    400: '#ff7b37',
-    500: '#ff601c',
-    600: '#f03c06',
-    700: '#c72a07',
-    800: '#9e220e',
-    900: '#7f200f',
-    950: '#450c05',
+  red: {
+    DEFAULT: '#e52e2e',
+    '10%': '#fad5d5',
+    '20%': '#f6b9b9',
+    '30%': '#f29797',
+    '40%': '#ee7474',
+    '50%': '#e95151',
+    '60%': '#bf2626',
+    '70%': '#991f1f',
+    '80%': '#731717',
+    '90%': '#4c0f0f',
+    '100%': '#2e0909',
   },
 
   neutral: {
-    DEFAULT: '#53cc55',
-    50: '#f1fcf1',
-    100: '#f1fcf1',
-    200: '#dff9df',
-    300: '#c1f1c1',
-    400: '#91e492',
-    500: '#53cc55',
-    600: '#34b337',
-    700: '#259427',
-    800: '#217423',
-    900: '#1f5c21',
-    950: '#1b4c1d',
-  },
-
-  grey: {
-    DEFAULT: '#6d6d6d',
-    50: '#f6f6f6',
-    100: '#e7e7e7',
-    200: '#d1d1d1',
-    300: '#b0b0b0',
-    400: '#808080',
-    500: '#6d6d6d',
-    600: '#5d5d5d',
-    700: '#4f4f4f',
-    800: '#454545',
-    900: '#3d3d3d',
-    950: '#262626',
+    DEFAULT: '#c4c3c3',
+    '10%': '#f3f3f3',
+    '20%': '#ebebeb',
+    '30%': '#e2e1e1',
+    '40%': '#d8d7d7',
+    '50%': '#cecdcd',
+    '60%': '#a3a3a3',
+    '70%': '#838282',
+    '80%': '#626262',
+    '90%': '#414141',
+    '100%': '#272727',
   },
 };

libs/entities/src/index.ts

@@ -2,3 +2,4 @@ export * from './types';
 export * from './enums';
 export * from './schemas';
 export * from './templates';
+export * from './utils';