docs: Add doc comments to services and generate docs

Author: szuperaz

.github/workflows/workflow.yml

@@ -54,14 +54,10 @@ jobs:
           GH_TOKEN: ${{ secrets.GH_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
         run: npx semantic-release
-      - name: Verify docs changed
-        uses: tj-actions/[email protected]
-        with:
-          files: |
-            docusaurus
-        id: changed_files
+      - name: Generate service docs
+        run: |
+          npm run generate-docs
       - name: Push to docusaurus
-        if: steps.changed_files.outputs.any_changed == 'true' || github.ref == 'refs/heads/master'
         uses: GetStream/push-stream-chat-docusaurus-action@main
         with:
           target-branch: ${{ github.ref == 'refs/heads/master' && 'production' || 'staging' }}

.gitignore

@@ -40,6 +40,10 @@ yarn-error.log
 testem.log
 /typings
 
+# Generated docs
+temp-docs
+docusaurus/docs/Angular/services/*.mdx
+
 # System Files
 .DS_Store
 Thumbs.db

.vscode/extensions.json

@@ -0,0 +1,9 @@
+{
+  // See https://go.microsoft.com/fwlink/?LinkId=827846 to learn about workspace recommendations.
+  // Extension identifier format: ${publisher}.${name}. Example: vscode.csharp
+
+  // List of extensions which should be recommended for users of this workspace.
+  "recommendations": ["bierner.jsdoc-markdown-highlighting"],
+  // List of extensions recommended by VS Code that should not be recommended for users of this workspace.
+  "unwantedRecommendations": []
+}

copy-generated-docs.ts

@@ -0,0 +1,48 @@
+const fs = require('fs');
+
+const sourcePath = 'temp-docs/classes';
+const targetPath = 'docusaurus/docs/Angular/services';
+
+fs.readdir(targetPath, (err: any, files: string[]) => {
+  if (err) {
+    throw err;
+  }
+  files.forEach((file) => {
+    if (file !== '_category_.json') {
+      try {
+        fs.unlinkSync(`${targetPath}/${file}`);
+      } catch (err: any) {
+        throw err;
+      }
+    }
+  });
+});
+
+fs.readdir(sourcePath, (err: any, files: string[]) => {
+  if (err) {
+    throw err;
+  }
+  files.forEach((file) => {
+    fs.readFile(`${sourcePath}/${file}`, 'utf8', (err: any, data: string) => {
+      if (err) {
+        throw err;
+      }
+      const result = data.replace(/# Class:/g, '#');
+
+      fs.writeFile(`${sourcePath}/${file}`, result, 'utf8', (err: any) => {
+        if (err) {
+          throw err;
+        }
+        fs.copyFile(
+          `${sourcePath}/${file}`,
+          `${targetPath}/${file}x`,
+          (err: any) => {
+            if (err) {
+              throw err;
+            }
+          }
+        );
+      });
+    });
+  });
+});

docusaurus/docs/Angular/components/attachment-list.mdx

@@ -6,6 +6,8 @@ title: Attachments
 
 import AttachmentsScreenshot from "../assets/attachments-screenshot.png";
 
+TEST
+
 The `AttachmentList` compontent displays the attachments of a message. The following attachments are supported:
 
 - Images (including GIFs) are displayed inline

docusaurus/docs/Angular/components/attachment-preview-list.mdx

@@ -29,4 +29,4 @@ A typical use case for the `AttachmentPreviewList` component would be to use in
 export class CustomMessageInputComponent {}
 ```
 
-The `AttachmentPreviewList` uses the [`AttachmentService`](../services/attachment.mdx) to display the attachment previews.
+The `AttachmentPreviewList` uses the [`AttachmentService`](../services/AttachmentService.mdx) to display the attachment previews.

docusaurus/docs/Angular/components/autocomplete-textarea.mdx

@@ -65,19 +65,19 @@ You can provide your own template for the autocomplete list for user mentions.
 
 You can also set this input on the [`MessageInput`](./message-input.mdx/#inputs) component.
 
-| Type                                                                                                                                                               |
-| ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| [`TemplateRef<MentionAutcompleteListItemContext>`](<(https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts)>) |
+| Type                                                                                                                                                           |
+| -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [`TemplateRef<MentionAutcompleteListItemContext>`](https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts) |
 
 ### commandAutocompleteItemTemplate
 
 You can provide your own template for the autocomplete list for commands.
 
 You can also set this input on the [`MessageInput`](./message-input.mdx/#inputs) component.
 
-| Type                                                                                                                                                               |
-| ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| [`TemplateRef<CommandAutcompleteListItemContext>`](<(https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts)>) |
+| Type                                                                                                                                                           |
+| -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [`TemplateRef<CommandAutcompleteListItemContext>`](https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts) |
 
 ### mentionScope
 

docusaurus/docs/Angular/components/channel-header.mdx

@@ -26,7 +26,7 @@ If you want to, you can create your own custom channel header, here is how to us
 </stream-channel>
 ```
 
-If you create your own channel header, you can use the [`ChannelService`](../services/channel.mdx) to access the currently active channel. Please note that, the default channel header also contains the menu button to [toggle the channel list](../services/channel-list-toggle.mdx). Here is a simple implementation of a custom channel header to guide you:
+If you create your own channel header, you can use the [`ChannelService`](../services/ChannelService.mdx) to access the currently active channel. Please note that, the default channel header also contains the menu button to [toggle the channel list](../services/ChannelListToggleService.mdx). Here is a simple implementation of a custom channel header to guide you:
 
 ```typescript
 @Component({

docusaurus/docs/Angular/components/channel-list.mdx

@@ -26,13 +26,13 @@ If you want to create a custom channel list component, here is how to use it:
 ```
 
 :::note
-If you want to create your own channel list, you can use the [`ChannelService`](../services/channel.mdx) to receive the channels and interact with the Stream API.
+If you want to create your own channel list, you can use the [`ChannelService`](../services/ChannelService.mdx) to receive the channels and interact with the Stream API.
 
 Other building blocks, that you might find useful:
 
 ### Toggle
 
-The channel list is always visible on desktop devices, on mobile devices, the list can be opened or closed controlled by a button in the `ChannelHeader` component. The open/close mechanism is implemented by the [`ChannelListToggleService`](../services/channel-list-toggle.mdx).
+The channel list is always visible on desktop devices, on mobile devices, the list can be opened or closed controlled by a button in the `ChannelHeader` component. The open/close mechanism is implemented by the [`ChannelListToggleService`](../services/ChannelListToggleService.mdx).
 
 ### Loading indicator
 

docusaurus/docs/Angular/components/message-input.mdx

@@ -52,11 +52,11 @@ If you want to create your own message input, you can use the following building
 
 ### Send and update messages
 
-You can use [`ChannelService`](../services/channel.mdx) to send and update messages.
+You can use [`ChannelService`](../services/ChannelService.mdx) to send and update messages.
 
 ### File uploads
 
-You can use the [`AttachmentService`](../services/attachment.mdx) to manage file uploads.
+You can use the [`AttachmentService`](../services/AttachmentService.mdx) to manage file uploads.
 
 If more than one message input component can exist on your chat UI you should provide the `AttachmentService` on the component level:
 
@@ -81,7 +81,7 @@ You can use the [`Textarea`](./textarea.mdx) or the [`AutocompleteTextarea`](./a
 
 If file upload is enabled, the user can open a file selector from the input. Please note that the user also needs to have the necessary [channel capability](https://getstream.io/chat/docs/javascript/channel_capabilities/?language=javascript).
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
 | Type    |
 | ------- |
@@ -93,7 +93,7 @@ If no value is provided, it is set from the [`MessageInputConfigService`](../ser
 
 You can narrow the accepted file types by providing the [accepted types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept). By default every file type is accepted.
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
 | Type       |
 | ---------- |
@@ -103,7 +103,7 @@ If no value is provided, it is set from the [`MessageInputConfigService`](../ser
 
 If true, users can select multiple files to upload.
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
 | Type    |
 | ------- |
@@ -113,7 +113,7 @@ If no value is provided, it is set from the [`MessageInputConfigService`](../ser
 
 If true, users can mention other users in messages. You also [need to use the `AutocompleteTextarea`](../concepts/opt-in-architecure.mdx) for this feature to work.
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
 | Type    |
 | ------- |
@@ -123,27 +123,27 @@ If no value is provided, it is set from the [`MessageInputConfigService`](../ser
 
 You can provide your own template for the autocomplete list for user mentions. You also [need to use the `AutocompleteTextarea`](../concepts/opt-in-architecure.mdx) for this feature to work.
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
-| Type                                                                                                                                                               |
-| ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| [`TemplateRef<MentionAutcompleteListItemContext>`](<(https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts)>) |
+| Type                                                                                                                                                           |
+| -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [`TemplateRef<MentionAutcompleteListItemContext>`](https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts) |
 
 ### commandAutocompleteItemTemplate
 
 You can provide your own template for the autocomplete list for commands. You also [need to use the `AutocompleteTextarea`](../concepts/opt-in-architecure.mdx) for this feature to work.
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
-| Type                                                                                                                                                               |
-| ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| [`TemplateRef<CommandAutcompleteListItemContext>`](<(https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts)>) |
+| Type                                                                                                                                                           |
+| -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [`TemplateRef<CommandAutcompleteListItemContext>`](https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts) |
 
 ### mentionScope
 
 The scope for user mentions, either members of the current channel of members of the application.
 
-If no value is provided, it is set from the [`MessageInputConfigService`](../services/message-input-config.mdx).
+If no value is provided, it is set from the [`MessageInputConfigService`](../services/MessageInputConfigService.mdx).
 
 | Type                       |
 | -------------------------- |