Skip to content

Commit

Permalink
hide generate support bundle cli command for embedded cluster (#4647)
Browse files Browse the repository at this point in the history
  • Loading branch information
@miaawong
miaawong authored May 31, 2024
1 parent 187d483 commit 0209a52
Show file tree
Hide file tree
Showing 4 changed files with 110 additions and 80 deletions.
22 changes: 20 additions & 2 deletions web/src/Root.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -768,8 +768,26 @@ const Root = () => {
<TroubleshootContainer />
}
>
<Route index element={<SupportBundleList />} />
<Route path="generate" element={<GenerateSupportBundle />} />
<Route
index
element={
<SupportBundleList
isEmbeddedClusterEnabled={Boolean(
state.adminConsoleMetadata?.isEmbeddedCluster
)}
/>
}
/>
<Route
path="generate"
element={
<GenerateSupportBundle
isEmbeddedClusterEnabled={Boolean(
state.adminConsoleMetadata?.isEmbeddedCluster
)}
/>
}
/>
<Route
path="analyze/:bundleSlug"
element={<SupportBundleAnalysis />}
Expand Down
22 changes: 12 additions & 10 deletions web/src/components/troubleshoot/GenerateSupportBundle.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -449,16 +449,18 @@ class GenerateSupportBundle extends Component {
</div>
</div>
) : (
<div className="u-marginTop--15 u-fontSize--normal">
If you'd prefer,{" "}
<a
href="#"
onClick={(e) => this.fetchSupportBundleCommand()}
>
click here
</a>{" "}
to get a command to manually generate a support bundle.
</div>
!this.props.isEmbeddedClusterEnabled && (
<div className="u-marginTop--15 u-fontSize--normal">
If you'd prefer,{" "}
<a
href="#"
onClick={(e) => this.fetchSupportBundleCommand()}
>
click here
</a>{" "}
to get a command to manually generate a support bundle.
</div>
)
)}
</div>
</div>
Expand Down
143 changes: 75 additions & 68 deletions web/src/components/troubleshoot/GenerateSupportBundleModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ type Props = {
toggleModal: () => void;
selectedApp: App | null;
updateBundleSlug: (value: string) => void;
isEmbeddedClusterEnabled: boolean;
};

type State = {
Expand All @@ -36,8 +37,8 @@ type State = {
const GenerateSupportBundleModal = ({
isOpen,
toggleModal,

updateBundleSlug,
isEmbeddedClusterEnabled,
}: Props) => {
const [state, setState] = useReducer(
(currentState: State, newState: Partial<State>) => ({
Expand Down Expand Up @@ -347,80 +348,86 @@ const GenerateSupportBundleModal = ({
</div>
</div>
) : (
<div className="u-marginTop--15">
<span className="u-fontSize--normal">
Or{" "}
<a href="#" onClick={toggleShowGetBundleSpec}>
click here
</a>{" "}
to get a command to manually generate a support bundle. This is
useful if the admin console is inaccessible.
</span>
</div>
!isEmbeddedClusterEnabled && (
<div className="u-marginTop--15">
<span className="u-fontSize--normal">
Or{" "}
<a href="#" onClick={toggleShowGetBundleSpec}>
click here
</a>{" "}
to get a command to manually generate a support bundle. This is
useful if the admin console is inaccessible.
</span>
</div>
)
)}

<div
className={`u-marginTop--30 FileUpload-wrapper ${
hasFile ? "has-file" : ""
}`}
>
{state.uploadBundleErrMsg && (
<p className="u-textColor--error u-fontSize--normal u-fontWeight--medium u-lineHeight--normal u-marginBottom--10">
{state.uploadBundleErrMsg}
</p>
)}
<Dropzone
className="Dropzone-wrapper"
accept="application/gzip, .gz"
onDropAccepted={onDrop}
multiple={false}
{!isEmbeddedClusterEnabled && (
<div
className={`u-marginTop--30 FileUpload-wrapper ${
hasFile ? "has-file" : ""
}`}
>
{!hasFile && (
<div className="u-textAlign--center">
<Icon
icon="yaml-icon"
size={40}
className="u-marginBottom--10 gray-color"
/>
<p className="u-fontSize--normal u-textColor--secondary u-fontWeight--medium u-lineHeight--normal">
Drag your bundle here or{" "}
<span className="u-linkColor u-fontWeight--medium u-textDecoration--underlineOnHover">
choose a file to upload
</span>
</p>
</div>
{state.uploadBundleErrMsg && (
<p className="u-textColor--error u-fontSize--normal u-fontWeight--medium u-lineHeight--normal u-marginBottom--10">
{state.uploadBundleErrMsg}
</p>
)}
</Dropzone>
{hasFile && (
<div
className="flex flexDirection--column justifyContent--spaceBetween"
style={{ gap: "15px" }}
<Dropzone
className="Dropzone-wrapper"
accept="application/gzip, .gz"
onDropAccepted={onDrop}
multiple={false}
>
<div className={`${hasFile ? "has-file-border" : ""}`}>
<p className="u-fontSize--normal u-fontWeight--medium ">
{state.supportBundleFile?.name}
</p>
</div>
{!hasFile && (
<div className="u-textAlign--center">
<Icon
icon="yaml-icon"
size={40}
className="u-marginBottom--10 gray-color"
/>
<p className="u-fontSize--normal u-textColor--secondary u-fontWeight--medium u-lineHeight--normal">
Drag your bundle here or{" "}
<span className="u-linkColor u-fontWeight--medium u-textDecoration--underlineOnHover">
choose a file to upload
</span>
</p>
</div>
)}
</Dropzone>
{hasFile && (
<div
className="flex flexDirection--column justifyContent--spaceBetween"
style={{ gap: "15px" }}
>
<div className={`${hasFile ? "has-file-border" : ""}`}>
<p className="u-fontSize--normal u-fontWeight--medium ">
{state.supportBundleFile?.name}
</p>
</div>

<div className="flex flex-column justifyContent--center">
<button
type="button"
className="btn secondary blue nowrap"
onClick={uploadAndAnalyze}
disabled={state.fileUploading || !hasFile}
>
{state.fileUploading ? "Uploading" : "Upload support bundle"}
</button>
<span
className="replicated-link u-fontSize--small u-marginTop--10 u-textAlign--center"
onClick={clearFile}
>
Select a different file
</span>
<div className="flex flex-column justifyContent--center">
<button
type="button"
className="btn secondary blue nowrap"
onClick={uploadAndAnalyze}
disabled={state.fileUploading || !hasFile}
>
{state.fileUploading
? "Uploading"
: "Upload support bundle"}
</button>
<span
className="replicated-link u-fontSize--small u-marginTop--10 u-textAlign--center"
onClick={clearFile}
>
Select a different file
</span>
</div>
</div>
</div>
)}
</div>
)}
</div>
)}

<div className="flex u-marginTop--30">
<button className="btn primary" onClick={toggleModal}>
Expand Down
3 changes: 3 additions & 0 deletions web/src/components/troubleshoot/SupportBundleList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ type Props = {
updateBundleSlug: (slug: string) => void;
updateState: (value: Object) => void;
watch: App | null;
isEmbeddedClusterEnabled: boolean;
};

type State = {
Expand Down Expand Up @@ -278,6 +279,7 @@ export const SupportBundleList = (props: Props) => {
pollForBundleAnalysisProgress={
outletContext.pollForBundleAnalysisProgress
}
isEmbeddedClusterEnabled={props.isEmbeddedClusterEnabled}
/>
);
}
Expand Down Expand Up @@ -376,6 +378,7 @@ export const SupportBundleList = (props: Props) => {
toggleModal={toggleGenerateBundleModal}
selectedApp={selectedApp}
updateBundleSlug={outletContext.updateBundleSlug}
isEmbeddedClusterEnabled={props.isEmbeddedClusterEnabled}
/>
</div>

Expand Down

0 comments on commit 0209a52

Please sign in to comment.