Maithili : auto poster for pinterest FE

[maithili20]

Description

Create appropriate auto-poster for Pinterest

Related PRS (if any):

This frontend PR is related to the 2268 backend PR.

Main changes explained:

• Added src/components/Announcements/platforms/pinterest/index.jsx
• Added src/components/Announcements/platforms/pinterest/Pinterest.module.css
• Added src/components/Announcements/platforms/pinterest/PinterestHelpers.js
• Updated src/components/Announcements/index.jsx
  …

Initial setup to create Pinterest account and application:

Step 1 — Create a Pinterest Developer account

Go to https://developers.pinterest.com and sign in with your Pinterest account. If you don't have one, create a free Pinterest account first.

---

Step 2 — Create an app

1. Click My Apps in the top navigation
2. Click Connect app
3. Fill in the form:
   • App name: e.g. OneCommunity
   • App description: e.g. Social media auto poster
   • What are you building: select Other
4. Accept the terms and click Submit

---

Step 3 — Get your App ID and App Secret

1. After creating the app, you land on the app dashboard
2. You will see App ID — this is your PINTEREST_APP_ID
3. Click Show next to App secret key — this is your PINTEREST_APP_SECRET
4. Copy both into your .env:

PINTEREST_APP_ID=your_app_id_here
PINTEREST_APP_SECRET=your_app_secret_here

---

Step 4 — Add your redirect URI

1. On the same app dashboard, scroll to Redirect URIs
2. Click Add and enter:

http://localhost:4500/api/social/pinterest/auth/callback

3. Click Save

---

Step 5 — Request API access

Pinterest apps start in sandbox mode by default, which limits what you can do.

1. On your app dashboard, click Request default access or Modify access
2. Request these scopes:
   • pins:read
   • pins:write
   • boards:read
   • boards:write
   • users:read
3. Submit the request — Pinterest may take a few days to approve

---

Step 6 — Set sandbox vs production in your .env

While waiting for approval, use sandbox mode:

PINTEREST_SANDBOX_API=true
PINTEREST_SANDBOX_API_TOKEN=your_sandbox_token

To get the sandbox token:

1. On your app dashboard, click Generate token under the sandbox section
2. Select all the scopes listed above
3. Click Generate — copy the token into PINTEREST_SANDBOX_API_TOKEN

Once Pinterest approves your app for production:

PINTEREST_SANDBOX_API=false
PINTEREST_SANDBOX_API_TOKEN=

These will be in you env file

PINTEREST_SANDBOX_API=true/false
PINTEREST_SANDBOX_API_TOKEN=
PINTEREST_APP_ID=
PINTEREST_APP_SECRET=

##How to test:

1. Check into current branch
2. Do npm install and npm run start:local to run this PR locally
3. Clear site data/cache
4. Log as owner user
5. Go to http://localhost:5173/announcements and click on the Pinterest icon
6. Verify functionalities below:

Create and upload a post immediately

• Fill in the form
• Try out all the options
• Click the Post button
• Verify that the post appears in your Pinterest account with the correct title, images, descriptions

Create and delete scheduled post

• Fill in the form
• Click Schedule button
• Confirm the post appears under the Pin Queue section immediately.
• Test deleting the scheduled post: After clicking Remove, ensure the post is removed from the Scheduled Posts section instantly.
• Wait for the scheduled time and verify that the post is published to your Pinterest account as expected. Also verify that post is removed from Pin Queue

Screenshots or videos of changes:

https://www.dropbox.com/scl/fi/ae41s6fmdkoz76g72ryh0/screen-recording-2026-07-09-at-34456-pm_ziZ7d8sb.mov?rlkey=7iwspku06w295hqpd788toyna&st=w4h6pb3a&dl=0

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	0f737dc
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a501318f1aea500080c1517
😎 Deploy Preview	https://deploy-preview-5380--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud