github.com/freiheit-com/kuberpult@v1.24.2-0.20240328135542-315d5630abe6/services/frontend-service/src/ui/Pages/Locks/LocksPage.tsx (about)

     1  /*This file is part of kuberpult.
     2  
     3  Kuberpult is free software: you can redistribute it and/or modify
     4  it under the terms of the Expat(MIT) License as published by
     5  the Free Software Foundation.
     6  
     7  Kuberpult is distributed in the hope that it will be useful,
     8  but WITHOUT ANY WARRANTY; without even the implied warranty of
     9  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    10  MIT License for more details.
    11  
    12  You should have received a copy of the MIT License
    13  along with kuberpult. If not, see <https://directory.fsf.org/wiki/License:Expat>.
    14  
    15  Copyright 2023 freiheit.com*/
    16  import React, { useMemo } from 'react';
    17  import { LocksTable } from '../../components/LocksTable/LocksTable';
    18  import { searchCustomFilter, sortLocks, useEnvironments, useGlobalLoadingState } from '../../utils/store';
    19  import { useSearchParams } from 'react-router-dom';
    20  import { LoadingStateSpinner } from '../../utils/LoadingStateSpinner';
    21  import { TopAppBar } from '../../components/TopAppBar/TopAppBar';
    22  
    23  const applicationFieldHeaders = [
    24      'Date',
    25      'Environment',
    26      'Application',
    27      'Lock Id',
    28      'Message',
    29      'Author Name',
    30      'Author Email',
    31      '',
    32  ];
    33  
    34  const environmentFieldHeaders = ['Date', 'Environment', 'Lock Id', 'Message', 'Author Name', 'Author Email', ''];
    35  export const LocksPage: React.FC = () => {
    36      const [params] = useSearchParams();
    37      const appNameParam = params.get('application');
    38      const envs = useEnvironments();
    39      const envLocks = useMemo(
    40          () =>
    41              sortLocks(
    42                  Object.values(envs)
    43                      .map((env) =>
    44                          Object.values(env.locks).map((lock) => ({
    45                              date: lock.createdAt,
    46                              environment: env.name,
    47                              lockId: lock.lockId,
    48                              message: lock.message,
    49                              authorName: lock.createdBy?.name,
    50                              authorEmail: lock.createdBy?.email,
    51                          }))
    52                      )
    53                      .flat(),
    54                  'oldestToNewest'
    55              ),
    56          [envs]
    57      );
    58      const appLocks = useMemo(
    59          () =>
    60              sortLocks(
    61                  Object.values(envs)
    62                      .map((env) =>
    63                          Object.values(env.applications)
    64                              .map((app) =>
    65                                  Object.values(app.locks).map((lock) => ({
    66                                      date: lock.createdAt,
    67                                      environment: env.name,
    68                                      application: app.name,
    69                                      lockId: lock.lockId,
    70                                      message: lock.message,
    71                                      authorName: lock.createdBy?.name,
    72                                      authorEmail: lock.createdBy?.email,
    73                                  }))
    74                              )
    75                              .flat()
    76                      )
    77                      .flat()
    78                      .filter((lock) => searchCustomFilter(appNameParam, lock.application)),
    79                  'oldestToNewest'
    80              ),
    81          [appNameParam, envs]
    82      );
    83      const [everythingLoaded, loadingState] = useGlobalLoadingState();
    84      if (!everythingLoaded) {
    85          return <LoadingStateSpinner loadingState={loadingState} />;
    86      }
    87      return (
    88          <div>
    89              <TopAppBar showAppFilter={true} showTeamFilter={false} showWarningFilter={false} />
    90              <main className="main-content">
    91                  <LocksTable headerTitle="Environment Locks" columnHeaders={environmentFieldHeaders} locks={envLocks} />
    92                  <LocksTable headerTitle="Application Locks" columnHeaders={applicationFieldHeaders} locks={appLocks} />
    93              </main>
    94          </div>
    95      );
    96  };