chore: textlint tweaks

rigor789 · rigor789 · commit 468d13356716 · 2023-08-26T13:40:24.000+02:00
diff --git a/.textlintrc b/.textlintrc
@@ -1,14 +1,39 @@
 {
   "rules": {
     "terminology": {
-      "severity" : "warning",
+      "severity": "warning",
       "defaultTerms": false,
       // Some terms borrowed from https://github.com/cypress-io/cypress-documentation/blob/main/.textlintrc
       "terms": [
+        // NativeScript specifics
+        ["absolute[- ]?layout(s?)", "AbsoluteLayout$1"],
+        ["dock[- ]?layout(s?)", "DockLayout$1"],
+        ["flex(box)?[- ]?layout(s?)", "FlexboxLayout$1"],
+        ["grid[- ]?layout(s?)", "GridLayout$1"],
+        ["root[- ]?layout(s?)", "RootLayout$1"],
+        ["stack[- ]?layout(s?)", "StackLayout$1"],
+        ["wrap[- ]?layout(s?)", "WrapLayout$1"],
+        ["activity[- ]?indicator(s?)", "ActivityIndicator$1"],
+        ["date[- ]?picker(s?)", "DatePicker$1"],
+        ["html[- ]?view(s?)", "HtmlView$1"],
+        ["list[- ]?picker(s?)", "ListPicker$1"],
+        ["list[- ]?view(s?)", "ListView$1"],
+        ["place[- ]?holder(s?)", "Placeholder$1"],
+        ["scroll[- ]?view(s?)", "ScrollView$1"],
+        ["search[- ]?bar(s?)", "SearchBar$1"],
+        ["segmented[- ]?bar(s?)", "SegmentedBar$1"],
+        ["tab[- ]?view(s?)", "TabView$1"],
+        ["text[- ]?field(s?)", "TextField$1"],
+        ["text[- ]?view(s?)", "TextView$1"],
+        ["time[- ]?picker(s?)", "TimePicker$1"],
+        ["web[- ]?view(s?)", "WebView$1"],
+        ["action[- ]?bar(s?)", "ActionBar$1"],
+
         // Brands and Technologies
         "JavaScript",
         "TypeScript",
         "NativeScript",
+        ["ns", "NativeScript"],
         "GitHub",
         ["VSCode", "VS Code"],
         "webpack",
diff --git a/content/configuration/nativescript.md b/content/configuration/nativescript.md
@@ -401,7 +401,7 @@ Avaialable hooks (prefix with `before-` or `after-`):
 - `buildAndroidPlugin` - Builds aar file for Android plugin, runs during prepareNativeApp
 - `buildAndroid` - Builds Android app
 - `buildIOS` - Builds iOS app
-- `checkEnvironment` - Validate project env, runs during ns doctor, clean, and most build commands
+- `checkEnvironment` - Validate project env, runs during `ns` doctor, clean, and most build commands
 - `checkForChanges` - Changes occurred during watch
 - `install` - Application installed to device/emulator
 - `prepare` - Compiles webpack and prepares native app in platforms folder
diff --git a/content/guide/code-sharing.md b/content/guide/code-sharing.md
@@ -5,6 +5,8 @@ contributors:
   - NathanWalker
 ---
 
+<!-- textlint-disable terminology -->
+
 JavaScript provides opportunities of immense scalability if architectured properly. One key word that often comes up in this department is **"code sharing"**. Over the years, several lessons have emerged around scalability with JavaScript in lieu of NativeScript in particular.
 
 **The NativeScript TSC's 5 fundamental lessons about good code sharing**:
diff --git a/content/tutorials/build-a-master-detail-app-with-angular.md b/content/tutorials/build-a-master-detail-app-with-angular.md
@@ -334,7 +334,7 @@ Next, let's break down the layout and UI elements of the home page.
 
 ![Home page layout breakdown](/assets/images/tutorial/tutorial-example-app-master-breakdown.png)
 
-The home page can be divided into two main parts, the action bar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the action bar with the title. Open `home.component.html` and add the following code:
+The home page can be divided into two main parts, the ActionBar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the ActionBar with the title. Open `home.component.html` and add the following code:
 
 ```html
 <!-- src/app/features/home/home.component.html -->
@@ -608,7 +608,7 @@ export class HomeComponent {
 }
 ```
 
-Next, let's add the tap event to the listview items. Open `home.component.html` and add the following:
+Next, let's add the tap event to the ListView items. Open `home.component.html` and add the following:
 
 ```html{10}
 <!-- src/app/features/home/home.component.html -->
@@ -699,7 +699,7 @@ Let's break down the layout and UI elements of the details page.
 
 ![Details page layout breakdown](/assets/images/tutorial/tutorial-example-app-details-breakdown.png)
 
-The details page can be divided into three main parts, the action bar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Angular's `*ngFor` directive to loop through the array and create a UI element or set of elements for each entry in the array. Open `details.component.html` and add the following code:
+The details page can be divided into three main parts, the ActionBar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Angular's `*ngFor` directive to loop through the array and create a UI element or set of elements for each entry in the array. Open `details.component.html` and add the following code:
 
 ```html
 <!-- src/app/features/details/details.component.html -->
diff --git a/content/tutorials/build-a-master-detail-app-with-plain-javascript.md b/content/tutorials/build-a-master-detail-app-with-plain-javascript.md
@@ -249,7 +249,7 @@ Next, let's break down the layout and UI elements of the home page.
 
 ![Home page layout breakdown](/assets/images/tutorial/tutorial-example-app-master-breakdown.png)
 
-The home page can be divided into two main parts, the action bar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the action bar with the title. Open `home-page.xml` and add the following code:
+The home page can be divided into two main parts, the ActionBar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the ActionBar with the title. Open `home-page.xml` and add the following code:
 
 ```xml
 <!-- app/home/home-page.xml -->
@@ -471,7 +471,7 @@ export class HomeViewModel extends Observable {
 }
 ```
 
-Next, let's add the tap event to the listview items. Open `home-page.xml` and add the following:
+Next, let's add the tap event to the ListView items. Open `home-page.xml` and add the following:
 
 ```xml{10}
 <!-- app/home/home-page.xml -->
@@ -566,7 +566,7 @@ Let's break down the layout and UI elements of the details page.
 
 ![Details page layout breakdown](/assets/images/tutorial/tutorial-example-app-details-breakdown.png)
 
-The details page can be divided into three main parts, the action bar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use NativeScript's `Repeater` component to loop through the array and create a UI element or set of elements for each entry in the array. Open `details-page.xml` and add the following code:
+The details page can be divided into three main parts, the ActionBar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use NativeScript's `Repeater` component to loop through the array and create a UI element or set of elements for each entry in the array. Open `details-page.xml` and add the following code:
 
 ```xml{4,7-33}
 <!-- app/details/details-page.xml -->
diff --git a/content/tutorials/build-a-master-detail-app-with-plain-typescript.md b/content/tutorials/build-a-master-detail-app-with-plain-typescript.md
@@ -277,7 +277,7 @@ Next, let's break down the layout and UI elements of the home page.
 
 ![Home page layout breakdown](/assets/images/tutorial/tutorial-example-app-master-breakdown.png)
 
-The home page can be divided into two main parts, the action bar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the action bar with the title. Open `home-page.xml` and add the following code:
+The home page can be divided into two main parts, the ActionBar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the ActionBar with the title. Open `home-page.xml` and add the following code:
 
 ```xml
 <!-- app/home/home-page.xml -->
@@ -500,7 +500,7 @@ export class HomeViewModel extends Observable {
 }
 ```
 
-Next, let's add the tap event to the listview items. Open `home-page.xml` and add the following:
+Next, let's add the tap event to the ListView items. Open `home-page.xml` and add the following:
 
 ```xml{10}
 <!-- app/home/home-page.xml -->
@@ -597,7 +597,7 @@ Let's break down the layout and UI elements of the details page.
 
 ![Details page layout breakdown](/assets/images/tutorial/tutorial-example-app-details-breakdown.png)
 
-The details page can be divided into three main parts, the action bar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use NativeScript's `Repeater` component to loop through the array and create a UI element or set of elements for each entry in the array. Open `details-page.xml` and add the following code:
+The details page can be divided into three main parts, the ActionBar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use NativeScript's `Repeater` component to loop through the array and create a UI element or set of elements for each entry in the array. Open `details-page.xml` and add the following code:
 
 ```xml{4,7-33}
 <!-- app/details/details-page.xml -->
diff --git a/content/tutorials/build-a-master-detail-app-with-react.md b/content/tutorials/build-a-master-detail-app-with-react.md
@@ -280,7 +280,7 @@ Next, let's break down the layout and UI elements of the home page.
 
 ![Home page layout breakdown](/assets/images/tutorial/tutorial-example-app-master-breakdown.png)
 
-The home page can be divided into two main parts, the action bar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the action bar with the title. Open `Navigator.tsx` and add the following code:
+The home page can be divided into two main parts, the ActionBar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the ActionBar with the title. Open `Navigator.tsx` and add the following code:
 
 ```tsx{17-19,24-26}
 // src/components/Navigator.tsx
@@ -653,7 +653,7 @@ export function HomeScreen({ navigation }: HomeScreenProps) {
 }
 ```
 
-Next, let's add the tap event to the listview items. Open `HomeScreen.tsx` and add the following:
+Next, let's add the tap event to the ListView items. Open `HomeScreen.tsx` and add the following:
 
 ```tsx{66}
 // src/components/HomeScreen.tsx
@@ -766,7 +766,7 @@ Let's break down the layout and UI elements of the details page.
 
 ![Details page layout breakdown](/assets/images/tutorial/tutorial-example-app-details-breakdown.png)
 
-The details page can be divided into three main parts, the action bar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Javascript's array `map` operator to loop through the `details` array and create a UI element or set of elements for each entry in the array. Open `DetailsScreen.tsx` and add the following code:
+The details page can be divided into three main parts, the ActionBar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Javascript's array `map` operator to loop through the `details` array and create a UI element or set of elements for each entry in the array. Open `DetailsScreen.tsx` and add the following code:
 
 ```tsx{20-44}
 // src/components/DetailsScreen.tsx
diff --git a/content/tutorials/build-a-master-detail-app-with-svelte.md b/content/tutorials/build-a-master-detail-app-with-svelte.md
@@ -253,7 +253,7 @@ Next, let's break down the layout and UI elements of the home page.
 
 ![Home page layout breakdown](/assets/images/tutorial/tutorial-example-app-master-breakdown.png)
 
-The home page can be divided into two main parts, the action bar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the action bar with the title. Open `Home.svelte` and add the following code:
+The home page can be divided into two main parts, the ActionBar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the ActionBar with the title. Open `Home.svelte` and add the following code:
 
 ```html
 <!-- app/pages/Home.svelte -->
@@ -479,7 +479,7 @@ We will be using the `navigate` function from `svelte-native` class to navigate
 </script>
 ```
 
-Next, let's add the tap event to the listview items. Open `Home.svelte` and add the following:
+Next, let's add the tap event to the ListView items. Open `Home.svelte` and add the following:
 
 ```html{11}
 <!-- app/pages/Home.svelte -->
@@ -582,7 +582,7 @@ Let's break down the layout and UI elements of the details page.
 
 ![Details page layout breakdown](/assets/images/tutorial/tutorial-example-app-details-breakdown.png)
 
-The details page can be divided into three main parts, the action bar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Svelte's `#each` block to loop through the array and create a UI element or set of elements for each entry in the array. Open `Details.svelte` and add the following code:
+The details page can be divided into three main parts, the ActionBar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Svelte's `#each` block to loop through the array and create a UI element or set of elements for each entry in the array. Open `Details.svelte` and add the following code:
 
 ```html{5,8-32}
 <!-- app/pages/Details.svelte -->
diff --git a/content/tutorials/build-a-master-detail-app-with-vue.md b/content/tutorials/build-a-master-detail-app-with-vue.md
@@ -258,7 +258,7 @@ Next, let's break down the layout and UI elements of the home page.
 
 ![Home page layout breakdown](/assets/images/tutorial/tutorial-example-app-master-breakdown.png)
 
-The home page can be divided into two main parts, the action bar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the action bar with the title. Open `Home.vue` and add the following code:
+The home page can be divided into two main parts, the ActionBar with the title and the scrollable main content area with the cards (we will talk about the cards in the next section). Let's start with creating the ActionBar with the title. Open `Home.vue` and add the following code:
 
 ```vue{6}
 <!-- app/components/Home.vue -->
@@ -535,7 +535,7 @@ export default Vue.extend({
 </script>
 ```
 
-Next, let's add the tap event to the listview items. Open `Home.vue` and add the following:
+Next, let's add the tap event to the ListView items. Open `Home.vue` and add the following:
 
 ```html{11}
 <!-- app/components/Home.vue -->
@@ -648,7 +648,7 @@ Let's break down the layout and UI elements of the details page.
 
 ![Details page layout breakdown](/assets/images/tutorial/tutorial-example-app-details-breakdown.png)
 
-The details page can be divided into three main parts, the action bar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Vue's `v-for` directive to loop through the array and create a UI element or set of elements for each entry in the array. Open `Details.vue` and add the following code:
+The details page can be divided into three main parts, the ActionBar with the flick title, the hero image, and the main content with the flick details. We will use the `details` array from our `flicks` object to populate the flick details section. The `details` array contains objects with a `title` and `body` which are rendered uniformly, each with their style. We can use Vue's `v-for` directive to loop through the array and create a UI element or set of elements for each entry in the array. Open `Details.vue` and add the following code:
 
 ```vue{6,9-31}
 <!-- app/components/Details.vue -->
