feat: add footer with link to usage (#163)

.all-contributorsrc

@@ -5,6 +5,7 @@
   "repoType": "github",
   "commit": false,
   "contributorsPerLine": 6,
+  "linkToUsage": true,
   "files": [
     "README.md"
   ],

src/generate/__tests__/__snapshots__/index.js.snap

@@ -18,6 +18,46 @@ These people contributed to the project:
       <td align=\\"center\\">Jeroen Engels is awesome!</td>
     </tr>
   </tbody>
+  <tfoot>
+    
+  </tfoot>
+</table>
+
+<!-- markdownlint-restore -->
+<!-- prettier-ignore-end -->
+
+<!-- ALL-CONTRIBUTORS-LIST:END -->
+
+Thanks a lot everyone!"
+`;
+
+exports[`replace the content between the ALL-CONTRIBUTORS-LIST tags by a table of contributors with linkToUsage 1`] = `
+"# project
+
+Description
+
+## Contributors
+These people contributed to the project:
+<!-- ALL-CONTRIBUTORS-LIST:START -->
+<!-- prettier-ignore-start -->
+<!-- markdownlint-disable -->
+<table>
+  <tbody>
+    <tr>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+      <td align=\\"center\\">Divjot Singh is awesome!</td>
+      <td align=\\"center\\">Jeroen Engels is awesome!</td>
+    </tr>
+  </tbody>
+  <tfoot>
+    <tr>
+      <td align=\\"center\\" size=\\"13px\\" colspan=\\"5\\">
+        <img src=\\"https://raw.githubusercontent.com/all-contributors/all-contributors-cli/1b8533af435da9854653492b1327a23a4dbd0a10/assets/logo-small.svg\\">
+          <a href=\\"https://all-contributors.js.org/docs/en/bot/usage\\">Add your contributions</a>
+        </img>
+      </td>
+    </tr>
+  </tfoot>
 </table>
 
 <!-- markdownlint-restore -->
@@ -52,6 +92,52 @@ These people contributed to the project:
       <td align=\\"center\\">Kent C. Dodds is awesome!</td>
     </tr>
   </tbody>
+  <tfoot>
+    
+  </tfoot>
+</table>
+
+<!-- markdownlint-restore -->
+<!-- prettier-ignore-end -->
+
+<!-- ALL-CONTRIBUTORS-LIST:END -->
+
+Thanks a lot everyone!"
+`;
+
+exports[`split contributors into multiples lines when there are too many with linkToUsage 1`] = `
+"# project
+
+Description
+
+## Contributors
+These people contributed to the project:
+<!-- ALL-CONTRIBUTORS-LIST:START -->
+<!-- prettier-ignore-start -->
+<!-- markdownlint-disable -->
+<table>
+  <tbody>
+    <tr>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+    </tr>
+    <tr>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+      <td align=\\"center\\">Kent C. Dodds is awesome!</td>
+    </tr>
+  </tbody>
+  <tfoot>
+    <tr>
+      <td align=\\"center\\" size=\\"13px\\" colspan=\\"5\\">
+        <img src=\\"https://raw.githubusercontent.com/all-contributors/all-contributors-cli/1b8533af435da9854653492b1327a23a4dbd0a10/assets/logo-small.svg\\">
+          <a href=\\"https://all-contributors.js.org/docs/en/bot/usage\\">Add your contributions</a>
+        </img>
+      </td>
+    </tr>
+  </tfoot>
 </table>
 
 <!-- markdownlint-restore -->

src/generate/__tests__/index.js

@@ -43,6 +43,15 @@ test('replace the content between the ALL-CONTRIBUTORS-LIST tags by a table of c
   expect(result).toMatchSnapshot()
 })
 
+test('replace the content between the ALL-CONTRIBUTORS-LIST tags by a table of contributors with linkToUsage', () => {
+  const {kentcdodds, bogas04} = contributors
+  const {options, jfmengels, content} = fixtures()
+  const contributorList = [kentcdodds, bogas04, jfmengels]
+  const result = generate(Object.assign(options, { linkToUsage: true }), contributorList, content)
+
+  expect(result).toMatchSnapshot()
+})
+
 test('split contributors into multiples lines when there are too many', () => {
   const {kentcdodds} = contributors
   const {options, content} = fixtures()
@@ -60,6 +69,23 @@ test('split contributors into multiples lines when there are too many', () => {
   expect(result).toMatchSnapshot()
 })
 
+test('split contributors into multiples lines when there are too many with linkToUsage', () => {
+  const {kentcdodds} = contributors
+  const {options, content} = fixtures()
+  const contributorList = [
+    kentcdodds,
+    kentcdodds,
+    kentcdodds,
+    kentcdodds,
+    kentcdodds,
+    kentcdodds,
+    kentcdodds,
+  ]
+  const result = generate(Object.assign(options, { linkToUsage: true }), contributorList, content)
+
+  expect(result).toMatchSnapshot()
+})
+
 test('sorts the list of contributors if contributorsSortAlphabetically=true', () => {
   const {kentcdodds, bogas04} = contributors
   const {options, jfmengels, content} = fixtures()

src/generate/index.js

@@ -49,8 +49,20 @@ function formatLine(contributors) {
   )}</td>`
 }
 
+function formatFooter(options) {
+  if (!options.linkToUsage) {
+    return ''
+  }
+  const smallLogoURL =
+    'https://raw.githubusercontent.com/all-contributors/all-contributors-cli/1b8533af435da9854653492b1327a23a4dbd0a10/assets/logo-small.svg'
+  const linkToBotAdd = 'https://all-contributors.js.org/docs/en/bot/usage'
+
+  return `<tr>\n      <td align="center" size="13px" colspan="${options.contributorsPerLine}">\n        <img src="${smallLogoURL}">\n          <a href="${linkToBotAdd}">Add your contributions</a>\n        </img>\n      </td>\n    </tr>`
+}
+
 function generateContributorsList(options, contributors) {
-  const contributorsPerLine = options.contributorsPerLine || 7
+  const tableFooter = formatFooter(options)
+
   return _.flow(
     _.sortBy(contributor => {
       if (options.contributorsSortAlphabetically) {
@@ -60,11 +72,11 @@ function generateContributorsList(options, contributors) {
     _.map(function formatEveryContributor(contributor) {
       return formatContributor(options, contributor)
     }),
-    _.chunk(contributorsPerLine),
+    _.chunk(options.contributorsPerLine),
     _.map(formatLine),
     _.join('\n    </tr>\n    <tr>\n      '),
     newContent => {
-      return `\n<table>\n  <tbody>\n    <tr>\n      ${newContent}\n    </tr>\n  </tbody>\n</table>\n\n`
+      return `\n<table>\n  <tbody>\n    <tr>\n      ${newContent}\n    </tr>\n  </tbody>\n  <tfoot>\n    ${tableFooter}\n  </tfoot>\n</table>\n\n`
     },
   )(contributors)
 }

src/init/prompt.js

@@ -86,6 +86,12 @@ const questions = [
     choices: Object.values(conventions),
     default: 'angular',
   },
+  {
+    type: 'confirm',
+    name: 'linkToUsage',
+    message: 'Do you want to add a footer with link to usage?',
+    default: true,
+  },
 ]
 
 const uniqueFiles = _.flow(_.compact, _.uniq)
@@ -113,6 +119,7 @@ module.exports = function prompt() {
           commitConvention: answers.commitConvention,
           contributors: [],
           contributorsPerLine: 7,
+          linkToUsage: answers.linkToUsage,
         },
         contributorFile: answers.contributorFile,
         badgeFile: answers.badgeFile,