Skip to content

Commit d7333eb

Browse files
guiseekguiseek
committed
refactor(album): melhora marcação de pessoas em fotos
1 parent 0ba2d08 commit d7333eb

File tree

74 files changed

+1236
-173
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

74 files changed

+1236
-173
lines changed

‎apps/devmx/public/icons/share.svg

+6
Loading

‎apps/devmx/public/portal-devpr-mx.png

4.47 KB
Loading

‎apps/devmx/public/templates/user-tag.html

+89
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<html
2+
dir="ltr"
3+
lang="pt-br"
4+
xmlns="http://www.w3.org/1999/xhtml"
5+
xmlns:o="urn:schemas-microsoft-com:office:office"
6+
>
7+
<head>
8+
<link rel="preconnect" href="https://fonts.googleapis.com" />
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="" />
10+
<link
11+
href="https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&amp;display=swap"
12+
rel="stylesheet"
13+
/>
14+
15+
<style type="text/css">
16+
body {
17+
font-family: 'Source Sans 3';
18+
font-style: normal;
19+
font-weight: 500;
20+
font-size: 16px;
21+
line-height: 18px;
22+
color: #000000;
23+
}
24+
25+
a:link,
26+
a:active,
27+
a:visited,
28+
a:hover {
29+
text-decoration-line: underline;
30+
color: #1A84FF;
31+
}
32+
33+
blockquote {
34+
margin: 2em 0;
35+
}
36+
37+
footer {
38+
font-family: 'Source Sans 3';
39+
font-style: normal;
40+
line-height: 18px;
41+
font-size: 16px;
42+
43+
order: 0;
44+
flex-grow: 0;
45+
gap: 3px;
46+
}
47+
48+
footer strong {
49+
font-weight: 700;
50+
}
51+
52+
footer p {
53+
margin: 0;
54+
}
55+
</style>
56+
</head>
57+
<body>
58+
<div>
59+
<h3>Faala {{name}}, belê?</h3>
60+
61+
<p style="font-size: 120%">
62+
Alguém marcou você no album de fotos "<a href="{{url}}">{{title}}</a>"
63+
da comunidade.
64+
</p>
65+
66+
<blockquote>
67+
<strong>
68+
🛟 Você pode remover sua tag da foto se preferir, algumas orientações
69+
para isso:
70+
</strong>
71+
<ol>
72+
<li>Clique no botão ☰ no lado direito acima da foto</li>
73+
<li>Cliique em Remover minha tag</li>
74+
<li>Salvar alterações</li>
75+
</ol>
76+
</blockquote>
77+
</div>
78+
79+
<hr />
80+
81+
<footer>
82+
<p>
83+
<strong>Não responda este e-mail</strong>, pois foi enviado de forma
84+
automatizada.
85+
</p>
86+
<p>Operações <a href="https://devparana.mx">devparana.mx</a>.</p>
87+
</footer>
88+
</body>
89+
</html>

‎apps/devmx/src/scss/_overrides.scss

+4
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
.cdk-overlay-backdrop {
2+
background-color: rgba(0,0,0,.9);
3+
}
4+
15
::ng-deep body .align-button.mat-mdc-button .mdc-button__label {
26
display: inline-flex;
37
align-items: center;

‎apps/devmx/src/styles.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
// @use '@angular/cdk/overlay-prebuilt.css';
1+
@use '@angular/cdk/overlay-prebuilt.css';
22
@use '@angular/material' as mat;
33
@use './scss/theming/app-shell' as app-shell;
44
@use './scss/theme' as theme;

‎apps/server/src/assets/templates/user-tag.html

+79-12
Large diffs are not rendered by default.

‎apps/server/src/envs/env.dev.ts

+1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { join } from 'node:path';
22

33
export const env = {
44
production: false,
5+
origin: 'http://localhost:4200',
56
db: {
67
name: process.env.DB_NAME,
78
host: process.env.DB_HOST,

‎apps/server/src/envs/env.prod.ts

+1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ if (!process.env.MONGO_URI) {
66

77
export const env = {
88
production: true,
9+
origin: 'https://devparana.mx',
910
db: {
1011
name: process.env.DB_NAME,
1112
host: process.env.DB_HOST,

‎packages/academy/domain/src/server/use-cases/update-course.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { UseCase, Course, EditableCourse } from '@devmx/shared-api-interfaces';
22
import { CoursesService } from '../services';
33

4-
export class UpdateCourseUseCase implements UseCase<EditableCourse, Course> {
4+
export class UpdateCourseUseCase implements UseCase<EditableCourse, Course | null> {
55
constructor(private coursesService: CoursesService) {}
66

77
async execute(data: EditableCourse) {

‎packages/academy/domain/src/server/use-cases/update-institution.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import {
66
} from '@devmx/shared-api-interfaces';
77

88
export class UpdateInstitutionUseCase
9-
implements UseCase<EditableInstitution, Institution>
9+
implements UseCase<EditableInstitution, Institution | null>
1010
{
1111
constructor(private institutionsService: InstitutionsService) {}
1212

‎packages/academy/domain/src/server/use-cases/update-subject.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
EditableSubject,
66
} from '@devmx/shared-api-interfaces';
77

8-
export class UpdateSubjectUseCase implements UseCase<EditableSubject, Subject> {
8+
export class UpdateSubjectUseCase implements UseCase<EditableSubject, Subject | null> {
99
constructor(private subjectsService: SubjectsService) {}
1010

1111
async execute(data: EditableSubject) {

‎packages/account/feature-shell/src/lib/containers/account/account.container.html

+79-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,81 @@
1-
<form [formGroup]="form" (submit)="onSubmit()">
1+
<mat-tab-group>
2+
<mat-tab label="Conta">
3+
<ng-template matTabContent>
4+
<form [formGroup]="form" (submit)="onSubmit()">
5+
<section>
6+
<devmx-account-user />
7+
8+
<devmx-account-contact />
9+
10+
<devmx-account-profile />
11+
12+
<fieldset>
13+
<legend>Informações públicas</legend>
14+
15+
<devmx-account-visibility />
16+
</fieldset>
17+
18+
<footer>
19+
<button mat-flat-button [disabled]="state()">
20+
{{state() ? state() : 'Salvar'}}
21+
</button>
22+
</footer>
23+
</section>
24+
25+
<aside>
26+
<div class="user-avatar">
27+
<devmx-avatar [src]="photo()" />
28+
<devmx-select-file
29+
class="select-file"
30+
(selectChange)="changePhoto($event)"
31+
/>
32+
</div>
33+
34+
<a
35+
mat-stroked-button
36+
[routerLink]="['/', 'sobre', form.controls.name.value]"
37+
>
38+
Acessar página pública
39+
</a>
40+
41+
<devmx-account-social />
42+
</aside>
43+
</form>
44+
</ng-template>
45+
</mat-tab>
46+
47+
<mat-tab label="Biografia">
48+
<ng-template matTabContent>
49+
<form [formGroup]="form" (submit)="onSubmit()">
50+
<section formGroupName="profile">
51+
<devmx-markdown-toolbar>
52+
<devmx-markdown-editor
53+
label="Bio"
54+
#editor="markdownEditor"
55+
formControlName="minibio"
56+
[maxRows]="64"
57+
/>
58+
<devmx-markdown-view
59+
[content]="form.profile.controls.minibio?.value ?? ''"
60+
/>
61+
</devmx-markdown-toolbar>
62+
</section>
63+
</form>
64+
</ng-template>
65+
</mat-tab>
66+
67+
<mat-tab label="Habilidades">
68+
<ng-template matTabContent>
69+
<form [formGroup]="form" (submit)="onSubmit()">
70+
<section>
71+
<devmx-account-skills />
72+
</section>
73+
</form>
74+
</ng-template>
75+
</mat-tab>
76+
</mat-tab-group>
77+
78+
<!-- <form [formGroup]="form" (submit)="onSubmit()">
279
<section>
380
<devmx-account-user />
481
@@ -53,4 +130,4 @@
53130
54131
<devmx-account-social />
55132
</aside>
56-
</form>
133+
</form> -->

‎packages/account/feature-shell/src/lib/containers/account/account.container.scss

+3-3
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@
44
padding: 1em;
55
display: flex;
66
flex-direction: column;
7-
max-width: 980px;
7+
// max-width: 980px;
88

99
form {
1010
gap: 64px;
1111
display: flex;
1212
flex-direction: row;
13-
13+
padding-top: 2em;
1414
@media (max-width: 768px) {
1515
flex-direction: column-reverse;
1616
}
@@ -36,7 +36,7 @@
3636
gap: 1em;
3737
display: flex;
3838
flex-direction: column;
39-
max-width: 580px;
39+
// max-width: 580px;
4040
}
4141

4242
fieldset {

‎packages/account/feature-shell/src/lib/containers/account/account.container.ts

+3
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { UserPhoto, provideUserPhoto } from '../../dialogs';
1111
import { MatButtonModule } from '@angular/material/button';
1212
import { AvatarComponent } from '@devmx/shared-ui-global';
1313
import { UpdatePhoto } from '@devmx/account-data-access';
14+
import { MatTabsModule } from '@angular/material/tabs';
1415
import { UserComponent } from './user/user.component';
1516
import { ReactiveFormsModule } from '@angular/forms';
1617
import { RouterLink } from '@angular/router';
@@ -27,6 +28,7 @@ import {
2728
ChangeDetectionStrategy,
2829
} from '@angular/core';
2930

31+
3032
@Component({
3133
selector: 'devmx-account',
3234
templateUrl: './account.container.html',
@@ -46,6 +48,7 @@ import {
4648
VisibilityComponent,
4749
SelectFileComponent,
4850
MatButtonModule,
51+
MatTabsModule,
4952
AvatarComponent,
5053
RouterLink,
5154
],

‎packages/account/ui-shared/src/lib/components/search-user/search-user-except.pipe.ts

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { UserRef } from '@devmx/shared-api-interfaces';
2+
import { Pipe, PipeTransform } from '@angular/core';
3+
4+
@Pipe({
5+
name: 'searchUserExcept',
6+
})
7+
export class SearchUserExceptPipe implements PipeTransform {
8+
transform<U extends UserRef>(value: U[], except: U[] = []) {
9+
if (except.length === 0) return value;
10+
11+
return value.filter((user) => except.some((u) => u.id !== user.id));
12+
}
13+
}

‎packages/account/ui-shared/src/lib/components/search-user/search-user.component.html

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
<mat-form-field>
22
<mat-label>{{ label() }}</mat-label>
3+
34
<input matInput [formControl]="control" [matAutocomplete]="auto" />
5+
46
<mat-hint>{{ hint() }}</mat-hint>
7+
58
<mat-autocomplete
69
#auto="matAutocomplete"
710
[displayWith]="displayFn"
811
(optionSelected)="onOptionSelected($event.option.value)"
912
>
1013
@if (userFacade.response$ | async; as response) {
1114
<!-- -->
12-
@for (option of response.data; track option.id) {
15+
@for (option of response.data | searchUserExcept: except(); track $index) {
1316
<mat-option [value]="option">{{ option.displayName }}</mat-option>
1417
}
1518
<!-- -->

‎packages/account/ui-shared/src/lib/components/search-user/search-user.component.ts

+6-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import { MatAutocompleteModule } from '@angular/material/autocomplete';
22
import { FormControl, ReactiveFormsModule } from '@angular/forms';
33
import { MatFormFieldModule } from '@angular/material/form-field';
4+
import { SearchUserExceptPipe } from './search-user-except.pipe';
45
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
6+
import { User, UserRef } from '@devmx/shared-api-interfaces';
57
import { MatInputModule } from '@angular/material/input';
68
import { UserFacade } from '@devmx/account-data-access';
7-
import { User } from '@devmx/shared-api-interfaces';
8-
import { AsyncPipe } from '@angular/common';
99
import { debounceTime, filter, startWith } from 'rxjs';
10+
import { AsyncPipe } from '@angular/common';
1011
import {
1112
input,
1213
inject,
@@ -23,6 +24,7 @@ import {
2324
imports: [
2425
ReactiveFormsModule,
2526
MatAutocompleteModule,
27+
SearchUserExceptPipe,
2628
MatFormFieldModule,
2729
MatInputModule,
2830
AsyncPipe,
@@ -39,6 +41,8 @@ export class SearchUserComponent {
3941

4042
control = new FormControl<string | User>('');
4143

44+
except = input<UserRef[]>([]);
45+
4246
constructor() {
4347
this.control.valueChanges
4448
.pipe(

‎packages/album/data-access/src/lib/application/photo.facade.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import {
1616
UploadPhotoUseCase,
1717
} from '@devmx/album-domain/client';
1818

19-
2019
export class PhotoFacade extends EntityFacade<Photo> {
2120
constructor(
2221
private createPhotoUseCase: CreatePhotoUseCase,
@@ -65,7 +64,7 @@ export class PhotoFacade extends EntityFacade<Photo> {
6564
}
6665

6766
updateTags(data: UpdatePhotoTags) {
68-
this.onUpdate(this.updatePhotoTagsUseCase.execute(data));
67+
return this.updatePhotoTagsUseCase.execute(data);
6968
}
7069

7170
delete(id: string) {

‎packages/album/data-access/src/lib/resolvers/index.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
export * from './album-resolver-wrapped';
1+
export * from './album-resolver-wrapped';
2+
export * from './photo-resolver-wrapped';

‎packages/album/data-access/src/lib/resolvers/photo-resolver-wrapped.ts

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { Params } from '@devmx/shared-api-interfaces';
2+
import { PhotoFacade } from '../application';
3+
import { distinctUntilChanged, filter } from 'rxjs';
4+
5+
export const photoResolverWrapped = (facade: PhotoFacade, params: Params) => {
6+
facade.loadOne(params['id']);
7+
return facade.selected$.pipe(
8+
distinctUntilChanged(),
9+
filter((photo) => !!photo)
10+
);
11+
};

0 commit comments

Comments
 (0)