-
Notifications
You must be signed in to change notification settings - Fork 597
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #817 from deepfence/v2-onboarding-docker
Added instructions for docker and minor grammar changes
- Loading branch information
Showing
10 changed files
with
207 additions
and
5 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
73 changes: 73 additions & 0 deletions
73
...d/apps/dashboard/src/features/onboard/components/connectors/hosts/DockerConnectorForm.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,73 @@ | ||
| import cx from 'classnames'; | ||
| import { HiViewGridAdd } from 'react-icons/hi'; | ||
| import { Button, Card, Step, Stepper, Typography } from 'ui-components'; | ||
|
|
||
| import { CopyToClipboardIcon } from '../../../../../components/CopyToClipboardIcon'; | ||
| import { usePageNavigation } from '../../../../../utils/usePageNavigation'; | ||
|
|
||
| export const DockerConnectorForm = () => { | ||
| const { navigate } = usePageNavigation(); | ||
|
|
||
| const code = `docker run -dit --cpus=".2" --name=deepfence-agent --restart on-failure --pid=host --net=host \\ | ||
| --privileged=true -v /sys/kernel/debug:/sys/kernel/debug:rw -v /var/log/fenced \\ | ||
| -v /var/run/docker.sock:/var/run/docker.sock -v /:/fenced/mnt/host/:ro \\ | ||
| -e USER_DEFINED_TAGS="" -e MGMT_CONSOLE_URL="${ | ||
| window.location.host ?? '---CONSOLE-IP---' | ||
| }" -e MGMT_CONSOLE_PORT="443" \\ | ||
| -e DEEPFENCE_KEY="${localStorage.getItem('dfApiKey') ?? '---DEEPFENCE-API-KEY---'}" \\ | ||
| deepfenceio/deepfence_agent_ce:latest`; | ||
|
|
||
| return ( | ||
| <Stepper> | ||
| <Step indicator={<HiViewGridAdd />} title="Connect Docker Container"> | ||
| <div className={`${Typography.size.sm} dark:text-gray-200`}> | ||
| Connect to Docker Container. Find out more information by{' '} | ||
| <a | ||
| href={`https://docs.deepfence.io/threatstryker/docs/sensors/docker/`} | ||
| target="_blank" | ||
| rel="noreferrer" | ||
| className="text-blue-600 dark:text-blue-500 mt-2" | ||
| > | ||
| reading our documentation | ||
| </a> | ||
| . | ||
| </div> | ||
| </Step> | ||
| <Step indicator="1" title="Deploy"> | ||
| <div className={`${Typography.size.sm} dark:text-gray-400`}> | ||
| <p className="mb-2.5"> | ||
| Copy the following commands and paste them into your shell. | ||
| </p> | ||
| <Card className="w-full relative "> | ||
| <pre | ||
| className={cx( | ||
| 'pl-4 pt-4', | ||
| 'h-fit', | ||
| `${Typography.weight.normal} ${Typography.size.xs} `, | ||
| )} | ||
| > | ||
| {code} | ||
| </pre> | ||
| <CopyToClipboardIcon text={code} /> | ||
| </Card> | ||
| <div className="flex flex-col mt-6"> | ||
| <p className={`${Typography.size.xs}`}> | ||
| Note: After successfully run the commands above, your connector will appear | ||
| on MyConnector page, then you can perform scanning. | ||
| </p> | ||
| <Button | ||
| size="xs" | ||
| color="primary" | ||
| className="ml-auto" | ||
| onClick={() => { | ||
| navigate('/onboard/my-connectors'); | ||
| }} | ||
| > | ||
| Go to connectors | ||
| </Button> | ||
| </div> | ||
| </div> | ||
| </Step> | ||
| </Stepper> | ||
| ); | ||
| }; |
73 changes: 73 additions & 0 deletions
73
...nd/apps/dashboard/src/features/onboard/components/connectors/hosts/LinuxConnectorForm.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,73 @@ | ||
| import cx from 'classnames'; | ||
| import { HiViewGridAdd } from 'react-icons/hi'; | ||
| import { Button, Card, Step, Stepper, Typography } from 'ui-components'; | ||
|
|
||
| import { CopyToClipboardIcon } from '../../../../../components/CopyToClipboardIcon'; | ||
| import { usePageNavigation } from '../../../../../utils/usePageNavigation'; | ||
|
|
||
| export const LinuxConnectorForm = () => { | ||
| const { navigate } = usePageNavigation(); | ||
|
|
||
| const code = `docker run -dit --cpus=".2" --name=deepfence-agent --restart on-failure --pid=host --net=host \\ | ||
| --privileged=true -v /sys/kernel/debug:/sys/kernel/debug:rw -v /var/log/fenced \\ | ||
| -v /var/run/docker.sock:/var/run/docker.sock -v /:/fenced/mnt/host/:ro \\ | ||
| -e USER_DEFINED_TAGS="" -e MGMT_CONSOLE_URL="${ | ||
| window.location.host ?? '---CONSOLE-IP---' | ||
| }" -e MGMT_CONSOLE_PORT="443" \\ | ||
| -e DEEPFENCE_KEY="${localStorage.getItem('dfApiKey') ?? '---DEEPFENCE-API-KEY---'}" \\ | ||
| deepfenceio/deepfence_agent_ce:latest`; | ||
|
|
||
| return ( | ||
| <Stepper> | ||
| <Step indicator={<HiViewGridAdd />} title="Connect Linux VM"> | ||
| <div className={`${Typography.size.sm} dark:text-gray-200`}> | ||
| Connect to Linux VM. Find out more information by{' '} | ||
| <a | ||
| href={`https://docs.deepfence.io/docs/threatmapper/sensors/linux-host/`} | ||
| target="_blank" | ||
| rel="noreferrer" | ||
| className="text-blue-600 dark:text-blue-500 mt-2" | ||
| > | ||
| reading our documentation | ||
| </a> | ||
| . | ||
| </div> | ||
| </Step> | ||
| <Step indicator="1" title="Deploy"> | ||
| <div className={`${Typography.size.sm} dark:text-gray-400`}> | ||
| <p className="mb-2.5"> | ||
| Copy the following commands and paste them into your shell. | ||
| </p> | ||
| <Card className="w-full relative "> | ||
| <pre | ||
| className={cx( | ||
| 'pl-4 pt-4', | ||
| 'h-fit', | ||
| `${Typography.weight.normal} ${Typography.size.xs} `, | ||
| )} | ||
| > | ||
| {code} | ||
| </pre> | ||
| <CopyToClipboardIcon text={code} /> | ||
| </Card> | ||
| <div className="flex flex-col mt-6"> | ||
| <p className={`${Typography.size.xs}`}> | ||
| Note: After successfully run the commands above, your connector will appear | ||
| on MyConnector page, then you can perform scanning. | ||
| </p> | ||
| <Button | ||
| size="xs" | ||
| color="primary" | ||
| className="ml-auto" | ||
| onClick={() => { | ||
| navigate('/onboard/my-connectors'); | ||
| }} | ||
| > | ||
| Go to connectors | ||
| </Button> | ||
| </div> | ||
| </div> | ||
| </Step> | ||
| </Stepper> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
23 changes: 23 additions & 0 deletions
23
deepfence_frontend/apps/dashboard/src/features/onboard/pages/DockerConnector.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import { Button } from 'ui-components'; | ||
|
|
||
| import { usePageNavigation } from '../../../utils/usePageNavigation'; | ||
| import { ConnectorHeader } from '../components/ConnectorHeader'; | ||
| import { DockerConnectorForm } from '../components/connectors/hosts/DockerConnectorForm'; | ||
|
|
||
| export const DockerConnector = () => { | ||
| const { goBack } = usePageNavigation(); | ||
|
|
||
| return ( | ||
| <div className="w-full"> | ||
| <ConnectorHeader | ||
| title="Connect a Docker Container" | ||
| description="Deploy all modules for Deepfence Compliance Scanner at your docker container." | ||
| /> | ||
| <DockerConnectorForm /> | ||
|
|
||
| <Button onClick={goBack} size="xs" className="mt-16" color="default"> | ||
| Cancel | ||
| </Button> | ||
| </div> | ||
| ); | ||
| }; |
23 changes: 23 additions & 0 deletions
23
deepfence_frontend/apps/dashboard/src/features/onboard/pages/LinuxConnector.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import { Button } from 'ui-components'; | ||
|
|
||
| import { usePageNavigation } from '../../../utils/usePageNavigation'; | ||
| import { ConnectorHeader } from '../components/ConnectorHeader'; | ||
| import { LinuxConnectorForm } from '../components/connectors/hosts/LinuxConnectorForm'; | ||
|
|
||
| export const LinuxConnector = () => { | ||
| const { goBack } = usePageNavigation(); | ||
|
|
||
| return ( | ||
| <div className="w-full"> | ||
| <ConnectorHeader | ||
| title="Connect a Linux VM" | ||
| description="Deploy all modules for Deepfence Compliance Scanner at Linux VM." | ||
| /> | ||
| <LinuxConnectorForm /> | ||
|
|
||
| <Button onClick={goBack} size="xs" className="mt-16" color="default"> | ||
| Cancel | ||
| </Button> | ||
| </div> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters