github.com/tilt-dev/tilt@v0.33.15-0.20240515162809-0a22ed45d8a0/web/src/ClearLogs.tsx (about)

     1  import React from "react"
     2  import styled from "styled-components"
     3  import { InstrumentedButton } from "./instrumentedComponents"
     4  import LogStore, { useLogStore } from "./LogStore"
     5  import {
     6    AnimDuration,
     7    Color,
     8    FontSize,
     9    mixinResetButtonStyle,
    10  } from "./style-helpers"
    11  import { ResourceName } from "./types"
    12  
    13  const ClearLogsButton = styled(InstrumentedButton)`
    14    ${mixinResetButtonStyle};
    15    margin-left: 1rem;
    16    font-size: ${FontSize.small};
    17    color: ${Color.white};
    18    transition: color ${AnimDuration.default} ease;
    19  
    20    &:hover {
    21      color: ${Color.blue};
    22    }
    23  `
    24  
    25  export interface ClearLogsProps {
    26    resourceName: string
    27  }
    28  
    29  export const clearLogs = (logStore: LogStore, resourceName: string) => {
    30    let spans: { [key: string]: Proto.webviewLogSpan }
    31    const all = resourceName === ResourceName.all
    32    if (all) {
    33      spans = logStore.allSpans()
    34    } else {
    35      spans = logStore.spansForManifest(resourceName)
    36    }
    37    logStore.removeSpans(Object.keys(spans))
    38  }
    39  
    40  const ClearLogs: React.FC<ClearLogsProps> = ({ resourceName }) => {
    41    const logStore = useLogStore()
    42    const all = resourceName == ResourceName.all
    43    const label = all ? "Clear All Logs" : "Clear Logs"
    44  
    45    return (
    46      <ClearLogsButton
    47        onClick={() => clearLogs(logStore, resourceName)}
    48        analyticsName="ui.web.clearLogs"
    49        analyticsTags={{ all: all.toString() }}
    50      >
    51        {label}
    52      </ClearLogsButton>
    53    )
    54  }
    55  
    56  export default ClearLogs