We use cookies to ensure you get the best experience on our website
Inicio Explorar Axuda
Rexistro Iniciar sesión
0ct0pu5
/
runtipi
1
0
Fork 0
Ficheiros Incidencias 0 Pull Requests 0 Wiki
Explorar o código

chore: remove Layout and Toast components

Nicolas Meienberger hai 1 ano
pai
8d690e408a
achega
ed9477c068
Modificáronse 8 ficheiros con 0 adicións e 205 borrados
Unificar vista Mostrar estatísticas de Diff
  1. 0 3
      src/client/components/Layout/Layout.module.scss
  2. 0 24
      src/client/components/Layout/Layout.test.tsx
  3. 0 64
      src/client/components/Layout/Layout.tsx
  4. 0 1
      src/client/components/Layout/index.ts
  5. 0 18
      src/client/components/ui/Toast/Toast.module.scss
  6. 0 43
      src/client/components/ui/Toast/Toast.test.tsx
  7. 0 51
      src/client/components/ui/Toast/Toast.tsx
  8. 0 1
      src/client/components/ui/Toast/index.ts

+ 0 - 3
src/client/components/Layout/Layout.module.scss
Ver ficheiro 

@@ -1,3 +0,0 @@
 
-.topActions {
 
-  min-height: 50px;
 
-}

+ 0 - 24
src/client/components/Layout/Layout.test.tsx
Ver ficheiro 

@@ -1,24 +0,0 @@
 
-import React from 'react';
 
-import { render, screen } from '../../../../tests/test-utils';
 
-import { Layout } from './Layout';
 
-
 
-const pushFn = jest.fn();
 
-jest.mock('next/router', () => {
 
-  const actualRouter = jest.requireActual('next-router-mock');
 
-
 
-  return {
 
-    ...actualRouter,
 
-    useRouter: () => ({
 
-      ...actualRouter.useRouter(),
 
-      push: pushFn,
 
-    }),
 
-  };
 
-});
 
-
 
-describe('Test: Layout', () => {
 
-  it('should render correctly its children', () => {
 
-    render(<Layout>test</Layout>);
 
-
 
-    expect(screen.getByText('test')).toBeInTheDocument();
 
-  });
 
-});

+ 0 - 64
src/client/components/Layout/Layout.tsx
Ver ficheiro 

@@ -1,64 +0,0 @@
 
-import Head from 'next/head';
 
-import Link from 'next/link';
 
-import React from 'react';
 
-import clsx from 'clsx';
 
-import semver from 'semver';
 
-import { Header } from '../ui/Header';
 
-import styles from './Layout.module.scss';
 
-import { useSystemStore } from '../../state/systemStore';
 
-
 
-interface IProps {
 
-  breadcrumbs?: { name: string; href: string; current?: boolean }[];
 
-  children: React.ReactNode;
 
-  title?: string;
 
-  actions?: React.ReactNode;
 
-}
 
-
 
-export const Layout: React.FC<IProps> = ({ children, breadcrumbs, title, actions }) => {
 
-  const { version } = useSystemStore();
 
-  const defaultVersion = '0.0.0';
 
-  const isLatest = semver.gte(version?.current || defaultVersion, version?.latest || defaultVersion);
 
-
 
-  const renderBreadcrumbs = () => {
 
-    if (!breadcrumbs) {
 
-      return null;
 
-    }
 
-
 
-    return (
 
-      <ol className="breadcrumb" aria-label="breadcrumbs">
 
-        {breadcrumbs.map((breadcrumb) => (
 
-          <li key={breadcrumb.name} data-testid="breadcrumb-item" className={clsx('breadcrumb-item', { active: breadcrumb.current })}>
 
-            <Link data-testid="breadcrumb-link" href={breadcrumb.href}>
 
-              {breadcrumb.name}
 
-            </Link>
 
-          </li>
 
-        ))}
 
-      </ol>
 
-    );
 
-  };
 
-
 
-  return (
 
-    <div data-testid={`${title?.toLowerCase().split(' ').join('-')}-layout`} className="page">
 
-      <Head>
 
-        <title>{`${title} - Tipi`}</title>
 
-      </Head>
 
-      <Header isUpdateAvailable={!isLatest} />
 
-      <div className="page-wrapper">
 
-        <div className="page-header d-print-none">
 
-          <div className="container-xl">
 
-            <div className={clsx('align-items-stretch align-items-md-center d-flex flex-column flex-md-row ', styles.topActions)}>
 
-              <div className="me-3 text-white">
 
-                <div className="page-pretitle">{renderBreadcrumbs()}</div>
 
-                <h2 className="page-title">{title}</h2>
 
-              </div>
 
-              <div className="flex-fill">{actions}</div>
 
-            </div>
 
-          </div>
 
-        </div>
 
-        <div className="page-body">
 
-          <div className="container-xl">{children}</div>
 
-        </div>
 
-      </div>
 
-    </div>
 
-  );
 
-};

+ 0 - 1
src/client/components/Layout/index.ts
Ver ficheiro 

@@ -1 +0,0 @@
 
-export { Layout } from './Layout';

+ 0 - 18
src/client/components/ui/Toast/Toast.module.scss
Ver ficheiro 

@@ -1,18 +0,0 @@
 
-@keyframes slideInAndOut {
 
-  0% {
 
-    transform: translateX(100%);
 
-  }
 
-  5% {
 
-    transform: translateX(0);
 
-  }
 
-  95% {
 
-    transform: translateX(0);
 
-  }
 
-  100% {
 
-    transform: translateX(100%);
 
-  }
 
-}
 
-
 
-.slideIn {
 
-  animation: slideInAndOut 5s ease-in-out;
 
-}

+ 0 - 43
src/client/components/ui/Toast/Toast.test.tsx
Ver ficheiro 

@@ -1,43 +0,0 @@
 
-import React from 'react';
 
-import { fireEvent, screen, render } from '../../../../../tests/test-utils';
 
-import { Toast } from './Toast';
 
-
 
-describe('Toast', () => {
 
-  it('renders the correct title', () => {
 
-    // arrange
 
-    render(<Toast id="toast-1" title="Test Title" onClose={jest.fn} status="info" />);
 
-
 
-    // assert
 
-    expect(screen.getByText('Test Title')).toBeInTheDocument();
 
-  });
 
-
 
-  it('renders the correct message', () => {
 
-    // arrange
 
-    render(<Toast id="toast-1" title="Test Title" message="Test message" onClose={jest.fn} status="info" />);
 
-
 
-    // assert
 
-    expect(screen.getByText('Test message')).toBeInTheDocument();
 
-  });
 
-
 
-  it('renders the correct status', () => {
 
-    // arrange
 
-    render(<Toast id="toast-1" title="Test Title" status="success" onClose={jest.fn} />);
 
-    const toastElement = screen.getByRole('alert');
 
-
 
-    // assert
 
-    expect(toastElement).toHaveClass('alert-success');
 
-  });
 
-
 
-  it('calls the correct function when the close button is clicked', () => {
 
-    // arrange
 
-    const onCloseMock = jest.fn();
 
-    render(<Toast id="toast-1" title="Test Title" onClose={onCloseMock} status="info" />);
 
-    const closeButton = screen.getByRole('button', { name: 'close' });
 
-
 
-    // act
 
-    fireEvent.click(closeButton);
 
-
 
-    // assert
 
-    expect(onCloseMock).toHaveBeenCalled();
 
-  });
 
-});

+ 0 - 51
src/client/components/ui/Toast/Toast.tsx
Ver ficheiro 

@@ -1,51 +0,0 @@
 
-import clsx from 'clsx';
 
-import React from 'react';
 
-import styles from './Toast.module.scss';
 
-
 
-interface IProps {
 
-  onClose: () => void;
 
-  status: 'success' | 'error' | 'warning' | 'info';
 
-  title: string;
 
-  message?: string;
 
-  id: string;
 
-}
 
-
 
-export const Toast: React.FC<IProps> = ({ status, onClose, title, message, id }) => (
 
-  <div
 
-    id={id}
 
-    className={clsx(styles.slideIn, 'show fade alert alert-important alert-dismissible tipi-toast', {
 
-      'alert-danger': status === 'error',
 
-      'alert-success': status === 'success',
 
-      'alert-info': status === 'info',
 
-      warning: status === 'warning',
 
-    })}
 
-    role="alert"
 
-  >
 
-    <div className="d-flex align-items-center">
 
-      <div>
 
-        <svg
 
-          xmlns="http://www.w3.org/2000/svg"
 
-          className="icon alert-icon"
 
-          width="24"
 
-          height="24"
 
-          viewBox="0 0 24 24"
 
-          strokeWidth="2"
 
-          stroke="currentColor"
 
-          fill="none"
 
-          strokeLinecap="round"
 
-          strokeLinejoin="round"
 
-        >
 
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
 
-          <circle cx="12" cy="12" r="9" />
 
-          <line x1="12" y1="8" x2="12" y2="12" />
 
-          <line x1="12" y1="16" x2="12.01" y2="16" />
 
-        </svg>
 
-      </div>
 
-      <div className="flex-fill">
 
-        <h4 className="alert-title text-white font-weight-bold">{title}</h4>
 
-        {message && <div className="text-white">{message}</div>}
 
-      </div>
 
-    </div>
 
-    <button onClick={onClose} data-testid="toast-close-button" className="btn-close btn-close-white" data-bs-dismiss="alert" aria-label="close" />
 
-  </div>
 
-);

+ 0 - 1
src/client/components/ui/Toast/index.ts
Ver ficheiro 

@@ -1 +0,0 @@
 
-export { Toast } from './Toast';

Contact | Legal | Takedown | Status
Self-hosted public services - About
NibbleSpot by 0ct0pu5