Merge pull request #2 from wrappid/WRPD-feature-1

feat(core): ✨ Added the feature of Linkedin Post Scheduler

Author: MihirRajChowdhury

app/actions/test.action.js

@@ -1,14 +1,14 @@
-import { RESET_TEST, TEST_FAILURE, TEST_SUCCESS } from "../types/test.types";
+import { RESET_TEST, POST_FAILURE, POST_SUCCESS } from "../types/test.types";
 
 export const testSuccess = () => {
   return (dispatch) => {
-    dispatch({ type: TEST_SUCCESS });
+    dispatch({ type: POST_SUCCESS });
   };
 };
 
 export const testFailure = () => {
   return (dispatch) => {
-    dispatch({ type: TEST_FAILURE });
+    dispatch({ type: POST_FAILURE });
   };
 };
 

app/components.registry.js

@@ -1,10 +1,14 @@
 import ModuleComponent from "./components/ModuleComponent";
+import MultipleImagePicker from "./components/MultipleImagePicker";
+import PostToLinkedin from "./components/PostToLinkedin";
 import TestComponent from "./components/TestComponent";
 import TestComponentMobile from "./components/TestComponentMobile";
 import TestComponentWeb from "./components/TestComponentWeb";
 
 export const ComponentsRegistry = {
   ModuleComponent     : { comp: ModuleComponent },
+  MultipleImagePicker : { comp: MultipleImagePicker },
+  PostToLinkedin      : { comp: PostToLinkedin },
   TestComponents      : { comp: TestComponent },
   TestComponentsMobile: {
     comp: TestComponentMobile,
@@ -14,4 +18,5 @@ export const ComponentsRegistry = {
     comp  : TestComponentWeb,
     mobile: false
   }
+
 };

app/components/MultipleImagePicker.js

@@ -0,0 +1,57 @@
+/* eslint-disable no-unused-vars */
+/* eslint-disable etc/no-commented-out-code */
+import { useState } from "react";
+
+import {
+  CoreBox, CoreIcon, CoreInput, CoreImage, 
+  CoreClasses
+} from "@wrappid/core";
+
+const ImageUpload = (props) => {
+//   const [selectedImages, setSelectedImages] = useState([]);
+  const [previewUrls, setPreviewUrls] = useState([]);
+
+  const handleImageChange = (event) => {
+    const files = Array.from(event.target.files);
+    
+    props?.formik?.setFieldValue(props?.id, files); // Set images in Formik
+  };
+
+  return (
+    <CoreBox>
+      <CoreInput
+        {...props}
+        type="file"
+        // onChange={handleImageChange}
+        inputProps={{
+          accept  : "image/*",
+          multiple: true,
+          readOnly: true
+        }}
+      />
+
+      {/* Image previews */}
+      {previewUrls.length > 0 ? (
+        <CoreBox 
+          styleClasses={[CoreClasses.DISPLAY.FLEX, CoreClasses.FLEX.FLEXWRAP, CoreClasses.GAP.GAP_1, CoreClasses.MARGIN.MX10]}
+        >
+          {previewUrls.map((url, index) => (
+            <CoreImage
+              key={index}
+              src={url}
+              alt={`Preview ${index + 1}`}
+              width={100}
+              height={100}
+            />
+          ))}
+        </CoreBox>
+      ) : (
+        <p>No image uploaded</p>
+      )}
+
+      <CoreIcon icon="photo_camera" />
+    </CoreBox>
+  );
+};
+
+export default ImageUpload;

app/components/PostToLinkedin.js

@@ -0,0 +1,23 @@
+/* eslint-disable etc/no-commented-out-code */
+
+import { BlankLayout, CoreBox, CoreClasses, CoreForm, CoreLayoutItem } from "@wrappid/core";
+
+export default function PostToLinkedin() {
+
+  return (
+    // eslint-disable-next-line react/jsx-no-comment-textnodes
+    <>
+      <CoreLayoutItem id={BlankLayout.PLACEHOLDER.CONTENT}>
+        <CoreBox styleClasses={[CoreClasses.PADDING.P3]}>
+          <CoreForm
+            formId="linkedinPost"
+            mode="edit"
+            authenticated={true}
+          />
+        </CoreBox>
+        
+      </CoreLayoutItem>
+
+    </>
+  );
+}

app/reducers.registry.js

@@ -1,3 +1,3 @@
-import testReducer from "./reducers/test.reducer";
+import linkedinReducer from "./reducers/linkedIn.reducer";
 
-export const ReducersRegistry = { "test": testReducer };
+export const ReducersRegistry = { "linkedIn": linkedinReducer };

app/reducers/linkedIn.reducer.js

@@ -0,0 +1,31 @@
+import { POST_FAILURE, POST_SUCCESS } from "../types/test.types";
+
+const initialState = {
+  data   : {},
+  error  : false,
+  success: false,
+};
+
+const linkedinReducer = (state = initialState, action) => {
+  switch (action.type) {
+    case POST_SUCCESS:
+      return {
+        ...state,
+        data   : action.payload,
+        error  : false,
+        success: true
+      };
+
+    case POST_FAILURE:
+      return {
+        ...state,
+        error  : true,
+        success: false
+      };
+
+    default:
+      return state;
+  }
+};
+
+export default linkedinReducer;

app/reducers/test.reducer.js

@@ -1,4 +1,4 @@
-import { RESET_TEST, TEST_FAILURE, TEST_SUCCESS } from "../types/test.types";
+import { RESET_TEST } from "../types/test.types";
 
 const initialState = {
   error  : false,
@@ -8,18 +8,6 @@ const initialState = {
 
 const testReducer = (state = initialState, action) => {
   switch (action.type) {
-    case TEST_SUCCESS:
-      return {
-        ...state,
-        success: true
-      };
-
-    case TEST_FAILURE:
-      return {
-        ...state,
-        success: true
-      };
-
     case RESET_TEST:
       return initialState;
 

app/routes.registry.js

@@ -1,8 +1,17 @@
+import { BlankLayout } from "@wrappid/core";
+
 export const RoutesRegistry = {
   defaultModuleRoute: {
     Page        : { appComponent: "ModuleComponent" },
     authRequired: false,
     entityRef   : "wrappid",
     url         : "wrappid"
   },
+
+  linkedInPost: {
+    Page        : { appComponent: "PostToLinkedin", layout: BlankLayout.name },
+    authRequired: true,
+    entityRef   : "linkedinpost",
+    url         : "linkedinpost"
+  },
 };

app/types/test.types.js

@@ -1,3 +1,3 @@
-export const TEST_SUCCESS = "TEST_SUCCESS";
-export const TEST_FAILURE = "TEST_FAILURE";
+export const POST_SUCCESS = "POST_SUCCESS";
+export const POST_FAILURE = "POST_FAILURE";
 export const RESET_TEST = "RESET_TEST";