Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

mTLS warning on Traffic Permissions #38

Merged
merged 3 commits into from
Jun 28, 2020
Merged

mTLS warning on Traffic Permissions #38

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
84eacea
added a warning to the top of the Traffic Permissions view that alert…
Jun 19, 2020
53de870
added mtls information to the default mesh in the mocks so that we ca…
Jun 22, 2020
ce502e8
move all mTLS content in the warning to one line instead of 2.
Jun 22, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .env.development
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
NODE_ENV=development
VUE_APP_MOCK_API_ENABLED=true
VUE_APP_MOCK_API_ENABLED=false
VUE_APP_KUMA_CONFIG=/dev-api-config.json
1 change: 1 addition & 0 deletions src/components/Skeletons/YamlView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,7 @@ export default {
delete sourceObj.type
delete sourceObj.name

newObj.apiVersion = 'kuma.io/v1alpha1'
newObj.kind = type
newObj.metadata = {
name: name
Expand Down
206 changes: 121 additions & 85 deletions src/services/mock.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,84 +19,120 @@ export default class Mock {
'background: gray; color: white; display: block; padding: 0.25rem;')

this.mock
// .onGet('/meshes').reply(200, {
// total: 3,
// items: [
// {
// mtls: {
// ca: {
// builtin: {}
// }
// },
// name: 'default',
// type: 'Mesh'
// },
// {
// mtls: {
// ca: {
// builtin: {}
// }
// },
// name: 'mesh-01',
// type: 'Mesh'
// },
// {
// mtls: {
// ca: {
// builtin: {}
// }
// },
// name: 'kong-mania-12',
// type: 'Mesh'
// },
// {
// mtls: {
// ca: {
// builtin: {}
// }
// },
// name: 'hello-world',
// type: 'Mesh'
// }
// ],
// next: null
// })
// .onGet('/meshes/default').reply(200, {
// type: 'Mesh',
// name: 'default',
// mtls: {
// ca: {
// builtin: {}
// }
// }
// })
// .onGet('/meshes/mesh-01').reply(200, {
// type: 'Mesh',
// name: 'mesh-01',
// mtls: {
// ca: {
// builtin: {}
// }
// }
// })
// .onGet('/meshes/kong-mania-12').reply(200, {
// type: 'Mesh',
// name: 'kong-mania-12',
// mtls: {
// ca: {
// builtin: {}
// }
// }
// })
// .onGet('/meshes/hello-world').reply(200, {
// type: 'Mesh',
// name: 'hello-world',
// mtls: {
// ca: {
// builtin: {}
// }
// }
// })
.onGet('/meshes').reply(200, {
total: 3,
items: [
{
name: 'default',
type: 'Mesh'
},
{
name: 'mesh-01',
type: 'Mesh',
mtls: {
enabledBackend: 'ca-1',
backends: [
{
name: 'ca-1',
type: 'provided',
dpCert: {
rotation: {
expiration: '1d'
}
},
conf: {
cert: {
secret: 'name-of-secret'
},
key: {
secret: 'name-of-secret'
}
}
}
]
}
},
{
name: 'kong-mania-12',
type: 'Mesh'
},
{
name: 'hello-world',
type: 'Mesh'
}
],
next: null
})
.onGet('/meshes/default').reply(200, {
type: 'Mesh',
name: 'default'
// mtls: {
// enabledBackend: 'ca-1',
// backends: [
// {
// name: 'ca-1',
// type: 'provided',
// dpCert: {
// rotation: {
// expiration: '1d'
// }
// },
// conf: {
// cert: {
// secret: 'name-of-secret'
// },
// key: {
// secret: 'name-of-secret'
// }
// }
// }
// ]
// }
})
.onGet('/meshes/mesh-01').reply(200, {
type: 'Mesh',
name: 'mesh-01',
mtls: {
enabledBackend: 'ca-1',
backends: [
{
name: 'ca-1',
type: 'provided',
dpCert: {
rotation: {
expiration: '1d'
}
},
conf: {
cert: {
secret: 'name-of-secret'
},
key: {
secret: 'name-of-secret'
}
}
}
]
}
})
.onGet('/meshes/kong-mania-12').reply(200, {
type: 'Mesh',
name: 'kong-mania-12',
mtls: {
ca: {
builtin: {}
}
}
})
.onGet('/meshes/hello-world').reply(200, {
type: 'Mesh',
name: 'hello-world',
mtls: {
ca: {
builtin: {}
}
}
})
.onGet('/meshes/default/dataplanes').reply(200, {
total: 2,
items: [
Expand Down Expand Up @@ -1560,12 +1596,12 @@ export default class Mock {
}
]
})
.onGet('/meshes/default/traffic-permissions').reply(200, {
.onGet('/meshes/mesh-01/traffic-permissions').reply(200, {
total: 3,
items: [
{
type: 'TrafficPermission',
mesh: 'default',
mesh: 'mesh-01',
name: 'tp-1',
sources: [
{
Expand All @@ -1584,7 +1620,7 @@ export default class Mock {
},
{
type: 'TrafficPermission',
mesh: 'default',
mesh: 'mesh-01',
name: 'tp-1234',
sources: [
{
Expand All @@ -1603,7 +1639,7 @@ export default class Mock {
},
{
type: 'TrafficPermission',
mesh: 'default',
mesh: 'mesh-01',
name: 'tp-alpha-tango-donut',
sources: [
{
Expand All @@ -1622,7 +1658,7 @@ export default class Mock {
}
]
})
.onGet('/meshes/default/traffic-permissions/tp-1').reply(200, {
.onGet('/meshes/mesh-01/traffic-permissions/tp-1').reply(200, {
type: 'TrafficPermission',
mesh: 'mesh-1',
name: 'tp-1',
Expand All @@ -1643,7 +1679,7 @@ export default class Mock {
}
]
})
.onGet('/meshes/default/traffic-permissions/tp-1234').reply(200, {
.onGet('/meshes/mesh-01/traffic-permissions/tp-1234').reply(200, {
type: 'TrafficPermission',
mesh: 'mesh-1',
name: 'tp-1234',
Expand All @@ -1664,7 +1700,7 @@ export default class Mock {
}
]
})
.onGet('/meshes/default/traffic-permissions/tp-alpha-tango-donut').reply(200, {
.onGet('/meshes/mesh-01/traffic-permissions/tp-alpha-tango-donut').reply(200, {
type: 'TrafficPermission',
mesh: 'mesh-1',
name: 'tp-alpha-tango-donut',
Expand Down
47 changes: 45 additions & 2 deletions src/views/Policies/TrafficPermissions.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,24 @@
<template>
<div class="traffic-permissions">
<div
v-if="securityWarning"
class="alert-wrapper"
>
<KAlert appearance="warning">
<template slot="alertMessage">
<div class="alert-content">
<p>
<strong>All traffic is allowed:</strong> All service traffic is
enabled on this Mesh by default because Mutual TLS is not enabled.
Traffic Permissions are currently being ignored by the
<strong>{{ $route.params.mesh }}</strong> Mesh because Mutual TLS
is not enabled. You can still create and edit Traffic Permissions,
but they will go into effect only when Mutual TLS is enabled on the Mesh.
</p>
</div>
</template>
</KAlert>
</div>
<FrameSkeleton>
<DataOverview
:page-size="pageSize"
Expand Down Expand Up @@ -157,7 +176,8 @@ export default {
pageOffset: null,
next: null,
hasNext: false,
previous: []
previous: [],
securityWarning: false
}
},
computed: {
Expand Down Expand Up @@ -205,6 +225,7 @@ export default {
methods: {
init () {
this.loadData()
this.mtlsWarning()
},
goToPreviousPage () {
this.pageOffset = this.previous.pop()
Expand Down Expand Up @@ -352,10 +373,32 @@ export default {
this.entityIsLoading = false
}, process.env.VUE_APP_DATA_TIMEOUT)
}
},
mtlsWarning () {
const mesh = this.$route.params.mesh
const entityMesh = (mesh !== 'all')
? mesh
: null

if (entityMesh) {
return this.$api.getMesh(entityMesh)
.then(response => {
const { mtls } = response

if (mtls && mtls.enabledBackend && mtls.enabledBackend !== null) {
this.securityWarning = false
} else {
this.securityWarning = true
}
})
}
}
}
}
</script>

<style>
<style lang="scss" scoped>
.alert-wrapper {
margin-bottom: var(--spacing-md);
}
</style>