Component page more

docs/contribute.md

@@ -14,7 +14,7 @@ You can use the MoJ Design System to share your work with others. This is throug
 
 ## Adding a building block
 
-You can now add a builsing block to the MoJ Design System. You might want to do this to:
+You can now add a building block to the MoJ Design System. You might want to do this to:
 
 - make it easier for teams across government to find your work
 - get contributions from other people to help the building block develop

middleware/__snapshots__/generate-documentation.spec.js.snap

@@ -26,27 +26,19 @@ eleventyNavigation:
 
 This is an overview.
 
-## How the component is currently used
+## How the component is being used
 
 This is how it is used.
 
 {% endtab %}
 
 {% tab "Code" %}
 
-## Help develop existing building blocks in GitHub
-
-After a new building block is published in the design system, you, and other users, have the chance to continue enhancing it. This is done with users adding more information and resources to the component via GitHub.
-
-To do this you should:
-
-- go to the GitHub conversation
-- add your comments, information and resources about the building block
-
 ## Code
 
-No code has been contributed for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
+No code has been added for this component.
 
+If you've used this component in your service and you have code, you can add it. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
 
 {% endtab %}
 
@@ -55,33 +47,31 @@ No code has been contributed for this component. If you have examples of how you
 ## Accessibility
 
 If you have had an accessibility audit or tested with users with access needs then you could contribute to this component.
-### External audit (External Org) - January 2022
+
+### External audit
+
 Some issues discovered.
 
 [Download the accessibility report](/external-report.pdf)
-### Internal audit (Internal Org) - February 2022
+
+### Internal review
+
 Some internal issues discovered.
 
 [Download the accessibility report](/internal-report.pdf)
-### Assistive Technology audit - March 2022
-Assistive tech issues discovered.
-
-[Download the accessibility report](/assistive-tech-report.pdf)
 
+### Assistive Technology testing
 
 {% endtab %}
 
-{% tab "Links" %}
-
-## Links
-
-### Prototype
+{% tab "Prototypes and design files" %}
 
+## Prototypes and design files
 
+### Prototypes
 
 <a href="www.test.com" target="_blank" rel="noopener noreferrer">Prototype link (opens in a new tab)</a>
 
-
 {% endtab %}
 
 {% endtabs %}
@@ -111,15 +101,11 @@ eleventyNavigation:
 ## Overview
 
 <div class="img-container">
-
-</div>
-
 
+</div>
 
 ## How the component is currently used
 
-
-
 {% endtab %}
 
 {% tab "Code" %}
@@ -135,25 +121,23 @@ To do this you should:
 
 ## Code
 
-No code has been contributed for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
-
+No code has been added for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
 
 {% endtab %}
 
 {% tab "Accessibility" %}
 
 ## Accessibility
 
-No accessibility findings have been contributed for this component.
-
+No accessibility findings have been added for this component.
 
 {% endtab %}
 
-{% tab "Links" %}
+{% tab "Prototypes and design files" %}
 
-## Links
+## Prototypes and design files
 
-No links have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.
+No prototypes or design files have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.
 
 
 {% endtab %}
@@ -185,62 +169,58 @@ eleventyNavigation:
 ## Overview
 
 <div class="img-container">
-  
+
 </div>
 
 Another overview.
 
-## How the component is currently used
+## How the component is being used
 
 Another usage.
 
 {% endtab %}
 
 {% tab "Code" %}
 
-## Help develop existing building blocks in GitHub
-
-After a new building block is published in the design system, you, and other users, have the chance to continue enhancing it. This is done with users adding more information and resources to the component via GitHub.
-
-To do this you should:
-
-- go to the GitHub conversation
-- add your comments, information and resources about the building block
-
 ## Code
 
-No code has been contributed for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
+## Code
 
+No code has been added for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
 
 {% endtab %}
 
 {% tab "Accessibility" %}
 
 ## Accessibility
 
-If you have had an accessibility audit or tested with users with access needs then you could contribute to this component.
+This
+If you have accessibility findings or tested with users with access needs then you could contribute to this component.
+
 ### External audit (External Org) - January 2022
 Some issues discovered.
 
 [Download the accessibility report](/external-report.pdf)
+
 ### Internal audit (Internal Org) - February 2022
+
 Some internal issues discovered.
 
 [Download the accessibility report](/internal-report.pdf)
+
 ### Assistive Technology audit - March 2022
+
 Assistive tech issues discovered.
 
 [Download the accessibility report](/assistive-tech-report.pdf)
 
-
 {% endtab %}
 
-{% tab "Links" %}
-
-## Links
+{% tab "Prototypes and design files" %}
 
-No links have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.
+## Prototypes and design files
 
+No prototypes or design files have been added for this component. If you have used this component in your service and you have a prototype or design file you can share it here.
 
 {% endtab %}
 
@@ -271,50 +251,34 @@ eleventyNavigation:
 ## Overview
 
 <div class="img-container">
-
-</div>
-
-
-
-## How the component is currently used
 
+</div>
 
+## How the component is currently being used
 
 {% endtab %}
 
 {% tab "Code" %}
 
-## Help develop existing building blocks in GitHub
-
-After a new building block is published in the design system, you, and other users, have the chance to continue enhancing it. This is done with users adding more information and resources to the component via GitHub.
-
-To do this you should:
-
-- go to the GitHub conversation
-- add your comments, information and resources about the building block
-
 ## Code
 
-No code has been contributed for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
-
+No code has been added for this component. If you have examples of how you've used this component in your service then you could help the community by adding some. Most users are looking for HTML, Nunjucks, JavaScript, CSS or SASS.
 
 {% endtab %}
 
 {% tab "Accessibility" %}
 
 ## Accessibility
 
-No accessibility findings have been contributed for this component.
-
+No accessibility findings have been added for this component. If you have examples of how you've used this component in your service then you could help the community by adding some. Most users are looking for HTML, Nunjucks, JavaScript, CSS or SASS.
 
 {% endtab %}
 
-{% tab "Links" %}
-
-## Links
+{% tab "Prototype and design files" %}
 
-No links have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.
+## Prototypes and design files
 
+No prototypes or design files have been added for this component. If you've used this component in your service and you have a prototype you can share it in the Github discussion.
 
 {% endtab %}
 
@@ -345,32 +309,22 @@ eleventyNavigation:
 ## Overview
 
 <div class="img-container">
-  
+
 </div>
 
 Overview here.
 
-## How the component is currently used
+## How the component is being used
 
 Usage here.
 
 {% endtab %}
 
 {% tab "Code" %}
 
-## Help develop existing building blocks in GitHub
-
-After a new building block is published in the design system, you, and other users, have the chance to continue enhancing it. This is done with users adding more information and resources to the component via GitHub.
-
-To do this you should:
-
-- go to the GitHub conversation
-- add your comments, information and resources about the building block
-
 ## Code
 
-No code has been contributed for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.
-
+No code has been added for this component. If you have examples of how you've used this component in your service then you could help the community by adding some. Most users are looking for HTML, Nunjucks, JavaScript, CSS or SASS.
 
 {% endtab %}
 
@@ -379,25 +333,26 @@ No code has been contributed for this component. If you have examples of how you
 ## Accessibility
 
 If you have had an accessibility audit or tested with users with access needs then you could contribute to this component.
-### External audit (External Org) - January 2022
+
+### External audit
+
 Some issues discovered.
 
-### Internal audit (Internal Org) - February 2022
-Some internal issues discovered.
+### Internal review
 
-### Assistive Technology audit - March 2022
-Assistive tech issues discovered.
+Some internal issues discovered.
 
+### Assistive Technology testing
 
+Assistive tech issues discovered.
 
 {% endtab %}
 
-{% tab "Links" %}
-
-## Links
+{% tab "Prototype and design files" %}
 
-No links have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.
+## Prototype and design files
 
+No prototypes or design files have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.
 
 {% endtab %}
 

middleware/component-session.js

@@ -300,7 +300,7 @@ const removeFromSession = (req, res, next) => {
     if (filename) {
       req.session.sessionFlash = {
         type: 'success',
-        message: `File ‘${filename}’ removed.`
+        message: `File ‘${filename}’ has been removed.`
       }
     }
   }

middleware/generate-documentation.js

@@ -13,7 +13,7 @@ const generateMarkdown = (data, files) => {
   const filename = `${documentationDirectory}/${sanitizedComponentName}.md`
   const generateLinksSection = (data) => {
     const noLinks =
-      'No links have been provided for this component. If you have used this component in your service and you have a prototype you can share it here.\n'
+      'No prototypes or design files have been added for this component. If you have used this component in your service and you have a prototype you can share it here.\n'
 
     let content = ''
     let prototypeContent = ''
@@ -57,7 +57,7 @@ ${figma?.figmaLinkAdditionalInformation || ''}
     const contentHeading =
       'If you have had an accessibility audit or tested with users with access needs then you could contribute to this component.\n'
     const noContent =
-      'No accessibility findings have been contributed for this component.\n'
+      'No accessibility findings have been added for this component.\n'
     let content = ''
     const externalAudit = data['/add-external-audit']
     const externalAuditFile = files?.['/add-external-audit']
@@ -129,7 +129,7 @@ ${figma?.figmaLinkAdditionalInformation || ''}
 
   const generateComponentCodeSection = (data) => {
     const noCode =
-      'No code has been contributed for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.\n'
+      'No code has been added for this component. If you have examples of how you have used this component in your service then you could help the community. Most users are looking for HTML, Nunjucks, Javascript and CSS or SASS.\n'
 
     let content = ''
     let n = 1