Skip to content

Commit faaab1c

Browse files
committed
added how to add two images v1.59+, fixed advanced methods page and markup for passing diff ver overview data to sidebar
1 parent ff463dd commit faaab1c

5 files changed

Lines changed: 206 additions & 70 deletions

File tree

docs/website/src/App.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ function App() {
2424
<Toaster position="top-right" />
2525
<Header version={version} setVersion={setVersion}/>
2626
<main className="flex">
27-
<SiteOverview />
27+
<SiteOverview version={version} />
2828
<Routes>
2929
<Route path="/" element={<HomePage />} />
3030
<Route path="/getting-started" element={<MainPage />} />

docs/website/src/pages/AdvancedMethodsPage.tsx

Lines changed: 21 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,11 @@ import { useEffect, useState } from 'react';
99
import { Iversion } from '../assets/js/mytypes';
1010

1111
interface IAdvancedMethodsPage {
12-
title_and_message_update_code:string;
13-
progress_bar_update_code:string;
14-
adding_image_code:string;
15-
channel_management_code:string;
16-
getting_identifier_code:string;
12+
title_and_message_update_code: string;
13+
progress_bar_update_code: string;
14+
adding_image_code: string;
15+
channel_management_code: string;
16+
getting_identifier_code: string;
1717
}
1818
export default function AdvancedMethodsPage({ version }: { version: Iversion }) {
1919
const [data, setData] = useState<IAdvancedMethodsPage>()
@@ -29,24 +29,29 @@ export default function AdvancedMethodsPage({ version }: { version: Iversion })
2929
return (
3030
<div className="main-page page adv-methods-page">
3131
<ScrollToSection />
32-
<h2 className=" long-title">Updating Notification</h2>
3332
<section id='updating-notification' className="page-section">
34-
33+
<h2 className=" long-title">Updating Notification</h2>
3534
<hr />
3635
<p>There Available methods to interact with notification after sending</p>
3736
<p tabIndex={0} className="paragraph">For Changing <span className="code">title</span> and <span className="code">message</span> after sending:</p>
38-
<CodeBlock title="Title & Message" code={data?.title_and_message_update_code||''} />
37+
<CodeBlock title="Title & Message" code={data?.title_and_message_update_code || ''} />
3938
<p tabIndex={0} className="paragraph">For the Progress Bar: </p>
4039
<ul className="inner-section-2 paragraph">
4140
<li>Avoid changing it value in intervals less than 0.5sec</li>
4241
<li>And always pass in the new title and message if any to <span className="code">updateProgressBar</span> method</li>
4342
</ul>
4443
<span className="paragraph code yellow flex progressbar-warning">Android ignores updates faster than 0.5sec on some devices</span>
45-
<CodeBlock title="Progress-Bar" code={data?.progress_bar_update_code||''} />
46-
<p tabIndex={0} className="paragraph">For Images:</p>
44+
<CodeBlock title="Progress-Bar" code={data?.progress_bar_update_code || ''} />
45+
</section>
46+
47+
<section id='adding-image' className="page-section">
48+
<h2 className=" long-title">For Images:</h2>
49+
<hr />
50+
{/* <p tabIndex={0} className="paragraph">For Images:</p> */}
4751
<p className="paragraph">To add image after sending set <span className="code">already_sent</span> in <span className="code">addNotificationStyle</span> method to <span className="code">true</span></p>
48-
<CodeBlock title="Image" code={data?.adding_image_code||''} />
52+
<CodeBlock title="Image" code={data?.adding_image_code || ''} />
4953
</section>
54+
5055
<section id="channel-management" className="page-section" tabIndex={0}>
5156

5257
<h2 className="long-title">Channel Management</h2>
@@ -58,17 +63,18 @@ export default function AdvancedMethodsPage({ version }: { version: Iversion })
5863
<li className="inner-section-2">Using this format <span className="code">.lower().replace(' ', '_')</span> </li>
5964
<li>Custom Channel Name's Gives User ability to turn on/off specific notifications</li>
6065
</ul>
61-
<CodeBlock title='Channel Management' code={data?.channel_management_code||''} img={channelimg} />
66+
<CodeBlock title='Channel Management' code={data?.channel_management_code || ''} img={channelimg} />
6267
</section>
68+
6369
<section id="getting-identifer" className="page-section" tabIndex={0}>
6470
<h2 className="long-title">Getting Identifer</h2>
6571
<hr />
66-
<p>If you want to get the Exact Notification Clicked to Open App, you can use NotificationHandler to get unique identifer (str) <span className="code">NotificationHandler.getIdentifer</span></p>
72+
<p>If you want to get the Exact Notification Clicked to Open App, you can use NotificationHandler to get unique identifer (str) <span className="code">NotificationHandler{version <= 1.58?".getIdentifer":'.get_name'}</span></p>
6773

6874
<p>
69-
<span className="code warning yellow paragraph block width-max-con">In next version identifer will be changed to `name` and NotificationHandler.getIdentifer to NotificationHandler.get_name</span>
75+
{Boolean(version <= 1.58) && <span className="code warning yellow paragraph block width-max-con">In next version identifer will be changed to `name` and NotificationHandler.getIdentifer to NotificationHandler.get_name</span>}
7076
</p>
71-
<CodeBlock title="Identifer" code={data?.getting_identifier_code||''} />
77+
<CodeBlock title="Identifer" code={data?.getting_identifier_code || ''} />
7278
</section>
7379

7480

docs/website/src/pages/versions-data/1.58.tsx

Lines changed: 42 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -378,6 +378,46 @@ const reference_page = {
378378
NOTIFICATION_METHODS, HANDLER_METHODS, STYLE_ATTRIBUTES
379379
}
380380

381+
export const Sidebar= [
382+
{
383+
title: 'Getting Started',
384+
route: '/getting-started',
385+
sections: {
386+
'Introduction':'introduction',
387+
'Features':'features',
388+
'Installation':'installation',
389+
'Basic Usage':'basic-usage'
390+
}
391+
},
392+
{
393+
title: 'Components',
394+
route: '/components',
395+
sections: {
396+
'Images':'images',
397+
'Buttons':'buttons',
398+
'Progress Bars':'progress-bars',
399+
'Texts':'texts'
400+
}
401+
},
402+
{
403+
title: 'Advanced Methods',
404+
route: '/advanced-methods',
405+
sections: {
406+
'Updating Notification':title_and_message_update,
407+
'Adding Image':adding_image_code,
408+
'Channel Management':channel_management_code,
409+
'Getting Identifer':getting_identifer
410+
}
411+
},
412+
{
413+
title: 'Reference',
414+
route: '/reference',
415+
sections: {
416+
'Notification Class':NOTIFICATION_METHODS,
417+
'NotificationHandler Class':HANDLER_METHODS,
418+
'NotificationStyles Class':STYLE_ATTRIBUTES
419+
}
420+
}
421+
]
381422

382-
export { component_page, advanced_methods_page, reference_page }
383-
// export {bigimgcode,buttons_code,progressbarcode,largeiconcode,inboxcode,bigtextcode,appiconcode}
423+
export { component_page, advanced_methods_page, reference_page }

docs/website/src/pages/versions-data/1.59.tsx

Lines changed: 43 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -447,7 +447,7 @@ const STYLE_ATTRIBUTES = [
447447
const component_page = {
448448
big_picture_code: bigimgcode,
449449
large_icon_code: largeiconcode,
450-
how_to_add_both_imgs: <p className="paragraph">For Both Images pass in <span className="code">NotificationStyles.BOTH_IMGS</span> as argument to <span className="code">style</span> and provide both paths</p>,
450+
how_to_add_both_imgs: <p className="paragraph">For Both Images use <span className="code">Notification.setBigPicture</span> and <span className="code">Notification.setLargeIcon</span> together</p>,
451451
small_icon_code: appiconcode,
452452
buttons_code,
453453
progressbar_code: progressbarcode,
@@ -468,5 +468,47 @@ const reference_page = {
468468
}
469469

470470

471+
export const Sidebar= [
472+
{
473+
title: 'Getting Started',
474+
route: '/getting-started',
475+
sections: {
476+
'Introduction':'introduction',
477+
'Features':'features',
478+
'Installation':'installation',
479+
'Basic Usage':'basic-usage'
480+
}
481+
},
482+
{
483+
title: 'Components',
484+
route: '/components',
485+
sections: {
486+
'Images':'images',
487+
'Buttons':'buttons',
488+
'Progress Bars':'progress-bars',
489+
'Texts':'texts'
490+
}
491+
},
492+
{
493+
title: 'Advanced Methods',
494+
route: '/advanced-methods',
495+
sections: {
496+
'Updating Notification':'updating-notification',
497+
'Adding Image':'adding-image',
498+
'Channel Management':'channel-management',
499+
'Getting Identifer':'getting-identifer'
500+
}
501+
},
502+
{
503+
title: 'Reference',
504+
route: '/reference',
505+
sections: {
506+
'Notification Class':'notification-class',
507+
'NotificationHandler Class':'notificationhandler-class',
508+
'NotificationStyles Class':'notificationstyles-class'
509+
}
510+
}
511+
]
512+
471513
export { component_page, advanced_methods_page, reference_page }
472514
// export {bigimgcode,buttons_code,progressbarcode,largeiconcode,inboxcode,bigtextcode,appiconcode}

docs/website/src/ui/SiteOverview/SiteOverview.tsx

Lines changed: 99 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import './siteoverview.css'
55
import { useEffect, useState } from "react";
66
// import { toast } from "sonner";
77
import { ScrollToSection } from "../ScrollAssist";
8+
import { Iversion } from "../../assets/js/mytypes";
9+
import { nanoid } from "nanoid";
810

911
function DropDown({ title, sections, hash, route }: { route: string; title: string; sections: string[], hash: string }) {
1012
const [opened, setOpened] = useState(false)
@@ -51,9 +53,42 @@ function DropDown({ title, sections, hash, route }: { route: string; title: stri
5153

5254
}
5355

54-
export default function SiteOverview() {
56+
// export const Sidebar= [
57+
// {
58+
// title: 'Getting Started',
59+
// route: '/getting-started',
60+
// sections: {
61+
// 'Introduction':'introduction',
62+
// 'Features':'features',
63+
// 'Installation':'installation',
64+
// 'Basic Usage':'basic-usage'
65+
// }
66+
// },
67+
interface ISiteOverviewData {
68+
title: string;
69+
route: string;
70+
sections: {
71+
[key: string]: string;
72+
}
73+
}
74+
75+
export default function SiteOverview({ version }: { version: Iversion }) {
5576
const location = useLocation();
5677
const [hash, setHash] = useState(location.hash)
78+
const [data, setData] = useState<ISiteOverviewData[]>()
79+
80+
81+
82+
async function changeVersionData(version: Iversion) {
83+
84+
const data = await import(`../../pages/versions-data/${version}.tsx`);
85+
// console.log(data,' 1p11')
86+
setData(data?.Sidebar)
87+
}
88+
useEffect(() => {
89+
changeVersionData(version)
90+
}, [version])
91+
5792
useEffect(() => {
5893
setHash(location.hash)
5994
// toast.success(location.pathname)
@@ -97,16 +132,25 @@ export default function SiteOverview() {
97132

98133
sections.forEach((s) => observer.observe(s));
99134
return () => observer.disconnect();
100-
135+
101136
}, [location.pathname]);
102137

103-
return (
104-
// <>
105138

139+
return (
106140
<div id="site-overview">
107141
<ScrollToSection />
108-
109-
<DropDown
142+
{
143+
data?.map((each) => {
144+
return <DropDown
145+
key={nanoid()}
146+
hash={hash}
147+
title={each.title}
148+
route={each.route}
149+
sections={Object.keys(each.sections)}
150+
/>
151+
})
152+
}
153+
{/* <DropDown
110154
hash={hash}
111155
route='/getting-started'
112156
title="Getting Started"
@@ -116,8 +160,8 @@ export default function SiteOverview() {
116160
'Installation',
117161
'Basic Usage'
118162
]}
119-
/>
120-
<DropDown
163+
/> */}
164+
{/* <DropDown
121165
hash={hash}
122166
title="Components"
123167
route='/components'
@@ -170,58 +214,62 @@ export default function SiteOverview() {
170214
// 'FAQ',
171215
// 'Error Handling',
172216
]}
173-
/>
217+
/> */}
174218
</div>
219+
)
220+
}
175221

176-
/* comment ./siteoverview.css .site-overview {`position: fixed;`} to see properly
177-
<div className="site-overview">
222+
223+
224+
225+
226+
227+
/* comment ./siteoverview.css .site-overview {`position: fixed;`} to see properly
228+
<div className="site-overview">
178229
<DropDown
179-
hash={hash}
180-
title="Getting Started"
181-
sections={[
182-
'Introduction',
183-
'Installation',
184-
'Basic Usage'
185-
]}
230+
hash={hash}
231+
title="Getting Started"
232+
sections={[
233+
'Introduction',
234+
'Installation',
235+
'Basic Usage'
236+
]}
186237
/>
187238
<DropDown
188-
hash={hash}
189-
title="Guides"
190-
sections={[
191-
'Notification Options',
192-
'Customizing Behavior',
193-
'Error Handling'
194-
]}
239+
hash={hash}
240+
title="Guides"
241+
sections={[
242+
'Notification Options',
243+
'Customizing Behavior',
244+
'Error Handling'
245+
]}
195246
/>
196247
<DropDown
197-
hash={hash}
198-
title="Reference"
199-
sections={[
200-
'Notification Class',
201-
'Available Methods',
202-
'Examples'
203-
]}
248+
hash={hash}
249+
title="Reference"
250+
sections={[
251+
'Notification Class',
252+
'Available Methods',
253+
'Examples'
254+
]}
204255
/>
205256
<DropDown
206-
hash={hash}
207-
title="Support"
208-
sections={[
209-
'FAQ',
210-
'Troubleshooting',
211-
'Contributing'
212-
]}
257+
hash={hash}
258+
title="Support"
259+
sections={[
260+
'FAQ',
261+
'Troubleshooting',
262+
'Contributing'
263+
]}
213264
/>
214265
<DropDown
215-
hash={hash}
216-
title="About"
217-
sections={[
218-
'What is Android-notify?',
219-
'License',
220-
'Changelog'
221-
]}
266+
hash={hash}
267+
title="About"
268+
sections={[
269+
'What is Android-notify?',
270+
'License',
271+
'Changelog'
272+
]}
222273
/>
223-
</div>
224-
* </> */
225-
226-
)
227-
}
274+
</div>
275+
</> */

0 commit comments

Comments
 (0)