From c6dc5375c752c831531cab9c14941257277ce23b Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Thu, 30 Oct 2025 12:59:19 +0200 Subject: [PATCH 1/2] UI: Add show GitHub button to show star repository --- ui-ngx/src/app/core/http/admin.service.ts | 11 ++++-- .../github-badge/github-badge.component.html | 26 ++++++++++++++ .../github-badge/github-badge.component.scss | 35 +++++++++++++++++++ .../github-badge/github-badge.component.ts | 34 ++++++++++++++++++ .../src/app/modules/home/home.component.html | 1 + ui-ngx/src/app/modules/home/home.module.ts | 2 ++ ui-ngx/src/styles.scss | 3 ++ 7 files changed, 110 insertions(+), 2 deletions(-) create mode 100644 ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.html create mode 100644 ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.scss create mode 100644 ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.ts diff --git a/ui-ngx/src/app/core/http/admin.service.ts b/ui-ngx/src/app/core/http/admin.service.ts index 55eaa16b90..02b8153836 100644 --- a/ui-ngx/src/app/core/http/admin.service.ts +++ b/ui-ngx/src/app/core/http/admin.service.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; import { defaultHttpOptionsFromConfig, RequestConfig } from './http-utils'; -import { Observable } from 'rxjs'; +import { Observable, of } from 'rxjs'; import { HttpClient } from '@angular/common/http'; import { AdminSettings, @@ -32,7 +32,7 @@ import { UpdateMessage } from '@shared/models/settings.models'; import { EntitiesVersionControlService } from '@core/http/entities-version-control.service'; -import { tap } from 'rxjs/operators'; +import { catchError, map, tap } from 'rxjs/operators'; import { LoginResponse } from '@shared/models/login.models'; @Injectable({ @@ -149,4 +149,11 @@ export class AdminService { public getMailConfigTemplate(config?: RequestConfig): Observable> { return this.http.get>('/api/mail/config/template', defaultHttpOptionsFromConfig(config)); } + + public getGitHubStar(config?: RequestConfig): Observable { + return this.http.get('https://api.github.com/repos/thingsboard/thingsboard', defaultHttpOptionsFromConfig(config)).pipe( + catchError(() => of({})), + map((res: any) => res?.stargazers_count ?? 0) + ) + } } diff --git a/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.html b/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.html new file mode 100644 index 0000000000..6bcab29793 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.html @@ -0,0 +1,26 @@ + +@if (githubStar > 0) { +
+ + mdi:github +
GitHubstar{{ githubStar | number }}
+ + +
+} diff --git a/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.scss b/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.scss new file mode 100644 index 0000000000..ee1d306f07 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.scss @@ -0,0 +1,35 @@ +/** + * Copyright © 2016-2025 The Thingsboard Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +:host { + &:has(section) { + height: 100%; + } + --mat-outlined-button-horizontal-padding: 8px; + --mdc-outlined-button-container-height: 30px; + --mdc-outlined-button-label-text-size: 12px; + + .mdc-button { + background-color: rgba(255, 255, 255, 0.12); + + &:hover { + background-color: rgba(255, 255, 255, 0.20); + } + } + + .button-label { + margin-top: 1px; + } +} diff --git a/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.ts b/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.ts new file mode 100644 index 0000000000..8d1cedeb5a --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/github-badge/github-badge.component.ts @@ -0,0 +1,34 @@ +/// +/// Copyright © 2016-2025 The Thingsboard Authors +/// +/// Licensed under the Apache License, Version 2.0 (the "License"); +/// you may not use this file except in compliance with the License. +/// You may obtain a copy of the License at +/// +/// http://www.apache.org/licenses/LICENSE-2.0 +/// +/// Unless required by applicable law or agreed to in writing, software +/// distributed under the License is distributed on an "AS IS" BASIS, +/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +/// See the License for the specific language governing permissions and +/// limitations under the License. +/// + +import { Component } from '@angular/core'; +import { AdminService } from '@core/http/admin.service'; + +@Component({ + selector: 'tb-github-badge', + templateUrl: './github-badge.component.html', + styleUrl: './github-badge.component.scss' +}) +export class GithubBadgeComponent { + + githubStar = 0; + + constructor(private adminService: AdminService) { + this.adminService.getGitHubStar().subscribe(star => { + this.githubStar = star; + }); + } +} diff --git a/ui-ngx/src/app/modules/home/home.component.html b/ui-ngx/src/app/modules/home/home.component.html index 48b6105bf9..3d4e35f1d0 100644 --- a/ui-ngx/src/app/modules/home/home.component.html +++ b/ui-ngx/src/app/modules/home/home.component.html @@ -62,6 +62,7 @@ placeholder="{{ 'common.enter-search' | translate }}"/> +