Add Widget for Chuck Norris quotes

docs/widgets.md

@@ -29,6 +29,7 @@ Shipyard has support for displaying dynamic content in the form of widgets. Ther
   - [Stock Price History](#stock-price-history)
   - [ETH Gas Prices](#eth-gas-prices)
   - [Joke of the Day](#joke)
+  - [Chuck Norris quotes](#chucknorris)
   - [XKCD Comics](#xkcd-comics)
   - [Flight Data](#flight-data)
   - [NASA APOD](#astronomy-picture-of-the-day)
@@ -997,6 +998,36 @@ Renders a programming or generic joke. Data is fetched from the [JokesAPI](https
 
 ---
 
+### Chuck Norris quotes
+
+Renders a Chuck Norris quote. Data is fetched from the [ChuckNorrisAPI](https://api.chucknorris.io/) by @matchilling. All fields are optional.
+
+<p align="center"><img width="400" src="https://tbd" /></p>
+
+#### Options
+
+**Field** | **Type** | **Required** | **Description**
+--- | --- | --- | ---
+**`categories`** | `string` |  _Optional_ | Set the category of jokes to return. Use a string to specify a single category, or an array to pass in multiple options. Available options are: `animal`,`career`,`celebrity`,`dev`,`explicit`,`fashion`,`food`,`history`,`money`,`movie`,`music`,`political`,`religion`,`science`,`sport` and `travel`. An up-to-date list of supported categories can be found [here](https://api.chucknorris.io/jokes/categories). Defaults to not explicitely set and therefore any of the categories can come up.
+
+#### Example
+
+```yaml
+- type: chucknorris
+  options:
+    categories: history,sport
+```
+
+#### Info
+
+- **CORS**: 🟢 Enabled
+- **Auth**: 🟢 Not Required
+- **Price**: 🟢 Free
+- **Host**: Managed Instance
+- **Privacy**: _See [matchilling's Privacy Policy](https://api.chucknorris.io/privacy)_
+
+---
+
 ### XKCD Comics
 
 Have a laugh with the daily comic from [XKCD](https://xkcd.com/). A classic webcomic website covering everything from Linux, math, romance, science and language. All fields are optional.

src/components/Widgets/ChuckNorris.vue

@@ -0,0 +1,66 @@
+<template>
+<div class="chuckNorris-wrapper">
+  <p class="chuckNorris chuckNorris-line">{{ chuckNorrisLine }}</p>
+</div>
+</template>
+
+<script>
+import axios from 'axios';
+import WidgetMixin from '@/mixins/WidgetMixin';
+import { widgetApiEndpoints } from '@/utils/defaults';
+
+export default {
+  mixins: [WidgetMixin],
+  components: {},
+  data() {
+    return {
+      chuckNorrisLine: null,
+    };
+  },
+  computed: {
+    /* Format the users preferred categories  */
+    categories() {
+      let usersChoice = this.options.categories;
+      if (!usersChoice) return '';
+      if (Array.isArray(usersChoice)) usersChoice = usersChoice.join(',');
+      const categories = ["animal","career","celebrity","dev","explicit","fashion","food","history","money","movie","music","political","religion","science","sport","travel"];
+      if (categories.some((cat) => usersChoice.toLowerCase().includes(cat))) return usersChoice;
+      return '';
+    },
+    /* Combine data parameters for the API endpoint */
+    endpoint() {
+      if (this.categories !== '') return `${widgetApiEndpoints.chuckNorris}?category=${this.categories}`;
+      return `${widgetApiEndpoints.chuckNorris}`;
+    },
+  },
+  methods: {
+    /* Make GET request to ChuckNorris API endpoint */
+    fetchData() {
+      axios.get(this.endpoint)
+        .then((response) => {
+          this.processData(response.data);
+        })
+        .catch((dataFetchError) => {
+          this.error('Unable to fetch any Chuck Norris quote', dataFetchError);
+        })
+        .finally(() => {
+          this.finishLoading();
+        });
+    },
+    /* Assign data variables to the returned data */
+    processData(data) {
+        this.chuckNorrisLine = data?.value || 'No joke available';
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.chuckNorris-wrapper {
+  p.chuckNorris {
+    color: var(--widget-text-color);
+    font-size: 1.2rem;
+  }
+}
+
+</style>

src/components/Widgets/WidgetBase.vue

@@ -49,14 +49,13 @@ const COMPAT = {
   anonaddy: 'addy.io',
   apod: 'Apod',
   'blacklist-check': 'BlacklistCheck',
+  chucknorris: 'ChuckNorris',
   clock: 'Clock',
   'crypto-price-chart': 'CryptoPriceChart',
   'crypto-watch-list': 'CryptoWatchList',
   'custom-search': 'CustomSearch',
   'cve-vulnerabilities': 'CveVulnerabilities',
   'domain-monitor': 'DomainMonitor',
-  'code-stats': 'CodeStats',
-  'covid-stats': 'CovidStats',
   'drone-ci': 'DroneCi',
   embed: 'EmbedWidget',
   'eth-gas-prices': 'EthGasPrices',
@@ -80,15 +79,15 @@ const COMPAT = {
   'gl-network-traffic': 'GlNetworkTraffic',
   'gl-system-load': 'GlSystemLoad',
   'gl-cpu-temp': 'GlCpuTemp',
+  'gluetun-status': 'GluetunStatus',
   'health-checks': 'HealthChecks',
   'hackernews-trending': 'HackernewsTrending',
-  'gluetun-status': 'GluetunStatus',
   iframe: 'IframeWidget',
   image: 'ImageWidget',
   joke: 'Jokes',
+  linkding: 'Linkding',
   'mullvad-status': 'MullvadStatus',
   mvg: 'Mvg',
-  linkding: 'Linkding',
   'mvg-connection': 'MvgConnection',
   'nd-cpu-history': 'NdCpuHistory',
   'nd-load-history': 'NdLoadHistory',

src/utils/defaults.js

@@ -224,6 +224,7 @@ module.exports = {
     anonAddy: 'https://app.addy.io',
     astronomyPictureOfTheDay: 'https://apod.as93.net/apod',
     blacklistCheck: 'https://api.blacklistchecker.com/check',
+    chuckNorris: 'https://api.chucknorris.io/jokes/random',
     codeStats: 'https://codestats.net/',
     covidStats: 'https://disease.sh/v3/covid-19',
     cryptoPrices: 'https://api.coingecko.com/api/v3/coins/',