import*as t from"react";import i from"styled-components";import{Flex as a}from"@redocly/portal-legacy-ui";import{WarningAltIcon as l}from"@redocly/theme/icons/WarningAltIcon/WarningAltIcon";import n from"./ApiKeyRow";import s from"./CreatedAtRow";import c from"./ExpiresAtRow";import m from"./RevokeAPIKey";import p from"./RollAPIKey";import d from"./SecretRow";import x from"./StageRow";import f from"./StatusRow";function u(r){const{apiKey:e}=r,o=Number(e.expiresAt)>0&&Math.abs(Number(e.expiresAt)-Date.now())<1440*60*1e3;return t.createElement(a,{flexDirection:"column",flexGrow:1},o&&t.createElement(v,null,t.createElement("div",null,"Expires soon"),t.createElement(l,{size:"24px",color:"#C8102E"})),t.createElement(g,{borderColor:o?"var(--color-error-border)":e.stage==="production"?"var(--color-success-border)":""},e.stage&&t.createElement(x,{stage:e.stage})||null,e.clientId&&t.createElement(n,{apiKey:e.clientId})||null,e.clientSecret&&t.createElement(d,{secret:e.clientSecret,hasClientId:!!e.clientId})||null,e.status&&t.createElement(f,{status:e.status})||null,t.createElement(s,{createdAt:e.issuedAt}),t.createElement(c,{expiresAt:e.expiresAt,expiresSoon:o})),e.canBeRolled&&t.createElement(p,{apiKey:e}),e.canBeRevoked&&t.createElement(m,{apiKey:e}))}const g=i.div`
  display: flex;
  flex-direction: column;

  background: var(--layer-color);
  border-radius: ${({borderColor:r})=>r?"0 4px 4px 0":"4px"};
  border-left: ${({borderColor:r})=>r?"2px solid "+r:"none"};

  > :not(:last-child) {
    border-bottom: 1px solid var(--border-color-primary);
  }
`,v=i.div`
  display: flex;
  gap: var(--spacing-xs);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-base);
  padding: var(--spacing-base);

  > svg {
    width: 18px;
    height: 18px;
  }
`;export{u as default};
