Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: custom autocompletes #672

Merged
merged 3 commits into from
Dec 4, 2024
Merged

feat: custom autocompletes #672

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e8f5c49
feat: custom autocompletes
szuperaz Dec 2, 2024
93fe666
chore: copy generated docs to new docs content
szuperaz Dec 3, 2024
5c2be09
chore: update link formats for new docs system
szuperaz Dec 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,13 @@ Check out our current openings and apply via [Stream's website](https://getstrea

### Install with NPM

Run this command if you are using **Angular 19**:

```shell
# Some SDK depedencies doesn't yet have official support for Angular 19, so we need to add --force flag until then
npm install stream-chat-angular stream-chat @ngx-translate/core@15 ngx-float-ui@18 --force
```

Supported Angular versions: **Angular 15-18**

Run this command if you are using **Angular 18**:
Expand Down
6 changes: 3 additions & 3 deletions copy-generated-component-docs.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,19 +62,19 @@ fs.readdir(generatedDocsPath, (err: any, files: string[]) => {
const propertiesContent = extractProperties(generatedFileContent);

fs.readFile(
`${componentDocsPath}/${file}x`,
`${componentDocsPath}/${file}`,
'utf8',
(err: any, docFile: any) => {
if (err)
throw new Error(
`${componentDocsPath}/${file}x couldn't be opened, error: ${err}, make sure that this file exists`
`${componentDocsPath}/${file} couldn't be opened, error: ${err}, make sure that this file exists`
);

if (file !== '_category_.json') {
const result = insertGeneratedParts(docFile, propertiesContent);

fs.writeFile(
`${componentDocsPath}/${file}x`,
`${componentDocsPath}/${file}`,
result,
'utf8',
(err: any) => {
Expand Down
23 changes: 18 additions & 5 deletions copy-generated-service-docs.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,18 +31,31 @@ fs.readdir(sourcePath, (err: any, files: string[]) => {
}

// Remove the thre prefix from the title
const result = data
.replace(/# Class:/g, '#')
.replace('<T\\>', '')
.replace('\\', '');
const result =
`---` +
`\n` +
`title: ${file.replace('.md', '')}` +
`\n` +
`slug: /chat/docs/sdk/angular/services/${file.replace('.md', '')}/` +
`\n` +
`---` +
'\n\n' +
data
.replace(`# Class: ${file.replace('.md', '')}`, '')
.replace(
/\b(?!README)(\w+)\.md\b/g,
'/chat/docs/sdk/angular/services/$1'
)
.replace('<T\\>', '')
.replace('\\', '');

fs.writeFile(`${sourcePath}/${file}`, result, 'utf8', (err: any) => {
if (err) {
throw err;
}
fs.copyFile(
`${sourcePath}/${file}`,
`${serviceDocsTargetPath}/${file}x`,
`${serviceDocsTargetPath}/${file}`,
(err: any) => {
if (err) {
throw err;
Expand Down
6 changes: 5 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,11 @@
"build:sample-app": "npm run config:prod && ng build --stats-json --project sample-app",
"preanalyze:sample-app": "npm run build:sample-app",
"analyze:sample-app": "webpack-bundle-analyzer dist/sample-app/stats.json",
"copy-css": "rm -rf projects/stream-chat-angular/src/assets/styles && copyfiles --up 5 \"node_modules/@stream-io/stream-chat-css/dist/v2/**/*\" projects/stream-chat-angular/src/assets/styles && copyfiles --up 5 \"node_modules/@stream-io/stream-chat-css/dist/assets/**/*\" projects/stream-chat-angular/src/assets/assets"
"copy-css": "rm -rf projects/stream-chat-angular/src/assets/styles && copyfiles --up 5 \"node_modules/@stream-io/stream-chat-css/dist/v2/**/*\" projects/stream-chat-angular/src/assets/styles && copyfiles --up 5 \"node_modules/@stream-io/stream-chat-css/dist/assets/**/*\" projects/stream-chat-angular/src/assets/assets",
"generate-docs": "npm run typedoc:services && npm run typedoc:components && npm run copy-docs:v5",
"typedoc:services": "typedoc --plugin typedoc-plugin-markdown --plugin typedoc-plugin-reference-excluder --cleanOutputDir true --excludeConstructors true --hideBreadcrumbs true --hideInPageTOC true --excludePrivate true --out temp-service-docs --exclude '!**/*service.ts' --excludeNotDocumented --tsconfig projects/stream-chat-angular/tsconfig.lib.json projects/stream-chat-angular/src/public-api.ts",
"typedoc:components": "typedoc --plugin typedoc-plugin-markdown --plugin typedoc-plugin-reference-excluder --cleanOutputDir true --excludeConstructors true --sort source-order --hideBreadcrumbs true --hideInPageTOC true --excludePrivate true --excludeNotDocumented --out temp-component-docs --exclude '!**/*component.ts' --tsconfig projects/stream-chat-angular/tsconfig.lib.json projects/stream-chat-angular/src/public-api.ts",
"copy-docs:v5": "ts-node copy-generated-service-docs.ts ../docs/data/docs/chat-sdk/angular/v5-latest/06-services & (ts-node remove-generated-component-docs-content ../docs/data/docs/chat-sdk/angular/v5-latest/05-components && ts-node copy-generated-component-docs.ts ../docs/data/docs/chat-sdk/angular/v5-latest/05-components)"
},
"lint-staged": {
"**/*": [
Expand Down
6 changes: 3 additions & 3 deletions projects/stream-chat-angular/src/lib/attachment.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,13 @@ export class AttachmentService<
*/
attachmentUploadInProgressCounter$ = new BehaviorSubject<number>(0);
/**
* Emits the state of the uploads ([`AttachmentUpload[]`](https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts)), it adds a state (`success`, `error` or `uploading`) to each file the user selects for upload. It is used by the [`AttachmentPreviewList`](../components/AttachmentPreviewListComponent.mdx) to display the attachment previews.
* Emits the state of the uploads ([`AttachmentUpload[]`](https://github.com/GetStream/stream-chat-angular/blob/master/projects/stream-chat-angular/src/lib/types.ts)), it adds a state (`success`, `error` or `uploading`) to each file the user selects for upload. It is used by the [`AttachmentPreviewList`](/chat/docs/sdk/angular/components/AttachmentPreviewListComponent/) to display the attachment previews.
*/
attachmentUploads$: Observable<AttachmentUpload[]>;
/**
* You can get and set the list if uploaded custom attachments
*
* By default the SDK components won't display these, but you can provide your own `customAttachmentPreviewListTemplate$` and `customAttachmentListTemplate$` for the [`CustomTemplatesService`](../../services/CustomTemplatesService).
* By default the SDK components won't display these, but you can provide your own `customAttachmentPreviewListTemplate$` and `customAttachmentListTemplate$` for the [`CustomTemplatesService`](/chat/docs/sdk/angular/services/CustomTemplatesService/).
*/
customAttachments$ = new BehaviorSubject<Attachment<T>[]>([]);
/**
Expand Down Expand Up @@ -210,7 +210,7 @@ export class AttachmentService<
/**
* You can add custom `image`, `video` and `file` attachments using this method.
*
* Note: If you just want to use your own CDN for file uploads, you don't necessary need this method, you can just specify you own upload function in the [`ChannelService`](./ChannelService.mdx)
* Note: If you just want to use your own CDN for file uploads, you don't necessary need this method, you can just specify you own upload function in the [`ChannelService`](/chat/docs/sdk/angular/services/ChannelService/)
* @param attachment
*/
addAttachment(attachment: Attachment<T>) {
Expand Down
2 changes: 1 addition & 1 deletion projects/stream-chat-angular/src/lib/avatar-placeholder/avatar-placeholder.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {
} from '../types';

/**
* The `AvatarPlaceholder` component displays the [default avatar](./AvatarComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This component is used by the SDK internally, you likely won't need to use it.
* The `AvatarPlaceholder` component displays the [default avatar](/chat/docs/sdk/angular/components/AvatarComponent/) unless a [custom template](/chat/docs/sdk/angular/services/CustomTemplatesService/) is provided. This component is used by the SDK internally, you likely won't need to use it.
*/
@Component({
selector: 'stream-avatar-placeholder',
Expand Down
30 changes: 15 additions & 15 deletions projects/stream-chat-angular/src/lib/channel.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ export class ChannelService<
* Emits the currently loaded and [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel list.
*
* :::important
* If you want to subscribe to channel events, you need to manually reenter Angular's change detection zone, our [Change detection guide](../concepts/change-detection.mdx) explains this in detail.
* If you want to subscribe to channel events, you need to manually reenter Angular's change detection zone, our [Change detection guide](/chat/docs/sdk/angular/concepts/change-detection/) explains this in detail.
* :::
*/
channels$: Observable<Channel<T>[] | undefined>;
Expand All @@ -72,7 +72,7 @@ export class ChannelService<
* Emits the currently active channel.
*
* :::important
* If you want to subscribe to channel events, you need to manually reenter Angular's change detection zone, our [Change detection guide](../concepts/change-detection.mdx) explains this in detail.
* If you want to subscribe to channel events, you need to manually reenter Angular's change detection zone, our [Change detection guide](/chat/docs/sdk/angular/concepts/change-detection/) explains this in detail.
* :::
*
* The active channel will always be marked as read when a new message is received
Expand Down Expand Up @@ -121,7 +121,7 @@ export class ChannelService<
/**
* If you're using [semantic filters for moderation](https://getstream.io/automated-moderation/docs/automod_configuration/?q=semantic%20filters) you can set up rules for bouncing messages.
*
* If a message is bounced, it will be emitted via this `Observable`. The built-in [`MessageBouncePrompt` component](../../components/MessageBouncePromptComponent) will display the bounce option to the user if a bounced message is clicked.
* If a message is bounced, it will be emitted via this `Observable`. The built-in [`MessageBouncePrompt` component](/chat/docs/sdk/angular/components/MessageBouncePromptComponent/) will display the bounce option to the user if a bounced message is clicked.
*/
bouncedMessage$: BehaviorSubject<StreamMessage<T> | undefined>;
/**
Expand All @@ -137,7 +137,7 @@ export class ChannelService<
*/
activeChannelUnreadCount?: number;
/**
* Custom event handler to call if a new message received from a channel that is not being watched, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels)
* Custom event handler to call if a new message received from a channel that is not being watched, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/)
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -149,7 +149,7 @@ export class ChannelService<
) => void
) => void;
/**
* Custom event handler to call when the user is added to a channel, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when the user is added to a channel, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -161,7 +161,7 @@ export class ChannelService<
) => void
) => void;
/**
* Custom event handler to call when the user is removed from a channel, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when the user is removed from a channel, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -173,7 +173,7 @@ export class ChannelService<
) => void
) => void;
/**
* Custom event handler to call when a channel is deleted, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when a channel is deleted, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -189,7 +189,7 @@ export class ChannelService<
parentMessageSetter: (message: StreamMessage<T> | undefined) => void
) => void;
/**
* Custom event handler to call when a channel is updated, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when a channel is updated, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -205,7 +205,7 @@ export class ChannelService<
parentMessageSetter: (message: StreamMessage | undefined) => void
) => void;
/**
* Custom event handler to call when a channel is truncated, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when a channel is truncated, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -221,7 +221,7 @@ export class ChannelService<
parentMessageSetter: (message: StreamMessage<T> | undefined) => void
) => void;
/**
* Custom event handler to call when a channel becomes hidden, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when a channel becomes hidden, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -237,7 +237,7 @@ export class ChannelService<
parentMessageSetter: (message: StreamMessage<T> | undefined) => void
) => void;
/**
* Custom event handler to call when a channel becomes visible, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call when a channel becomes visible, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand All @@ -253,7 +253,7 @@ export class ChannelService<
parentMessageSetter: (message: StreamMessage<T> | undefined) => void
) => void;
/**
* Custom event handler to call if a new message received from a channel that is being watched, provide an event handler if you want to override the [default channel list ordering](./ChannelService.mdx/#channels).
* Custom event handler to call if a new message received from a channel that is being watched, provide an event handler if you want to override the [default channel list ordering](/chat/docs/sdk/angular/services/ChannelService/#channels/).
*
* If you're adding a new channel, make sure that it's a [watched](https://getstream.io/chat/docs/javascript/watch_channel/?language=javascript) channel.
*/
Expand Down Expand Up @@ -775,7 +775,7 @@ export class ChannelService<
}

/**
* Resets the `activeChannel$`, `channels$` and `activeChannelMessages$` Observables. Useful when disconnecting a chat user, use in combination with [`disconnectUser`](./ChatClientService.mdx/#disconnectuser).
* Resets the `activeChannel$`, `channels$` and `activeChannelMessages$` Observables. Useful when disconnecting a chat user, use in combination with [`disconnectUser`](/chat/docs/sdk/angular/services/ChatClientService/#disconnectuser/).
*/
reset() {
this.deselectActiveChannel();
Expand Down Expand Up @@ -961,7 +961,7 @@ export class ChannelService<

/**
* Uploads files to the channel. If you want to know more about [file uploads](https://getstream.io/chat/docs/javascript/file_uploads/?language=javascript) check out the platform documentation.
* @param uploads the attachments to upload (output of the [`AttachmentService`](./AttachmentService.mdx))
* @param uploads the attachments to upload (output of the [`AttachmentService`](/chat/docs/sdk/angular/services/AttachmentService/))
* @returns the result of file upload requests
*/
async uploadAttachments(
Expand Down Expand Up @@ -1042,7 +1042,7 @@ export class ChannelService<

/**
* Deletes an uploaded file by URL. If you want to know more about [file uploads](https://getstream.io/chat/docs/javascript/file_uploads/?language=javascript) check out the platform documentation
* @param attachmentUpload Attachment to be deleted (output of the [`AttachmentService`](./AttachmentService.mdx))
* @param attachmentUpload Attachment to be deleted (output of the [`AttachmentService`](/chat/docs/sdk/angular/services/AttachmentService/))
*/
async deleteAttachment(attachmentUpload: AttachmentUpload) {
const channel = this.activeChannelSubject.getValue()!;
Expand Down
2 changes: 1 addition & 1 deletion projects/stream-chat-angular/src/lib/channel/channel.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { ThemeService } from '../theme.service';
import { CustomTemplatesService } from '../custom-templates.service';

/**
* The `Channel` component is a container component that displays the [`ChannelHeader`](./ChannelHeaderComponent.mdx), [`MessageList`](./MessageListComponent.mdx), [`NotificationList`](./NotificationListComponent.mdx) and [`MessageInput`](./MessageInputComponent.mdx) components. You can also provide the [`Thread`](./ThreadComponent.mdx) component to use message [threads](https://getstream.io/chat/docs/javascript/threads/?language=javascript).
* The `Channel` component is a container component that displays the [`ChannelHeader`](/chat/docs/sdk/angular/components/ChannelHeaderComponent/), [`MessageList`](/chat/docs/sdk/angular/components/MessageListComponent), [`NotificationList`](/chat/docs/sdk/angular/components/NotificationListComponent/) and [`MessageInput`](/chat/docs/sdk/angular/components/MessageInputComponent/) components. You can also provide the [`Thread`](/chat/docs/sdk/angular/components/ThreadComponent/) component to use message [threads](https://getstream.io/chat/docs/javascript/threads/?language=javascript).
*/
@Component({
selector: 'stream-channel',
Expand Down
Loading
Loading