Skip to content

Commit 6674518

Browse files
missopmissop
committed
refactor: refactor bounty detail page
1 parent 4e1053d commit 6674518

File tree

3 files changed

+171
-0
lines changed

3 files changed

+171
-0
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ pnpm-lock.yaml
1212
/coverage
1313
#vscode
1414
/.vscode/
15+
#webstorm
16+
.idea
1517

1618
# next.js
1719
/.next/

‎src/domain/bounty/views/activity-list/ActivityList.js

+152
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,152 @@
1+
/**
2+
* Copyright 2024 OpenBuild
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
import clsx from 'clsx';
18+
import Image from 'next/image';
19+
20+
import { RefetchIcon, StartTimeIcon, PushDoorIcon, AddThreeIcon, FinishedIcon } from '@/components/Icons';
21+
import { fromNow } from '@/utils/date';
22+
23+
import { useMediaUrl } from '#/state/application/hooks';
24+
25+
function ActivityList({
26+
data=[],
27+
}) {
28+
const mediaUrl = useMediaUrl();
29+
30+
return <div>
31+
{data?.map?.((i, k) => (
32+
<div
33+
key={`bounty-activities-${k}`}
34+
className={clsx('relative flex items-center pb-9 text-sm max-md:items-start', {
35+
'before:absolute before:left-[15px] before:top-0 before:h-full before:border-l before:border-gray-400':
36+
k !== data?.length - 1,
37+
})}
38+
>
39+
<div
40+
className={clsx(
41+
'relative z-10 flex h-8 w-8 items-center justify-center rounded-full border-2 border-gray-1000 max-md:mt-[-4px]',
42+
{
43+
'bg-[#E6E6E6]': i.bounty_status !== 30,
44+
'bg-[#FFE5D0]': i.bounty_status === 30,
45+
}
46+
)}
47+
>
48+
{i.bounty_status === 3 && i.builder_status_before === 100 && i.builder_status === 101 && (
49+
<AddThreeIcon />
50+
)}
51+
{(i.bounty_status === 6 || i.bounty_status === 24 ) && <PushDoorIcon />}
52+
{i.bounty_status === 7 && i.builder_status_before === 101 && i.builder_status === 107 && (
53+
<StartTimeIcon />
54+
)}
55+
{i.bounty_status === 3 && i.bounty_task > 1 && i.builder_status === 0 && <RefetchIcon />}
56+
{i.bounty_status === 30 && '🎉'}
57+
{(i.bounty_status === 30 || i.bounty_status === 15 || i.bounty_status === 19 || i.bounty_status === 23 || i.bounty_status === 14 || i.bounty_status_before === 14) && <FinishedIcon />}
58+
59+
</div>
60+
{i.bounty_status === 3 && i.builder_status_before === 100 && i.builder_status === 101 &&
61+
<>
62+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.builder_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
63+
<p className="mr-2 max-md:inline">
64+
<a href={`/u/${i.builder_user?.user_handle}`}>{i.builder_user.user_nick_name}</a>
65+
<>
66+
<span className="mx-1 rounded-full bg-[#4000e0] px-2 py-1 text-white">applied</span>
67+
<span>this bounty</span>
68+
</>
69+
</p>
70+
</>
71+
}
72+
{i.bounty_status === 6 && (
73+
<>
74+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.employer_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
75+
<p className="max-md:inline">
76+
<a href={`/u/${i.employer_user?.user_handle}`}><strong>{i.employer_user.user_nick_name}</strong> </a>pledged the
77+
<span className="mx-1 rounded-full bg-[#3e9de6] px-2 py-1 text-white">deposit</span>
78+
</p>
79+
</>
80+
)}
81+
{i.bounty_status === 7 && i.builder_status_before === 101 && i.builder_status === 107 && (
82+
<>
83+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.builder_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
84+
<p className="max-md:inline">
85+
<a href={`/u/${i.builder_user?.user_handle}`}><strong>{i.builder_user.user_nick_name}</strong></a>
86+
&nbsp;application was&nbsp;
87+
<span className="mx-1 rounded-full bg-[#009C8E] px-2 py-1 text-white">
88+
approved
89+
</span>
90+
&nbsp;and&nbsp;<span className="mx-1 rounded-full bg-[#ff7c17] px-2 py-1 text-white">started building</span>
91+
</p>
92+
</>
93+
)}
94+
{i.bounty_status === 7 && i.bounty_status_before === 14 && (
95+
<>
96+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.employer_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
97+
<p className="mr-2 max-md:inline">
98+
<a href={`/u/${i.employer_user?.user_handle}`}>
99+
<strong>
100+
{i.employer_user.user_nick_name}
101+
</strong>
102+
</a>
103+
<>
104+
<span className="mx-1 rounded-full bg-[#e01f21] px-2 py-1 text-white">rejected</span>
105+
<span>the application</span>
106+
</>
107+
</p>
108+
</>
109+
)}
110+
111+
{i.bounty_status === 14 && (
112+
<>
113+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.builder_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
114+
<p className="mr-2 max-md:inline">
115+
<a href={`/u/${i.builder_user?.user_handle}`}>
116+
<strong>
117+
{i.builder_user.user_nick_name}
118+
</strong>
119+
</a>
120+
<>
121+
<span className="mx-1 rounded-full bg-[#4000e0] px-2 py-1 text-white">applied to complete</span>
122+
<span>this bounty</span>
123+
</>
124+
</p>
125+
</>
126+
)}
127+
{(i.bounty_status === 30 || i.bounty_status === 15 || i.bounty_status === 19 || i.bounty_status === 23) && (
128+
<>
129+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.builder_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
130+
<p className="max-md:inline">
131+
<a href={`/u/${i.builder_user?.user_handle}`}>
132+
<strong>{i.builder_user.user_nick_name}</strong>
133+
</a>
134+
&nbsp;program has been <span className="mx-1 rounded-full bg-[#009C8E] px-2 py-1 text-white">adopted</span> and got the bounty
135+
</p>
136+
</>
137+
)}
138+
{i.bounty_status === 3 && i.bounty_task > 1 && i.builder_status === 0 && (
139+
<>
140+
{mediaUrl && <Image width={24} height={24} src={mediaUrl + i.employer_user.user_avatar} alt="" className="ml-4 mr-2 h-6 w-6 rounded-full object-fill"/>}
141+
<p className="max-md:inline">
142+
Bounty&#39;s recruitment <strong className="mr-1">restarted</strong>
143+
</p>
144+
</>
145+
)}
146+
<p className="opacity-50 max-md:inline">&nbsp;· Posted {fromNow(i.created_at * 1000)}</p>
147+
</div>
148+
))}
149+
</div>;
150+
}
151+
152+
export default ActivityList;

‎src/domain/bounty/views/activity-list/index.js

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
/**
2+
* Copyright 2024 OpenBuild
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
export {default} from './ActivityList';

0 commit comments

Comments
 (0)