Skip to content
This repository was archived by the owner on Aug 7, 2024. It is now read-only.

Commit 87bd3d5

Browse files
eddiejaoudeManishBisht777manish bisht
authored
feat: future goals (#3774)
* feat: future goals (#2383) * feature : future goals * Chores : combine userGoal and userMilestone component * chores : Delete manishbisht.json * Fix: merge conflicts * Fix : using the same code Co-authored-by: manish bisht <[email protected]> Co-authored-by: Eddie Jaoude <[email protected]> * fix: future milestones * data: eddiejaoude Co-authored-by: Manish Bisht <[email protected]> Co-authored-by: manish bisht <[email protected]>
1 parent 72c0ab3 commit 87bd3d5

File tree

5 files changed

+64
-34
lines changed

5 files changed

+64
-34
lines changed

‎components/user/UserMilestone.js‎

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,22 @@
11
import { ReactMarkdown } from "react-markdown/lib/react-markdown";
22
import getIcon from "../Icon";
33

4-
export default function UserMilestone({ milestone }) {
4+
export default function UserMilestone({ milestone, isGoal }) {
55
const DisplayIcon = getIcon(milestone.icon);
6-
76
return (
8-
<a
9-
href={milestone.url}
10-
key={milestone.url}
11-
target="_blank"
12-
rel="noreferrer"
7+
<li
8+
className={`py-4 border-l-2 mb-4 pl-2 hover:border-l-4 pr-2 shadow-md ${
9+
isGoal ? "opacity-50" : ""
10+
}`}
11+
style={{
12+
borderColor: milestone.color,
13+
}}
1314
>
14-
<li
15-
className="py-4 border-l-2 mb-4 pl-2 hover:border-l-4 pr-2 shadow-md"
16-
style={{
17-
borderColor: milestone.color,
18-
}}
15+
<a
16+
href={milestone.url}
17+
key={milestone.url}
18+
target="_blank"
19+
rel="noreferrer"
1920
>
2021
<div className="flex space-x-3">
2122
<DisplayIcon />
@@ -29,7 +30,7 @@ export default function UserMilestone({ milestone }) {
2930
</ReactMarkdown>
3031
</div>
3132
</div>
32-
</li>
33-
</a>
33+
</a>
34+
</li>
3435
);
3536
}

‎components/user/UserMilestones.js‎

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,34 @@ import UserMilestone from "./UserMilestone";
22
import Alert from "../Alert";
33

44
export default function UserMilestones({ data }) {
5+
const historicMilestones = data.milestones.filter(
6+
(milestone) => !milestone.isGoal
7+
);
8+
9+
const futureMilestones = data.milestones.filter(
10+
(milestone) => milestone.isGoal
11+
);
512
return (
613
<>
714
{!data.milestones && <Alert type="info" message="No milestones found" />}
815
<ul role="list" className="divide-y divide-gray-200">
916
{data.milestones &&
10-
data.milestones.map((milestone, key) => (
11-
<UserMilestone milestone={milestone} key={key} />
17+
historicMilestones.map((milestone, key) => (
18+
<UserMilestone milestone={milestone} isGoal={false} key={key} />
1219
))}
1320
</ul>
21+
22+
{futureMilestones.length > 0 && (
23+
<div className="flex justify-center items-center gap-3 text-gray-500 my-4 text-xl p-4">
24+
Future Goals
25+
</div>
26+
)}
27+
28+
<ul role="list" className="divide-y divide-gray-200">
29+
{futureMilestones.map((goal, key) => (
30+
<UserMilestone milestone={goal} isGoal={true} key={key} />
31+
))}
32+
</ul>
1433
</>
1534
);
1635
}

‎data/eddiejaoude.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -148,6 +148,15 @@
148148
"color": "green",
149149
"description": "Won top teacher award from GitHub.",
150150
"url": "https://github.com/eddiejaoude"
151+
},
152+
{
153+
"isGoal": true,
154+
"title": "Course on helping people get started with Open Source",
155+
"date": "2022",
156+
"icon": "FaGithub",
157+
"color": "green",
158+
"description": "I am 50% of the way through my course of helping people getting into Open Source",
159+
"url": "http://eddiejaoude.io"
151160
}
152161
]
153162
}

‎pages/docs/how-to-guides/events.mdx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -39,15 +39,15 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
3939
```
4040
</ClipboardCopy>
4141

42-
| Property | Description |
43-
| :--------------------- | :---------------------------------------------------------- |
44-
| isVirtual / isInPerson | Is the event virtual or in person or both |
45-
| color | What color would you like this milestone to be displayed in |
46-
| name | Name of the event |
47-
| description | More details about the event, this can include markdown |
48-
| date | Start and end date plus time of the event |
49-
| cfpClose | [optional] The date of when the CFP to submit a talk closes |
50-
| url | Where can people learn more about the event |
42+
| Property | Required | Description |
43+
| :--------------------- | :------- | :---------------------------------------------------------- |
44+
| isVirtual / isInPerson | true | Is the event virtual or in person or both |
45+
| color | true | What color would you like this milestone to be displayed in |
46+
| name | true | Name of the event |
47+
| description | true | More details about the event, this can include markdown |
48+
| date | true | Start and end date plus time of the event |
49+
| cfpClose | false | The date of when the CFP to submit a talk closes |
50+
| url | true | Where can people learn more about the event |
5151

5252
4. Now you can commit your file and create a Pull Request. For more details please see [Editing guide](/docs/how-to-guides/editing)
5353

‎pages/docs/how-to-guides/milestones.mdx‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import DocsLayout from "../../../components/layouts/DocsLayout.js";
2-
import ClipboardCopy from "../../../components/ClipboardCopy"
2+
import ClipboardCopy from "../../../components/ClipboardCopy";
33

44
## Milestones
55

@@ -28,14 +28,15 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
2828
```
2929
</ClipboardCopy>
3030

31-
| Property | Description |
32-
| :---------- | :---------------------------------------------------------- |
33-
| title | Main heading of the milestone |
34-
| date | Month and Year |
35-
| icon | What icon would you like displayed with this milestone |
36-
| color | What color would you like this milestone to be displayed in. Use hex codes or name of the color |
37-
| description | More details about the milestone, this can include markdown |
38-
| url | Where can people learn more about the milestone |
31+
| Property | Required | Description |
32+
| :---------- | :------- | :---------------------------------------------------------------------------------------------- |
33+
| title | true | Main heading of the milestone |
34+
| date | true | Month and Year |
35+
| icon | true | What icon would you like displayed with this milestone |
36+
| color | true | What color would you like this milestone to be displayed in. Use hex codes or name of the color |
37+
| description | true | More details about the milestone, this can include markdown |
38+
| url | true | Where can people learn more about the milestone |
39+
| isGoal | false | If this is a future goal |
3940

4041
This is what a complete example looks like:
4142

0 commit comments

Comments
 (0)