random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-12-22 10:21:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Upgrade Fluent UI v8 (#688)

Browse Source 
Co-authored-by: Steve Faulkner <southpolesteve@gmail.com>
This commit is contained in:
Hardikkumar Nai
2021-05-06 04:56:03 +05:30
committed by GitHub
parent bd47e5ed49
commit 23223cfb23
126 changed files with 5586 additions and 5870 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/Explorer/Panes/Tables/AddTableEntityPanel.tsx
View File

@@ -1,14 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import {
IDropdownOption,
Image,
IPanelProps,
IRenderFunction,
Label,
Stack,
Text,
TextField,
} from "office-ui-fabric-react";
import { IDropdownOption, Image, IPanelProps, IRenderFunction, Label, Stack, Text, TextField } from "@fluentui/react";
import { useBoolean } from "@fluentui/react-hooks";
import React, { FunctionComponent, useEffect, useState } from "react";
import * as _ from "underscore";
import AddPropertyIcon from "../../../../images/Add-property.svg";

13
src/Explorer/Panes/Tables/EditTableEntityPanel.tsx
View File

@@ -1,14 +1,5 @@
import { useBoolean } from "@uifabric/react-hooks";
import {
IDropdownOption,
Image,
IPanelProps,
IRenderFunction,
Label,
Stack,
Text,
TextField,
} from "office-ui-fabric-react";
import { IDropdownOption, Image, IPanelProps, IRenderFunction, Label, Stack, Text, TextField } from "@fluentui/react";
import { useBoolean } from "@fluentui/react-hooks";
import React, { FunctionComponent, useEffect, useState } from "react";
import * as _ from "underscore";
import AddPropertyIcon from "../../../../images/Add-property.svg";

121
src/Explorer/Panes/Tables/TableQuerySelectPanel/__snapshots__/index.test.tsx.snap
View File

@@ -518,7 +518,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -781,6 +780,35 @@ exports[`Table query select Panel should render Default properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"textContainer": Object {
"display": "block",
"flexGrow": 1,
@@ -1066,7 +1094,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<button
aria-label="Close pane"
className="ms-Button ms-Button--icon closePaneBtn root-72"
className="ms-Button ms-Button--icon closePaneBtn root-53"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -1079,18 +1107,17 @@ exports[`Table query select Panel should render Default properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-73"
className="ms-Button-flexContainer flexContainer-54"
data-automationid="splitbuttonprimary"
>
<Component
className="ms-Button-icon icon-75"
className="ms-Button-icon icon-56"
iconName="Cancel"
>
<i
aria-hidden={true}
className="ms-Icon root-37 css-80 ms-Button-icon icon-75"
className="ms-Icon root-37 css-61 ms-Button-icon icon-56"
data-icon-name="Cancel"
role="presentation"
style={
Object {
"fontFamily": "\\"FabricMDL2Icons\\"",
@@ -1148,7 +1175,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<Text>
<span
className="css-81"
className="css-62"
>
Select the columns that you want to query.
</span>
@@ -1163,7 +1190,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
onChange={[Function]}
>
<CheckboxBase
boxSide="start"
checked={true}
id="availableCheckbox"
label="Available Columns"
@@ -1444,33 +1470,32 @@ exports[`Table query select Panel should render Default properly 1`] = `
}
>
<div
className="ms-Checkbox is-checked is-enabled root-82"
className="ms-Checkbox is-checked is-enabled root-63"
>
<Component />
<input
aria-checked="true"
aria-label="Available Columns"
checked={true}
className="input-83"
className="input-64"
data-ktp-execute-target={true}
id="availableCheckbox"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
type="checkbox"
/>
<label
className="ms-Checkbox-label label-84"
className="ms-Checkbox-label label-65"
htmlFor="availableCheckbox"
>
<div
className="ms-Checkbox-checkbox checkbox-85"
className="ms-Checkbox-checkbox checkbox-66"
data-ktp-target={true}
>
<StyledIconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
>
<IconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
styles={[Function]}
theme={
@@ -1749,7 +1774,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<i
aria-hidden={true}
className="ms-Checkbox-checkmark checkmark-88"
className="ms-Checkbox-checkmark checkmark-69"
data-icon-name="CheckMark"
>
@@ -1759,7 +1784,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
</div>
<span
aria-hidden="true"
className="ms-Checkbox-text text-87"
className="ms-Checkbox-text text-68"
>
Available Columns
</span>
@@ -1775,7 +1800,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
onChange={[Function]}
>
<CheckboxBase
boxSide="start"
checked={true}
disabled={false}
label=""
@@ -2056,35 +2080,34 @@ exports[`Table query select Panel should render Default properly 1`] = `
}
>
<div
className="ms-Checkbox is-checked is-enabled root-82"
className="ms-Checkbox is-checked is-enabled root-63"
>
<Component />
<input
aria-checked="true"
aria-disabled={false}
aria-label=""
checked={true}
className="input-83"
className="input-64"
data-ktp-execute-target={true}
disabled={false}
id="checkbox-3"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
type="checkbox"
/>
<label
className="ms-Checkbox-label label-84"
className="ms-Checkbox-label label-65"
htmlFor="checkbox-3"
>
<div
className="ms-Checkbox-checkbox checkbox-85"
className="ms-Checkbox-checkbox checkbox-66"
data-ktp-target={true}
>
<StyledIconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
>
<IconBase
className="ms-Checkbox-checkmark checkmark-86"
className="ms-Checkbox-checkmark checkmark-67"
iconName="CheckMark"
styles={[Function]}
theme={
@@ -2363,7 +2386,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<i
aria-hidden={true}
className="ms-Checkbox-checkmark checkmark-88"
className="ms-Checkbox-checkmark checkmark-69"
data-icon-name="CheckMark"
>
@@ -3451,7 +3474,6 @@ exports[`Table query select Panel should render Default properly 1`] = `
"borderColor": "#f3f2f1",
"color": "#a19f9d",
"cursor": "default",
"pointerEvents": "none",
"selectors": Object {
":focus": Object {
"outline": 0,
@@ -3798,6 +3820,35 @@ exports[`Table query select Panel should render Default properly 1`] = `
},
},
},
"splitButtonMenuFocused": Object {
"outline": "transparent",
"position": "relative",
"selectors": Object {
".ms-Fabric--isFocusVisible &:focus:after": Object {
"border": "1px solid #ffffff",
"bottom": 3,
"content": "\\"\\"",
"left": 3,
"outline": "1px solid #605e5c",
"position": "absolute",
"right": 3,
"selectors": Object {
"@media screen and (-ms-high-contrast: active), (forced-colors: active)": Object {
"border": "none",
"bottom": -2,
"left": -2,
"right": -2,
"top": -2,
},
},
"top": 3,
"zIndex": 1,
},
"::-moz-focus-inner": Object {
"border": "0",
},
},
},
"splitButtonMenuIcon": Object {
"color": "#ffffff",
},
@@ -4095,7 +4146,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
>
<button
aria-label="Submit"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-95"
className="ms-Button ms-Button--primary genericPaneSubmitBtn root-76"
data-is-focusable={true}
onClick={[Function]}
onKeyDown={[Function]}
@@ -4113,14 +4164,14 @@ exports[`Table query select Panel should render Default properly 1`] = `
type="button"
>
<span
className="ms-Button-flexContainer flexContainer-73"
className="ms-Button-flexContainer flexContainer-54"
data-automationid="splitbuttonprimary"
>
<span
className="ms-Button-textContainer textContainer-74"
className="ms-Button-textContainer textContainer-55"
>
<span
className="ms-Button-label label-96"
className="ms-Button-label label-77"
id="id__4"
key="id__4"
>

2
src/Explorer/Panes/Tables/TableQuerySelectPanel/index.tsx
View File

@@ -1,4 +1,4 @@
import { Checkbox, Text } from "office-ui-fabric-react";
import { Checkbox, Text } from "@fluentui/react";
import React, { FunctionComponent, useEffect, useState } from "react";
import { userContext } from "../../../../UserContext";
import Explorer from "../../../Explorer";

2
src/Explorer/Panes/Tables/Validators/EntityTableHelper.tsx
View File

@@ -1,4 +1,4 @@
import { IImageProps, IStackProps } from "office-ui-fabric-react";
import { IImageProps, IStackProps } from "@fluentui/react";
import * as _ from "underscore";
import * as TableConstants from "../../../Tables/Constants";
import * as Entities from "../../../Tables/Entities";

4223
src/Explorer/Panes/Tables/__snapshots__/AddTableEntityPanel.test.tsx.snap
View File

File diff suppressed because it is too large Load Diff

4223
src/Explorer/Panes/Tables/__snapshots__/EditTableEntityPanel.test.tsx.snap
View File

File diff suppressed because it is too large Load Diff