Skip to content

Commit aa9dfb7

Browse files
richardhjtanrichardhjtan
authored
Merge pull request #2147 from cardstack/CS-7991-sorting-crm-edit-fields
CS-7991 Sort crm edit fields
2 parents 71dc885 + cdfc006 commit aa9dfb7

File tree

5 files changed

+230
-2
lines changed

5 files changed

+230
-2
lines changed

‎packages/experiments-realm/crm/account.gts

+35
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
linksToMany,
1212
StringField,
1313
} from 'https://cardstack.com/base/card-api';
14+
import { FieldContainer } from '@cardstack/boxel-ui/components';
1415
import { Address as AddressField } from '../address';
1516
import { Company } from './company';
1617
import { Contact } from './contact';
@@ -40,6 +41,39 @@ const taskSource = {
4041
name: 'CRMTask',
4142
};
4243

44+
class EditTemplate extends Component<typeof Account> {
45+
<template>
46+
<div class='account-form'>
47+
<FieldContainer @label='Company Name'>
48+
<@fields.company />
49+
</FieldContainer>
50+
<FieldContainer @label='Primary Contact'>
51+
<@fields.primaryContact />
52+
</FieldContainer>
53+
<FieldContainer @label='Contacts'>
54+
<@fields.contacts />
55+
</FieldContainer>
56+
<FieldContainer @label='Shipping Address'>
57+
<@fields.shippingAddress />
58+
</FieldContainer>
59+
<FieldContainer @label='Billing Address'>
60+
<@fields.billingAddress />
61+
</FieldContainer>
62+
<FieldContainer @label='Urgency Tag'>
63+
<@fields.urgencyTag />
64+
</FieldContainer>
65+
</div>
66+
<style scoped>
67+
.account-form {
68+
display: flex;
69+
flex-direction: column;
70+
gap: var(--boxel-sp-lg);
71+
padding: var(--boxel-sp-xl);
72+
}
73+
</style>
74+
</template>
75+
}
76+
4377
class IsolatedTemplate extends Component<typeof Account> {
4478
get hasCompanyInfo() {
4579
return this.args.model?.website || this.args.model?.headquartersAddress;
@@ -1263,6 +1297,7 @@ export class Account extends CardDef {
12631297
},
12641298
});
12651299

1300+
static edit = EditTemplate;
12661301
static isolated = IsolatedTemplate;
12671302
static embedded = EmbeddedTemplate;
12681303
static fitted = FittedTemplate;

‎packages/experiments-realm/crm/company.gts

+35
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,42 @@ import {
1010
field,
1111
contains,
1212
} from 'https://cardstack.com/base/card-api';
13+
import { FieldContainer } from '@cardstack/boxel-ui/components';
1314
import BuildingIcon from '@cardstack/boxel-icons/building';
1415

16+
class CompanyEditTemplate extends Component<typeof Company> {
17+
<template>
18+
<div class='company-form'>
19+
<FieldContainer @label='Name'>
20+
<@fields.name />
21+
</FieldContainer>
22+
<FieldContainer @label='Industry'>
23+
<@fields.industry />
24+
</FieldContainer>
25+
<FieldContainer @label='Headquarters Address'>
26+
<@fields.headquartersAddress />
27+
</FieldContainer>
28+
<FieldContainer @label='Phone Number'>
29+
<@fields.phone />
30+
</FieldContainer>
31+
<FieldContainer @label='Website'>
32+
<@fields.website />
33+
</FieldContainer>
34+
<FieldContainer @label='Stock Symbol'>
35+
<@fields.stockSymbol />
36+
</FieldContainer>
37+
</div>
38+
<style scoped>
39+
.company-form {
40+
display: flex;
41+
flex-direction: column;
42+
gap: var(--boxel-sp-lg);
43+
padding: var(--boxel-sp-xl);
44+
}
45+
</style>
46+
</template>
47+
}
48+
1549
class ViewCompanyTemplate extends Component<typeof Company> {
1650
<template>
1751
<div class='company-group'>
@@ -39,6 +73,7 @@ export class Company extends CardDef {
3973
},
4074
});
4175

76+
static edit = CompanyEditTemplate;
4277
static embedded = ViewCompanyTemplate;
4378
static atom = ViewCompanyTemplate;
4479
}

‎packages/experiments-realm/crm/contact.gts

+50-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
containsMany,
99
} from 'https://cardstack.com/base/card-api';
1010

11-
import { Avatar } from '@cardstack/boxel-ui/components';
11+
import { Avatar, FieldContainer } from '@cardstack/boxel-ui/components';
1212
import AvatarGroup from '../components/avatar-group';
1313

1414
import ContactIcon from '@cardstack/boxel-icons/contact';
@@ -48,6 +48,54 @@ export class SocialLinkField extends ContactLinkField {
4848
];
4949
}
5050

51+
class EditTemplate extends Component<typeof Contact> {
52+
<template>
53+
<div class='contact-form'>
54+
<FieldContainer @label='First Name'>
55+
<@fields.firstName />
56+
</FieldContainer>
57+
<FieldContainer @label='Last Name'>
58+
<@fields.lastName />
59+
</FieldContainer>
60+
<FieldContainer @label='Position'>
61+
<@fields.position />
62+
</FieldContainer>
63+
<FieldContainer @label='Company'>
64+
<@fields.company />
65+
</FieldContainer>
66+
<FieldContainer @label='Department'>
67+
<@fields.department />
68+
</FieldContainer>
69+
<FieldContainer @label='Primary Email'>
70+
<@fields.primaryEmail />
71+
</FieldContainer>
72+
<FieldContainer @label='Secondary Email'>
73+
<@fields.secondaryEmail />
74+
</FieldContainer>
75+
<FieldContainer @label='Phone Number'>
76+
<@fields.phoneMobile />
77+
</FieldContainer>
78+
<FieldContainer @label='Office Phone Number'>
79+
<@fields.phoneOffice />
80+
</FieldContainer>
81+
<FieldContainer @label='Social Links'>
82+
<@fields.socialLinks />
83+
</FieldContainer>
84+
<FieldContainer @label='Status'>
85+
<@fields.statusTag />
86+
</FieldContainer>
87+
</div>
88+
<style scoped>
89+
.contact-form {
90+
display: flex;
91+
flex-direction: column;
92+
gap: var(--boxel-sp-lg);
93+
padding: var(--boxel-sp-xl);
94+
}
95+
</style>
96+
</template>
97+
}
98+
5199
class EmbeddedTemplate extends Component<typeof Contact> {
52100
get hasSocialLinks() {
53101
return Boolean(this.args.model?.socialLinks?.length);
@@ -710,6 +758,7 @@ export class Contact extends CardDef {
710758
},
711759
});
712760

761+
static edit = EditTemplate;
713762
static embedded = EmbeddedTemplate;
714763
static fitted = FittedTemplate;
715764
static atom = AtomTemplate;

‎packages/experiments-realm/crm/deal.gts

+57-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,11 @@ import DateField from 'https://cardstack.com/base/date';
1515
import GlimmerComponent from '@glimmer/component';
1616
import SummaryCard from '../components/summary-card';
1717
import SummaryGridContainer from '../components/summary-grid-container';
18-
import { Pill, BoxelButton } from '@cardstack/boxel-ui/components';
18+
import {
19+
Pill,
20+
BoxelButton,
21+
FieldContainer,
22+
} from '@cardstack/boxel-ui/components';
1923
import { cn, not } from '@cardstack/boxel-ui/helpers';
2024
import Info from '@cardstack/boxel-icons/info';
2125
import AccountHeader from '../components/account-header';
@@ -54,6 +58,57 @@ const taskSource = {
5458
name: 'CRMTask',
5559
};
5660

61+
class EditTemplate extends Component<typeof Deal> {
62+
<template>
63+
<div class='deal-form'>
64+
<FieldContainer @label='Name'>
65+
<@fields.name />
66+
</FieldContainer>
67+
<FieldContainer @label='Account'>
68+
<@fields.account />
69+
</FieldContainer>
70+
<FieldContainer @label='Status'>
71+
<@fields.status />
72+
</FieldContainer>
73+
<FieldContainer @label='Priority'>
74+
<@fields.priority />
75+
</FieldContainer>
76+
<FieldContainer @label='Close Date'>
77+
<@fields.closeDate />
78+
</FieldContainer>
79+
<FieldContainer @label='Current Value'>
80+
<@fields.currentValue />
81+
</FieldContainer>
82+
<FieldContainer @label='Predicted Revenue'>
83+
<@fields.predictedRevenue />
84+
</FieldContainer>
85+
<FieldContainer @label='Primary Stakeholder'>
86+
<@fields.primaryStakeholder />
87+
</FieldContainer>
88+
<FieldContainer @label='Stakeholders'>
89+
<@fields.stakeholders />
90+
</FieldContainer>
91+
<FieldContainer @label='Value Breakdown'>
92+
<@fields.valueBreakdown />
93+
</FieldContainer>
94+
<FieldContainer @label='Health Score'>
95+
<@fields.healthScore />
96+
</FieldContainer>
97+
<FieldContainer @label='Event'>
98+
<@fields.event />
99+
</FieldContainer>
100+
</div>
101+
<style scoped>
102+
.deal-form {
103+
display: flex;
104+
flex-direction: column;
105+
gap: var(--boxel-sp-lg);
106+
padding: var(--boxel-sp-xl);
107+
}
108+
</style>
109+
</template>
110+
}
111+
57112
class IsolatedTemplate extends Component<typeof Deal> {
58113
get logoURL() {
59114
//We default to account thumbnail
@@ -1161,6 +1216,7 @@ export class Deal extends CardDef {
11611216
},
11621217
});
11631218

1219+
static edit = EditTemplate;
11641220
static isolated = IsolatedTemplate;
11651221
static fitted = FittedTemplate;
11661222
}

‎packages/experiments-realm/crm/task.gts

+53
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import {
88
linksToMany,
99
} from 'https://cardstack.com/base/card-api';
1010
import {
11+
FieldContainer,
1112
Pill,
1213
ProgressBar,
1314
ProgressRadial,
@@ -45,6 +46,57 @@ function shortenId(id: string): string {
4546
return decimal.toString(36).padStart(6, '0');
4647
}
4748

49+
class TaskEdit extends Component<typeof CRMTask> {
50+
<template>
51+
<div class='task-form'>
52+
<FieldContainer @label='Name'>
53+
<@fields.name />
54+
</FieldContainer>
55+
<FieldContainer @label='Crm App'>
56+
<@fields.crmApp />
57+
</FieldContainer>
58+
<FieldContainer @label='Assignee'>
59+
<@fields.assignee />
60+
</FieldContainer>
61+
<FieldContainer @label='Contact'>
62+
<@fields.contact />
63+
</FieldContainer>
64+
<FieldContainer @label='Account'>
65+
<@fields.account />
66+
</FieldContainer>
67+
<FieldContainer @label='Deal'>
68+
<@fields.deal />
69+
</FieldContainer>
70+
<FieldContainer @label='Status'>
71+
<@fields.status />
72+
</FieldContainer>
73+
<FieldContainer @label='Date Range'>
74+
<@fields.dateRange />
75+
</FieldContainer>
76+
<FieldContainer @label='Details'>
77+
<@fields.details />
78+
</FieldContainer>
79+
<FieldContainer @label='Priority'>
80+
<@fields.priority />
81+
</FieldContainer>
82+
<FieldContainer @label='Subtasks'>
83+
<@fields.subtasks />
84+
</FieldContainer>
85+
<FieldContainer @label='Tags'>
86+
<@fields.tags />
87+
</FieldContainer>
88+
</div>
89+
<style scoped>
90+
.task-form {
91+
display: flex;
92+
flex-direction: column;
93+
gap: var(--boxel-sp-lg);
94+
padding: var(--boxel-sp-xl);
95+
}
96+
</style>
97+
</template>
98+
}
99+
48100
class TaskIsolated extends Component<typeof CRMTask> {
49101
get taskTitle() {
50102
return this.args.model.name ?? 'No Task Title';
@@ -561,6 +613,7 @@ export class CRMTask extends Task {
561613
},
562614
});
563615

616+
static edit = TaskEdit;
564617
static isolated = TaskIsolated;
565618
static embedded = TaskEmbedded;
566619
}

0 commit comments

Comments
 (0)