forked from metabase/metabase
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'upstream/master' into qp-refactor-9
- Loading branch information
Showing
91 changed files
with
4,049 additions
and
717 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
27 changes: 27 additions & 0 deletions
27
frontend/src/metabase/admin/tasks/containers/TaskModal.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| import React from "react"; | ||
| import { t } from "c-3po"; | ||
| import { connect } from "react-redux"; | ||
| import { goBack } from "react-router-redux"; | ||
|
|
||
| import { entityObjectLoader } from "metabase/entities/containers/EntityObjectLoader"; | ||
|
|
||
| import Code from "metabase/components/Code"; | ||
| import ModalContent from "metabase/components/ModalContent"; | ||
|
|
||
| @entityObjectLoader({ | ||
| entityType: "tasks", | ||
| entityId: (state, props) => props.params.taskId, | ||
| }) | ||
| @connect(null, { goBack }) | ||
| class TaskModal extends React.Component { | ||
| render() { | ||
| const { object } = this.props; | ||
| return ( | ||
| <ModalContent title={t`Task details`} onClose={() => this.props.goBack()}> | ||
| <Code>{JSON.stringify(object.task_details)}</Code> | ||
| </ModalContent> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| export default TaskModal; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| import React from "react"; | ||
| import { t } from "c-3po"; | ||
| import { Box, Flex } from "grid-styled"; | ||
|
|
||
| import { entityListLoader } from "metabase/entities/containers/EntityListLoader"; | ||
|
|
||
| import AdminHeader from "metabase/components/AdminHeader"; | ||
| import Icon, { IconWrapper } from "metabase/components/Icon"; | ||
| import Link from "metabase/components/Link"; | ||
| import Tooltip from "metabase/components/Tooltip"; | ||
|
|
||
| @entityListLoader({ | ||
| entityType: "tasks", | ||
| pageSize: 50, | ||
| }) | ||
| class TasksApp extends React.Component { | ||
| constructor(props) { | ||
| super(props); | ||
| this.state = { | ||
| offset: this.props.entityQuery.offset, | ||
| }; | ||
| } | ||
| render() { | ||
| const { | ||
| tasks, | ||
| page, | ||
| pageSize, | ||
| onNextPage, | ||
| onPreviousPage, | ||
| children, | ||
| } = this.props; | ||
| return ( | ||
| <Box p={3}> | ||
| <Flex align="center"> | ||
| <Flex align="center"> | ||
| <AdminHeader title={t`Troubleshooting logs`} /> | ||
| <Tooltip | ||
| tooltip={t`Trying to get to the bottom of something? This section shows logs of Metabase's background tasks, which can help shed light on what's going on.`} | ||
| > | ||
| <Icon | ||
| name="info" | ||
| ml={1} | ||
| style={{ marginTop: 5 }} | ||
| className="text-brand-hover cursor-pointer text-medium" | ||
| /> | ||
| </Tooltip> | ||
| </Flex> | ||
| <Flex align="center" ml="auto"> | ||
| <span className="text-bold mr1"> | ||
| {page * pageSize + 1} - {page * pageSize + tasks.length} | ||
| </span> | ||
| <IconWrapper onClick={onPreviousPage} disabled={!onPreviousPage}> | ||
| <Icon name="chevronleft" /> | ||
| </IconWrapper> | ||
| <IconWrapper small onClick={onNextPage} disabled={!onNextPage}> | ||
| <Icon name="chevronright" /> | ||
| </IconWrapper> | ||
| </Flex> | ||
| </Flex> | ||
|
|
||
| <table className="ContentTable mt2"> | ||
| <thead> | ||
| <th>{t`Task`}</th> | ||
| <th>{t`DB ID`}</th> | ||
| <th>{t`Started at`}</th> | ||
| <th>{t`Ended at`}</th> | ||
| <th>{t`Duration (ms)`}</th> | ||
| <th>{t`Details`}</th> | ||
| </thead> | ||
| <tbody> | ||
| {tasks.map(task => ( | ||
| <tr key={task.id}> | ||
| <td className="text-bold">{task.task}</td> | ||
| <td>{task.db_id}</td> | ||
| <td>{task.started_at}</td> | ||
| <td>{task.ended_at}</td> | ||
| <td>{task.duration}</td> | ||
| <td> | ||
| <Link | ||
| className="link text-bold" | ||
| to={`/admin/troubleshooting/tasks/${task.id}`} | ||
| >{t`View`}</Link> | ||
| </td> | ||
| </tr> | ||
| ))} | ||
| </tbody> | ||
| </table> | ||
| { | ||
| // render 'children' so that the invididual task modals show up | ||
| children | ||
| } | ||
| </Box> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| export default TasksApp; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| /* @flow */ | ||
|
|
||
| import React from "react"; | ||
|
|
||
| import PopoverWithTrigger from "metabase/components/PopoverWithTrigger"; | ||
|
|
||
| import { getColorScale } from "metabase/lib/colors"; | ||
|
|
||
| import d3 from "d3"; | ||
| import cx from "classnames"; | ||
|
|
||
| import type { ColorString } from "metabase/lib/colors"; | ||
|
|
||
| type Props = { | ||
| value: ColorString[], | ||
| onChange: (ColorString[]) => void, | ||
| ranges: ColorString[][], | ||
| className?: string, | ||
| style?: { [key: string]: any }, | ||
| sections?: number, | ||
| quantile?: boolean, | ||
| columns?: number, | ||
| }; | ||
|
|
||
| const ColorRangePicker = ({ | ||
| value, | ||
| onChange, | ||
| ranges, | ||
| className, | ||
| style, | ||
| sections = 5, | ||
| quantile = false, | ||
| columns = 2, | ||
| }: Props) => ( | ||
| <PopoverWithTrigger | ||
| triggerElement={ | ||
| <ColorRangePreview | ||
| colors={value} | ||
| className={cx(className, "bordered rounded overflow-hidden")} | ||
| style={{ height: 30, ...style }} | ||
| sections={sections} | ||
| quantile={quantile} | ||
| /> | ||
| } | ||
| > | ||
| {({ onClose }) => ( | ||
| <div className="pt1 mr1 flex flex-wrap" style={{ width: 300 }}> | ||
| {ranges.map(range => ( | ||
| <div | ||
| className={"mb1 pl1"} | ||
| style={{ flex: `1 1 ${Math.round(100 / columns)}%` }} | ||
| > | ||
| <ColorRangePreview | ||
| colors={range} | ||
| onClick={() => { | ||
| onChange(range); | ||
| onClose(); | ||
| }} | ||
| className={cx("bordered rounded overflow-hidden cursor-pointer")} | ||
| style={{ height: 30 }} | ||
| sections={sections} | ||
| quantile={quantile} | ||
| /> | ||
| </div> | ||
| ))} | ||
| </div> | ||
| )} | ||
| </PopoverWithTrigger> | ||
| ); | ||
|
|
||
| type ColorRangePreviewProps = { | ||
| colors: ColorString[], | ||
| sections?: number, | ||
| quantile?: boolean, | ||
| className?: string, | ||
| }; | ||
|
|
||
| export const ColorRangePreview = ({ | ||
| colors = [], | ||
| sections = 5, | ||
| quantile = false, | ||
| className, | ||
| ...props | ||
| }: ColorRangePreviewProps) => { | ||
| const scale = getColorScale([0, sections - 1], colors, quantile); | ||
| return ( | ||
| <div className={cx(className, "flex")} {...props}> | ||
| {d3 | ||
| .range(0, sections) | ||
| .map(value => ( | ||
| <div className="flex-full" style={{ background: scale(value) }} /> | ||
| ))} | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default ColorRangePicker; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.