Marcus taking over for Snehal - Facebook and Facebook Groups social media scheduler

[SnelPatare]

Description

(PRIORITY HIGH) Jae: Create appropriate auto-poster for Facebook + Facebook Groups - Scheduler

Related PRS (if any):

This frontend PR is related to the #1359 backend PR.
To test this backend PR you need to checkout the #1359 frontend PR.
OneCommunityGlobal/HGNRest#1359

Main changes explained:

Updated Announcements/Announcements.css
Updated Announcements/index.jsx
Updated src/utils/URL.js
Updated src/actions/sendSocialMediaPosts.js
Updated src/components/Announcements/SocialMediaPostDetails.jsx

How to test:

Initial Setup to test PR:
1.Prepare Facebook account:
- Create Facebook developer account using https://developers.facebook.com/
- Register Facebook account using https://developers.facebook.com/async/registration/
- Enter mobile number and Verify
- Select Developer in About you section
2. Contact me (Snehal Patare) on WhatsApp or slack for admin access for One Community (testing page) Facebook page and Test access for the developer.facebook app.
3. Accept the invitation on facebook.com -> pages on left panel -> Invites
4. Refresh the facebook page. Click on your profile dp on upper right side. You should see the One Community (testing page) page in dropdown. (You will be having admin access)
5. Accept the request on the developer.facebook (https://developers.facebook.com/ ) application. The invitation will be shown on upper-right corner of the page.
6. Open https://developers.facebook.com/tools/ -> Select Graph API explorer -> Select Meta App as one com API, select User or Page as "One Community", Add below permissions
email
pages_show_list
pages_read_engagement
pages_read_user_content
pages_manage_posts
pages_manage_engagement
7. Click on Generate Access Token.
8. Click on i icon in the token -> Select Open in Access Token tool -> Select Extend Access Token at the bottom of the page -> Copy the token generated.
9. Enter the variables in HGNRest .env file:
FB_ACCESSCODE=
FB_PAGEID =

Test in HGN application

1. check into current branch
2. do npm install and to run this PR locally using "HTTPS=true nom run start:local"
3. Clear site data/cache
4. log as Owner user
5. go to taskbar→ Other links -> Send Emails

Test 1 : Social Media Icons

1. At the top side you will find social media icons. Select "Facebook"
2. Enter into editor any message
3. Select post on Facebook
4. Facebook login page opens up -> enter credentials -> confirm
5. Successfully posted on the page -> https://www.facebook.com/profile.php?id=61571422079911

Test 2 : Post on multiple Social media

1. At the top side you will find social media icons. Select "Facebook"
2. Select " Make Post " tab
3. Enter into editor any message
4. Select "post to Facebook"
5. Click on "Also post to" -> select "facebook" in dropdown
6. Select "post to Facebook"
7. Facebook login page opens up -> enter credentials -> confirm
8. Successfully posted on the page -> https://www.facebook.com/profile.php?id=61571422079911

Test 3: Post Scheduled

1. Select "Scheduled Post"
2. Select Schedule Post -> Select platform "Facebook" from select multiple platforms
3. Enter text in editor
4. Select date and time of posting
5. Confirm schedule at the bottom.
6. Go to the end of the page. Social Media Schedule Post -> Select Fetch all facebook scheduled post.
7. You will see your scheduled post at the end of the page.
8. We can also filter schedules upto 1 year using "Filter by Time range" option.
9. Check on facebook page if your scheduled post is posted at given time and date.

Test 4: Post scheduled Post

1. Social Media Schedule Post -> Select Fetch all facebook scheduled post.
2. Select post. This should post on facebook page.
3. Popup to delete the post when posted

Test 5: Delete without Posting from scheduled Post

1. Social Media Schedule Post -> Select Fetch all facebook scheduled post.
2. Select Delete. This should delete post from the list.

Test 6: Post Scheduled annually

1. Select "Scheduled Post"
2. Select Schedule Post -> Select platform "Facebook" from select multiple platforms
3. Enter text in editor
4. Select date and time of posting
5. Click on check box "Repeat Annually"
6. Select the number of years post should be posted annually for same date and time each year.
7. Click on "confirm schedule" at the bottom
8. Check the scheduled post in "Scheduled Social Media Posts".

Screenshot

video.mp4

Note:

Please contact me if you need help with the setup.

[Vinay944924]

Hi Marcus,

I am getting an error when I try to run the PR locally. I have provided the screenshot below

Verify this

[Vinay944924]

Hi Marcus,
I tried to login to facebook so it said the app is not currently accessible. And I have provided a screenshot

In this when you want to select where to post its cutting of few options in the last so please verify that

[ManeeshBuddha21]

Tested locally with backend PR #1359 UI works fine, but Facebook login fails with “App not active.” Needs app reactivation or tester access to proceed.

[one-community]

Replaced with new PR set: #4714 and OneCommunityGlobal/HGNRest#2005