github.com/treeverse/lakefs@v1.24.1-0.20240520134607-95648127bfb0/webui/src/lib/components/repository/tabs.jsx (about)

     1  import React from "react";
     2  
     3  import Nav from "react-bootstrap/Nav";
     4  import {FileDiffIcon, GitCommitIcon, DatabaseIcon, GitBranchIcon, GitCompareIcon, PlayIcon, GearIcon, TagIcon} from "@primer/octicons-react";
     5  
     6  import {useRefs} from "../../hooks/repo";
     7  import {Link, NavItem} from "../nav";
     8  import {useRouter} from "../../hooks/router";
     9  import {RefTypeBranch} from "../../../constants";
    10  
    11  
    12  
    13  export const RepositoryNavTabs = ({ active }) => {
    14      const { reference } = useRefs();
    15      const router = useRouter();
    16      const { repoId } = router.params;
    17  
    18      const withRefContext = (url) => {
    19          const params = new URLSearchParams();
    20          if (reference) params.append('ref', reference.id);
    21          if (params.toString())
    22              return `${url}?${params.toString()}`;
    23          return url;
    24      };
    25  
    26      const withRefAndCompareContext = (url) => {
    27          const params = new URLSearchParams();
    28          if (reference) {
    29              params.append('ref', reference.id)
    30              params.append('compare', reference.id);
    31          }
    32          if (params.toString())
    33              return `${url}?${params.toString()}`;
    34          return url;
    35      };
    36  
    37      const withBranchContext = (url) => {
    38          const params = new URLSearchParams();
    39          if (!!reference && reference.type === RefTypeBranch) params.append('ref', reference.id);
    40          if (params.toString())
    41              return `${url}?${params.toString()}`;
    42          return url;
    43      };
    44  
    45      return (
    46          <Nav variant="tabs" >
    47              <Link active={active === 'objects'} href={withRefContext(`/repositories/${repoId}/objects`)} component={NavItem}>
    48                  <DatabaseIcon/> Objects
    49              </Link>
    50              <Link active={active === 'changes'} href={withBranchContext(`/repositories/${repoId}/changes`)} component={NavItem}>
    51                  <FileDiffIcon/> Uncommitted Changes
    52              </Link>
    53              <Link active={active === 'commits'} href={withRefContext(`/repositories/${repoId}/commits`)} component={NavItem}>
    54                  <GitCommitIcon/> Commits
    55              </Link>
    56              <Link active={active === 'branches'} href={`/repositories/${repoId}/branches`} component={NavItem}>
    57                  <GitBranchIcon/> Branches
    58              </Link>
    59              <Link active={active === 'tags'} href={`/repositories/${repoId}/tags`} component={NavItem}>
    60                  <TagIcon/> Tags
    61              </Link>
    62              <Link active={active === 'compare'} href={withRefAndCompareContext(`/repositories/${repoId}/compare`)} component={NavItem}>
    63                  <GitCompareIcon/> Compare
    64              </Link>
    65              <Link active={active === 'actions'} href={`/repositories/${repoId}/actions`} component={NavItem}>
    66                  <PlayIcon/> Actions
    67              </Link>
    68              <Link active={active === 'settings'} href={`/repositories/${repoId}/settings`} component={NavItem}>
    69                  <GearIcon/> Settings
    70              </Link>
    71          </Nav>
    72      );
    73  };