Skip to content

A
AmendsenProject
Unverified Commit e775cd83 authored by Tamika Tannis's avatar Tamika Tannis Committed by GitHub
Browse files
Options

chore: Update order of table metadata on TableDetailPage (#652) 

* Update metadata order
Signed-off-by: 's avatarTamika Tannis <ttannis@lyft.com>

* Code cleanup
Signed-off-by: 's avatarTamika Tannis <ttannis@lyft.com>

* Lint fix
Signed-off-by: 's avatarTamika Tannis <ttannis@lyft.com>

* Betterer update
Signed-off-by: 's avatarTamika Tannis <ttannis@lyft.com>
parent 8e498147
Hide whitespace changes
Inline Side-by-side
Showing with 44 additions and 28 deletions
amundsen_application/static/.betterer.results
View file @ e775cd83
......@@ -319,8 +319,8 @@ exports[`strict null compilation`] = {
[293, 14, 40, "No overload matches this call.\\n Overload 1 of 3, \'(node: ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>, options?: ShallowRendererProps | undefined): ShallowWrapper<...>\', gave the following error.\\n Argument of type \'Element | null\' is not assignable to parameter of type \'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>\'.\\n Type \'null\' is not assignable to type \'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>\'.\\n Overload 2 of 3, \'(node: ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>, options?: ShallowRendererProps | undefined): ShallowWrapper<...>\', gave the following error.\\n Argument of type \'Element | null\' is not assignable to parameter of type \'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>\'.\\n Type \'null\' is not assignable to type \'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>\'.\\n Overload 3 of 3, \'(node: ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>, options?: ShallowRendererProps | undefined): ShallowWrapper<...>\', gave the following error.\\n Argument of type \'Element | null\' is not assignable to parameter of type \'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>\'.\\n Type \'null\' is not assignable to type \'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>\'.", "1257093057"],
[302, 8, 8, "Type \'null\' is not assignable to type \'ResourceType | undefined\'.", "2131237679"]
],
"js/pages/SearchPage/index.tsx:4000484656": [
[174, 11, 12, "Property \'filterSections\' is missing in type \'{}\' but required in type \'Readonly<Pick<StateFromProps, \\"filterSections\\">>\'.", "250899467"]
"js/pages/SearchPage/index.tsx:3158270092": [
[176, 11, 12, "Property \'filterSections\' is missing in type \'{}\' but required in type \'Readonly<Pick<StateFromProps, \\"filterSections\\">>\'.", "250899467"]
],
"js/pages/TableDetailPage/ColumnList/index.tsx:3163605539": [
[31, 6, 7, "Object is possibly \'undefined\'.", "3718923584"],
......@@ -353,18 +353,18 @@ exports[`strict null compilation`] = {
"js/pages/TableDetailPage/index.spec.tsx:3148704474": [
[32, 4, 8, "Argument of type \'Partial<Location<{} | null | undefined>> | undefined\' is not assignable to parameter of type \'Partial<Location<{} | null | undefined>>\'.\\n Type \'undefined\' is not assignable to type \'Partial<Location<{} | null | undefined>>\'.", "2700611480"]
],
"js/pages/TableDetailPage/index.tsx:1188316820": [
"js/pages/TableDetailPage/index.tsx:2666700431": [
[160, 10, 13, "Type \'null\' is not assignable to type \'((newValue: string, onSuccess?: (() => any) | undefined, onFailure?: (() => any) | undefined) => void) | undefined\'.", "67794331"],
[199, 11, 26, "Type \'{ itemsPerPage: number; source: string; }\' is missing the following properties from type \'Readonly<Pick<TableDashboardResourceListProps, \\"source\\" | \\"isLoading\\" | \\"dashboards\\" | \\"itemsPerPage\\" | \\"errorText\\"> & OwnProps>\': isLoading, dashboards, errorText", "2224258167"],
[279, 16, 7, "Type \'string | null\' is not assignable to type \'string | undefined\'.\\n Type \'null\' is not assignable to type \'string | undefined\'.", "3817619378"],
[321, 20, 35, "Argument of type \'ProgrammaticDescription[] | undefined\' is not assignable to parameter of type \'ProgrammaticDescription[]\'.\\n Type \'undefined\' is not assignable to type \'ProgrammaticDescription[]\'.", "4249007202"],
[335, 20, 36, "Argument of type \'ProgrammaticDescription[] | undefined\' is not assignable to parameter of type \'ProgrammaticDescription[]\'.\\n Type \'undefined\' is not assignable to type \'ProgrammaticDescription[]\'.", "2770872537"],
[340, 16, 36, "Argument of type \'ProgrammaticDescription[] | undefined\' is not assignable to parameter of type \'ProgrammaticDescription[]\'.\\n Type \'undefined\' is not assignable to type \'ProgrammaticDescription[]\'.", "2776557981"]
[327, 20, 35, "Argument of type \'ProgrammaticDescription[] | undefined\' is not assignable to parameter of type \'ProgrammaticDescription[]\'.\\n Type \'undefined\' is not assignable to type \'ProgrammaticDescription[]\'.", "4249007202"],
[341, 20, 36, "Argument of type \'ProgrammaticDescription[] | undefined\' is not assignable to parameter of type \'ProgrammaticDescription[]\'.\\n Type \'undefined\' is not assignable to type \'ProgrammaticDescription[]\'.", "2770872537"],
[346, 16, 36, "Argument of type \'ProgrammaticDescription[] | undefined\' is not assignable to parameter of type \'ProgrammaticDescription[]\'.\\n Type \'undefined\' is not assignable to type \'ProgrammaticDescription[]\'.", "2776557981"]
],
"js/utils/navigationUtils.ts:1127210474": [
[19, 50, 21, "Type \'undefined\' cannot be used as an index type.", "602535635"]
],
"webpack.common.ts:998025681": [
"webpack.common.ts:545199363": [
[33, 24, 20, "No overload matches this call.\\n Overload 1 of 2, \'(...items: ConcatArray<never>[]): never[]\', gave the following error.\\n Argument of type \'string\' is not assignable to parameter of type \'ConcatArray<never>\'.\\n Overload 2 of 2, \'(...items: ConcatArray<never>[]): never[]\', gave the following error.\\n Argument of type \'string\' is not assignable to parameter of type \'ConcatArray<never>\'.", "806093104"]
]
}`
......
amundsen_application/static/css/_layouts.scss
View file @ e775cd83
......@@ -2,6 +2,7 @@
// SPDX-License-Identifier: Apache-2.0
@import 'variables';
@import 'typography';
$resource-header-height: 84px;
$aside-separation-space: 40px;
......@@ -108,6 +109,8 @@ $screen-lg-container: 1440px;
}
.section-title {
@extend %text-title-w3;
color: $text-tertiary;
margin-bottom: 8px;
}
......
amundsen_application/static/js/pages/TableDetailPage/constants.ts
View file @ e775cd83
export const ERROR_MESSAGE = 'Something went wrong...';
export const EDIT_DESC_TEXT = 'Click to edit description in';
export const DATE_RANGE_TITLE = 'Date Range';
export const DESCRIPTION_TITLE = 'Description';
export const FREQ_USERS_TITLE = 'Frequent Users';
export const LAST_UPDATED_TITLE = 'Last Updated';
export const OWNERS_TITLE = 'Owners';
export const TAG_TITLE = 'Tags';
amundsen_application/static/js/pages/TableDetailPage/index.tsx
View file @ e775cd83
......@@ -58,7 +58,7 @@ import TableReportsDropdown from './ResourceReportsDropdown';
import RequestDescriptionText from './RequestDescriptionText';
import RequestMetadataForm from './RequestMetadataForm';
import { ERROR_MESSAGE, EDIT_DESC_TEXT } from './constants';
import * as Constants from './constants';
import './styles.scss';
......@@ -100,7 +100,7 @@ const ErrorMessage = () => {
return (
<div className="container error-label">
<Breadcrumb />
<label>{ERROR_MESSAGE}</label>
<label>{Constants.ERROR_MESSAGE}</label>
</div>
);
};
......@@ -224,7 +224,7 @@ export class TableDetail extends React.Component<
} else {
const data = tableData;
const editText = data.source
? `${EDIT_DESC_TEXT} ${getDescriptionSourceDisplayName(
? `${Constants.EDIT_DESC_TEXT} ${getDescriptionSourceDisplayName(
data.source.source_type
)}`
: '';
......@@ -274,7 +274,7 @@ export class TableDetail extends React.Component<
<div className="column-layout-1">
<aside className="left-panel">
<EditableSection
title="Description"
title={Constants.DESCRIPTION_TITLE}
readOnly={!data.is_editable}
editText={editText}
editUrl={editUrl}
......@@ -298,15 +298,11 @@ export class TableDetail extends React.Component<
)}
<section className="column-layout-2">
<section className="left-panel">
{!data.is_view && (
<section className="metadata-section">
<div className="section-title title-3">Date Range</div>
<WatermarkLabel watermarks={data.watermarks} />
</section>
)}
{!!data.last_updated_timestamp && (
<section className="metadata-section">
<div className="section-title title-3">Last Updated</div>
<div className="section-title">
{Constants.LAST_UPDATED_TITLE}
</div>
<time className="body-2">
{formatDateTimeShort({
epochTimestamp: data.last_updated_timestamp,
......@@ -314,24 +310,34 @@ export class TableDetail extends React.Component<
</time>
</section>
)}
<section className="metadata-section">
<div className="section-title title-3">Frequent Users</div>
<FrequentUsers readers={data.table_readers} />
</section>
{this.renderProgrammaticDesc(
data.programmatic_descriptions.left
{!data.is_view && (
<section className="metadata-section">
<div className="section-title">
{Constants.DATE_RANGE_TITLE}
</div>
<WatermarkLabel watermarks={data.watermarks} />
</section>
)}
</section>
<section className="right-panel">
<EditableSection title="Tags">
<EditableSection title={Constants.TAG_TITLE}>
<TagInput
resourceType={ResourceType.table}
uriKey={this.props.tableData.key}
/>
</EditableSection>
<EditableSection title="Owners">
{this.renderProgrammaticDesc(
data.programmatic_descriptions.left
)}
</section>
<section className="right-panel">
<EditableSection title={Constants.OWNERS_TITLE}>
<TableOwnerEditor resourceType={ResourceType.table} />
</EditableSection>
<section className="metadata-section">
<div className="section-title">
{Constants.FREQ_USERS_TITLE}
</div>
<FrequentUsers readers={data.table_readers} />
</section>
{this.renderProgrammaticDesc(
data.programmatic_descriptions.right
)}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment