Skip to content

Minds Frontend
Minds Frontend
Source
Select Git revision
...
Target
Select Git revision
 
Commits (2)
Hide whitespace changes
Inline Side-by-side
Showing with 11 additions and 192 deletions
src/app/modules/onboarding/channel/onboarding.component.scss
View file @ 79d594ee
......@@ -336,6 +336,7 @@ m-channel--onboarding {
line-height: 20px;
margin: 8px 0 16px;
padding: 0;
text-align: center;
&.m-channelOnboardingSlide__subtext-note {
font-size: 12px;
......
src/app/modules/onboarding/channel/onboarding.component.ts
View file @ 79d594ee
......@@ -20,8 +20,8 @@ import { Modal } from "../../../common/components/modal/modal.component";
</div>
<ng-template dynamic-host></ng-template>
<div class="m-channelOnboarding__buttons" *ngIf="service.currentSlide > 0">
<div class="m-channelOnboarding__previous" (click)="service.previous()">
<div class="m-channelOnboarding__buttons">
<div class="m-channelOnboarding__previous" (click)="service.previous()" [ngStyle]="{'visibility': service.currentSlide === 0 ? 'hidden' : 'visible'}">
Previous
</div>
<div class="m-channelOnboarding__next" *ngIf="service.currentSlide +1 < service.slides.length"
......
src/app/modules/onboarding/channel/onboarding.service.ts
View file @ 79d594ee
import { WelcomeOnboardingComponent } from "./welcome/welcome.component";
import { TopicsOnboardingComponent } from "./topics/topics.component";
import { SubscriptionsOnboardingComponent } from "./subscriptions/subscriptions.component";
import { ChannelSetupOnboardingComponent } from "./channel/channel.component";
......@@ -10,7 +9,6 @@ import { Session } from "../../../services/session";
export class ChannelOnboardingService {
slides = [
WelcomeOnboardingComponent,
TopicsOnboardingComponent,
SubscriptionsOnboardingComponent,
// GroupsOnboardingComponent,
......
src/app/modules/onboarding/channel/topics/topics.component.spec.ts
View file @ 79d594ee
......@@ -87,8 +87,9 @@ describe('TopicsOnboardingComponent', () => {
jasmine.clock().uninstall();
});
it('should have a title', () => {
expect(fixture.debugElement.query(By.css('h2')).nativeElement.textContent).toBe('What topics are you most interested in?');
it('should have text', () => {
expect(fixture.debugElement.query(By.css('h2:first-child')).nativeElement.textContent).toContain('Welcome to Minds!');
expect(fixture.debugElement.query(By.css('h2.m-channelOnboardingSlide__subtext')).nativeElement.textContent).toContain('What topics are you most interested in?');
});
it('should create a hashtag', () => {
......
src/app/modules/onboarding/channel/topics/topics.component.ts
View file @ 79d594ee
......@@ -9,7 +9,11 @@ type Hashtag = {
selector: 'm-onboarding--topics',
template: `
<div class="m-channelOnboarding__slide">
<h2>What topics are you most interested in?</h2>
<h2>Welcome to Minds!</h2>
<h2 class="m-channelOnboardingSlide__subtext">
What topics are you most interested in?
</h2>
<ul class="m-channelOnboardingSlideSection__list">
<div class="mdl-spinner mdl-js-spinner is-active" [mdl] [hidden]="!inProgress"></div>
......
src/app/modules/onboarding/channel/welcome/welcome.component.scss deleted 100644 → 0
View file @ 59c29bc5
m-onboarding--welcome {
padding-bottom: 16px;
}
src/app/modules/onboarding/channel/welcome/welcome.component.spec.ts deleted 100644 → 0
View file @ 59c29bc5
import { async, ComponentFixture, fakeAsync, TestBed } from '@angular/core/testing';
import { WelcomeOnboardingComponent } from "./welcome.component";
import { clientMock } from "../../../../../tests/client-mock.spec";
import { By } from "@angular/platform-browser";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { MaterialMock } from "../../../../../tests/material-mock.spec";
import { MaterialSwitchMock } from "../../../../../tests/material-switch-mock.spec";
import { AbbrPipe } from "../../../../common/pipes/abbr";
import { Client } from "../../../../services/api/client";
import { DebugElement } from "@angular/core";
describe('WelcomeOnboardingComponent', () => {
let comp: WelcomeOnboardingComponent;
let fixture: ComponentFixture<WelcomeOnboardingComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
FormsModule,
ReactiveFormsModule,
],
declarations: [
MaterialMock,
MaterialSwitchMock,
AbbrPipe,
WelcomeOnboardingComponent
],
providers: [
{ provide: Client, useValue: clientMock },
]
})
.compileComponents();
}));
beforeEach((done) => {
jasmine.MAX_PRETTY_PRINT_DEPTH = 10;
jasmine.clock().uninstall();
jasmine.clock().install();
fixture = TestBed.createComponent(WelcomeOnboardingComponent);
window.Minds = <any>{
user: {
guid: 1,
name: 'test',
briefdescription: '',
opted_in_hashtags: 1
}
};
clientMock.response = {};
comp = fixture.componentInstance;
fixture.detectChanges();
if (fixture.isStable()) {
done();
} else {
fixture.whenStable().then(() => {
fixture.detectChanges();
done();
});
}
});
afterEach(() => {
jasmine.clock().uninstall();
});
it('should have a title', () => {
expect(fixture.debugElement.query(By.css('h2')).nativeElement.textContent).toBe('Welcome to Minds!');
});
it('should have a subtext', () => {
expect(fixture.debugElement.query(By.css('.m-channelOnboardingSlide__column .m-channelOnboardingSlide__subtext:first-child')).nativeElement.textContent)
.toContain('Before you get started, there are a few things we need to know to provide you with the best experience.');
expect(fixture.debugElement.query(By.css('.m-channelOnboardingSlide__column .m-channelOnboardingSlide__subtext:last-child')).nativeElement.textContent)
.toContain('First off, how often do you post to social media?');
});
it('should have a list with frequencies', () => {
const list: DebugElement = fixture.debugElement.query(By.css('ul.m-channelOnboardingSlide__frequency'));
expect(list).not.toBeNull();
const options = fixture.debugElement.queryAll(By.css('ul.m-channelOnboardingSlide__frequency > li'));
expect(options.length).toBe(3);
expect(options[0].nativeElement.textContent).toContain('Rarely');
expect(options[1].nativeElement.textContent).toContain('Sometimes');
expect(options[2].nativeElement.textContent).toContain('Frequently');
});
it('should save the frequency when clicked', fakeAsync(() => {
const url = 'api/v2/onboarding/creator_frequency';
const option = fixture.debugElement.query(By.css('ul.m-channelOnboardingSlide__frequency > li:first-child'));
spyOn(comp.onClose, 'emit').and.stub();
option.nativeElement.click();
fixture.detectChanges();
jasmine.clock().tick(10);
expect(clientMock.post).toHaveBeenCalled();
expect(clientMock.post.calls.mostRecent().args[0]).toBe(url);
expect(clientMock.post.calls.mostRecent().args[1]).toEqual({ value: 'rarely' });
expect(comp.onClose.emit).toHaveBeenCalled();
}));
});
src/app/modules/onboarding/channel/welcome/welcome.component.ts deleted 100644 → 0
View file @ 59c29bc5
import { Component, EventEmitter, Output } from '@angular/core';
import { Client } from "../../../../services/api/client";
@Component({
selector: 'm-onboarding--welcome',
template: `
<div class="m-channelOnboarding__slide">
<h2>Welcome to Minds!</h2>
<div class="m-channelOnboardingSlide__column">
<p class="m-channelOnboardingSlide__subtext">
Before you get started, there are a few things we need to know to provide
you with the best experience.
</p>
<p class="m-channelOnboardingSlide__subtext">
First off, how often do you post to social media?
</p>
</div>
<div class="m-channelOnboardingSlide__column">
<ul class="m-channelOnboardingSlide__frequency">
<li (click)="select('rarely')">
Rarely
<i class="material-icons">
keyboard_arrow_right
</i>
</li>
<li (click)="select('sometimes')">
Sometimes
<i class="material-icons">
keyboard_arrow_right
</i>
</li>
<li (click)="select('frequently')">
Frequently
<i class="material-icons">
keyboard_arrow_right
</i>
</li>
</ul>
</div>
</div>
`
})
export class WelcomeOnboardingComponent {
static items = ['creator_frequency'];
static canSkip: boolean = false;
minds = window.Minds;
@Output() onClose: EventEmitter<any> = new EventEmitter();
constructor(
private client: Client,
) { }
async select(option: 'rarely' | 'sometimes' | 'frequently') {
try {
await this.client.post('api/v2/onboarding/creator_frequency', { value: option });
} catch (e) {
console.error(e);
}
this.onClose.emit();
}
}
\ No newline at end of file
src/app/modules/onboarding/onboarding.module.ts
View file @ 79d594ee
......@@ -11,7 +11,6 @@ import { OnboardingFeedComponent } from './feed.component';
import { OnboardingService } from './onboarding.service';
import { OnboardingModalComponent } from './modal.component';
import { ChannelOnboardingService } from "./channel/onboarding.service";
import { WelcomeOnboardingComponent } from "./channel/welcome/welcome.component";
import { TopicsOnboardingComponent } from "./channel/topics/topics.component";
import { ChannelOnboardingComponent } from "./channel/onboarding.component";
import { SubscriptionsOnboardingComponent } from "./channel/subscriptions/subscriptions.component";
......@@ -41,7 +40,6 @@ import { Session } from "../../services/session";
OnboardingFeedComponent,
OnboardingModalComponent,
ChannelOnboardingComponent,
WelcomeOnboardingComponent,
TopicsOnboardingComponent,
SubscriptionsOnboardingComponent,
GroupsOnboardingComponent,
......@@ -63,7 +61,6 @@ import { Session } from "../../services/session";
],
entryComponents: [
OnboardingModalComponent,
WelcomeOnboardingComponent,
TopicsOnboardingComponent,
SubscriptionsOnboardingComponent,
ChannelsTileComponent,
......