Skip to content

Commit bc8b9b3

Browse files
committed
Cleanup
Added some margin between cards on Application page Removed errant console logs Changed bg color of ECR instruction modal
1 parent 69a8df4 commit bc8b9b3

File tree

6 files changed

+106
-83
lines changed

6 files changed

+106
-83
lines changed

client/web/src/components/ECRInstructions/index.js

Lines changed: 28 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -39,53 +39,61 @@ export default function ECRInstructions(props) {
3939
{children}
4040
</a>
4141
<Modal size="lg" fade={true} isOpen={!!showModal}>
42-
<ModalHeader toggle={toggleModal} className="bg-primary">
42+
<ModalHeader toggle={toggleModal} className="bg-secondary">
4343
Push commands for ECR repository
4444
</ModalHeader>
4545
<ModalBody>
4646
<p>
47-
Make sure that you have the latest version of the AWS CLI and Docker installed. For more
48-
information, see Getting Started with Amazon ECR.
47+
Make sure that you have the latest version of the AWS CLI and Docker
48+
installed. For more information, see Getting Started with Amazon
49+
ECR.
4950
</p>
5051
<p>
51-
Use the following steps to authenticate and push an image to your repository. For
52-
additional registry authentication methods, including the Amazon ECR credential helper,
53-
see Registry Authentication.
52+
Use the following steps to authenticate and push an image to your
53+
repository. For additional registry authentication methods,
54+
including the Amazon ECR credential helper, see Registry
55+
Authentication.
5456
</p>
5557
<div>
5658
<ol>
5759
<li>
58-
Retrieve an authentication token and authenticate your Docker client to your
59-
registry. Use the AWS CLI:
60+
Retrieve an authentication token and authenticate your Docker
61+
client to your registry. Use the AWS CLI:
6062
<div className="text-monospace bg-gray-200 mt-3 mb-3 p-2">
61-
aws ecr get-login-password --region {awsRegion} | docker login --username AWS
62-
--password-stdin {awsAccount}.dkr.ecr.{awsRegion}.amazonaws.com
63+
aws ecr get-login-password --region {awsRegion} | docker login
64+
--username AWS --password-stdin {awsAccount}.dkr.ecr.
65+
{awsRegion}.amazonaws.com
6366
</div>
6467
<div className="text-muted">
65-
Note: If you receive an error using the AWS CLI, make sure that you have the
66-
latest version of the AWS CLI and Docker installed.
68+
Note: If you receive an error using the AWS CLI, make sure
69+
that you have the latest version of the AWS CLI and Docker
70+
installed.
6771
</div>
6872
</li>
6973
<li>
70-
Build your Docker image using the following command. For information on building a
71-
Docker file from scratch see the instructions here . You can skip this step if your
72-
image is already built:{' '}
74+
Build your Docker image using the following command. For
75+
information on building a Docker file from scratch see the
76+
instructions here . You can skip this step if your image is
77+
already built:{' '}
7378
<div className="text-monospace bg-gray-200 mt-3 mb-3 p-2">
7479
docker build -t saas-boost .
7580
</div>
7681
</li>
7782
<li>
78-
After the build completes, tag your image so you can push the image to this
79-
repository:{' '}
83+
After the build completes, tag your image so you can push the
84+
image to this repository:{' '}
8085
<div className="text-monospace bg-gray-200 mt-3 mb-3 p-2">
81-
docker tag saas-boost:latest {awsAccount}.dkr.ecr.{awsRegion}.amazonaws.com/
86+
docker tag saas-boost:latest {awsAccount}.dkr.ecr.{awsRegion}
87+
.amazonaws.com/
8288
{ecrRepo}:latest
8389
</div>
8490
</li>
8591
<li>
86-
Run the following command to push this image to your newly created AWS repository:{' '}
92+
Run the following command to push this image to your newly
93+
created AWS repository:{' '}
8794
<div className="text-monospace bg-gray-200 mt-3 mb-3 p-2">
88-
docker push {awsAccount}.dkr.ecr.{awsRegion}.amazonaws.com/{ecrRepo}:latest
95+
docker push {awsAccount}.dkr.ecr.{awsRegion}.amazonaws.com/
96+
{ecrRepo}:latest
8997
</div>
9098
</li>
9199
</ol>

client/web/src/settings/AppSettingsSubform.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,14 +23,19 @@ export default class AppSettingsSubform extends React.Component {
2323
render() {
2424
return (
2525
<Fragment>
26-
<Row>
26+
<Row className="mb-3">
2727
<Col lg={12} sm={12}>
2828
<Card>
2929
<CardHeader>Application</CardHeader>
3030
<CardBody>
3131
<Row>
3232
<Col xs={6}>
33-
<SaasBoostInput key="name" label="Name" name="name" type="text" />
33+
<SaasBoostInput
34+
key="name"
35+
label="Name"
36+
name="name"
37+
type="text"
38+
/>
3439
</Col>
3540
<Col xs={6}>
3641
<SaasBoostInput

client/web/src/settings/ApplicationComponent.js

Lines changed: 64 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -195,54 +195,59 @@ export function ApplicationComponent(props) {
195195

196196
// min, max, computeSize, cpu/memory/instanceType (not in form), filesystem, database
197197
const singleTierValidationSpec = (tombstone, operatingSystem) => {
198-
let filesystemSpec = (operatingSystem === LINUX) ? Yup.object({ // LINUX, so EFS
199-
mountPoint: Yup.string()
200-
.matches(/^(\/[a-zA-Z._-]+)*$/, 'Invalid path. Ex: /mnt')
201-
.max(100, "The full path can't exceed 100 characters in length")
202-
.test(
203-
'subdirectories',
204-
'The path can only include up to four subdirectories',
205-
(val) => (val?.match(/\//g) || []).length <= 4
206-
)
207-
.required(),
208-
fsx: Yup.object().nullable(),
209-
efs: Yup.object({
210-
encryptAtRest: Yup.bool(),
211-
lifecycle: Yup.number().required('Lifecycle is required'),
212-
filesystemLifecycle: Yup.string(),
213-
})
214-
}) : Yup.object({ // not LINUX, so FSX
215-
mountPoint: Yup.string()
216-
.matches(
217-
/^[a-zA-Z]:\\(((?![<>:"/\\|?*]).)+((?<![ .])\\)?)*$/,
218-
'Invalid path. Ex: C:\\data'
219-
)
220-
.required(),
221-
fsx: Yup.object({
222-
storageGb: Yup.number()
223-
.required()
224-
.min(32, 'Storage minimum is 32 GB')
225-
.max(1048, 'Storage maximum is 1048 GB'),
226-
throughputMbs: Yup.number()
227-
.required()
228-
.min(8, 'Throughput minimum is 8 MB/s')
229-
.max(2048, 'Throughput maximum is 2048 MB/s'),
230-
backupRetentionDays: Yup.number()
231-
.required()
232-
.min(7, 'Minimum retention time is 7 days')
233-
.max(35, 'Maximum retention time is 35 days'),
234-
dailyBackupTime: Yup.string().required(
235-
'Daily backup time is required'
236-
),
237-
weeklyMaintenanceTime: Yup.string().required(
238-
'Weekly maintenance time is required'
239-
),
240-
windowsMountDrive: Yup.string().required(
241-
'Windows mount drive is required'
242-
),
243-
}),
244-
efs: Yup.object().nullable()
245-
})
198+
let filesystemSpec =
199+
operatingSystem === LINUX
200+
? Yup.object({
201+
// LINUX, so EFS
202+
mountPoint: Yup.string()
203+
.matches(/^(\/[a-zA-Z._-]+)*$/, 'Invalid path. Ex: /mnt')
204+
.max(100, "The full path can't exceed 100 characters in length")
205+
.test(
206+
'subdirectories',
207+
'The path can only include up to four subdirectories',
208+
(val) => (val?.match(/\//g) || []).length <= 4
209+
)
210+
.required(),
211+
fsx: Yup.object().nullable(),
212+
efs: Yup.object({
213+
encryptAtRest: Yup.bool(),
214+
lifecycle: Yup.number().required('Lifecycle is required'),
215+
filesystemLifecycle: Yup.string(),
216+
}),
217+
})
218+
: Yup.object({
219+
// not LINUX, so FSX
220+
mountPoint: Yup.string()
221+
.matches(
222+
/^[a-zA-Z]:\\(((?![<>:"/\\|?*]).)+((?<![ .])\\)?)*$/,
223+
'Invalid path. Ex: C:\\data'
224+
)
225+
.required(),
226+
fsx: Yup.object({
227+
storageGb: Yup.number()
228+
.required()
229+
.min(32, 'Storage minimum is 32 GB')
230+
.max(1048, 'Storage maximum is 1048 GB'),
231+
throughputMbs: Yup.number()
232+
.required()
233+
.min(8, 'Throughput minimum is 8 MB/s')
234+
.max(2048, 'Throughput maximum is 2048 MB/s'),
235+
backupRetentionDays: Yup.number()
236+
.required()
237+
.min(7, 'Minimum retention time is 7 days')
238+
.max(35, 'Maximum retention time is 35 days'),
239+
dailyBackupTime: Yup.string().required(
240+
'Daily backup time is required'
241+
),
242+
weeklyMaintenanceTime: Yup.string().required(
243+
'Weekly maintenance time is required'
244+
),
245+
windowsMountDrive: Yup.string().required(
246+
'Windows mount drive is required'
247+
),
248+
}),
249+
efs: Yup.object().nullable(),
250+
})
246251
return Yup.object({
247252
min: requiredIfNotTombstoned(
248253
tombstone,
@@ -363,9 +368,12 @@ export function ApplicationComponent(props) {
363368
}),
364369
provisionDb: Yup.boolean(),
365370
provisionFS: Yup.boolean(),
366-
tiers: Yup.object().when(['tombstone', 'operatingSystem'], (tombstone, operatingSystem, schema) => {
367-
return allTiersValidationSpec(tombstone, operatingSystem)
368-
}),
371+
tiers: Yup.object().when(
372+
['tombstone', 'operatingSystem'],
373+
(tombstone, operatingSystem, schema) => {
374+
return allTiersValidationSpec(tombstone, operatingSystem)
375+
}
376+
),
369377
tombstone: Yup.boolean(),
370378
})
371379
).min(1, 'Application must have at least ${min} service(s).'),
@@ -436,9 +444,11 @@ export function ApplicationComponent(props) {
436444
{(formik) => {
437445
return (
438446
<>
439-
{!!formik.errors && Object.keys(formik.errors).length > 0 ?
440-
(<Alert color="danger">Errors in {findServicesWithErrors(formik)}</Alert>) : null
441-
}
447+
{!!formik.errors && Object.keys(formik.errors).length > 0 ? (
448+
<Alert color="danger">
449+
Errors in {findServicesWithErrors(formik)}
450+
</Alert>
451+
) : null}
442452
<Form>
443453
<AppSettingsSubform
444454
isLocked={hasTenants}

client/web/src/settings/BillingSubform.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export default function BillingSubform(props) {
2626
const { provisionBilling = false } = props
2727
return (
2828
<>
29-
<Row>
29+
<Row className="mb-3">
3030
<Col xs={12}>
3131
<Card>
3232
<CardHeader>Billing</CardHeader>

client/web/src/settings/ServicesComponent.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,10 +53,9 @@ const ServicesComponent = (props) => {
5353
// kick off validation so the schema recognizes the tombstone and clears any pending errors
5454
formik.validateForm()
5555
}
56-
5756
return (
5857
<>
59-
<Card>
58+
<Card className="mb-3">
6059
<Card.Header>
6160
<Row>
6261
<Col className="d-flex align-items-center">Services</Col>
@@ -68,7 +67,7 @@ const ServicesComponent = (props) => {
6867
</Row>
6968
</Card.Header>
7069
<Card.Body>
71-
<Accordion defaultActiveKey="0">
70+
<Accordion>
7271
{services.map(
7372
(service, index) =>
7473
!service.tombstone && (

client/web/src/tier/api/index.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,12 @@ const apiServer = axios.create({
2626
'Content-Type': 'application/json',
2727
},
2828
},
29-
mode: 'cors'
29+
mode: 'cors',
3030
})
3131
const CancelToken = axios.CancelToken
3232
const source = CancelToken.source()
3333

3434
apiServer.interceptors.request.use(async (r) => {
35-
console.log(r)
3635
//Obtain and pass along Authorization token
3736
const authorizationToken = await fetchAccessToken()
3837
r.headers.Authorization = authorizationToken
@@ -89,7 +88,9 @@ const tierAPI = {
8988
const { signal } = ops
9089

9190
try {
92-
const response = await apiServer.put(`/${tierData.id}`, tierData, { signal })
91+
const response = await apiServer.put(`/${tierData.id}`, tierData, {
92+
signal,
93+
})
9394
const responseJSON = await handleErrorResponse(response)
9495
return responseJSON
9596
} catch (err) {

0 commit comments

Comments
 (0)