Merge pull request #271 from memser-spaceport/feat/new-member-filter

Feat/new member filter
memser-spaceport · Oct 8, 2024 · eaa1d7b · eaa1d7b
2 parents edccb07 + 6260c92
commit eaa1d7b
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 23 deletions.
diff --git a/components/page/members/members-filter.tsx b/components/page/members/members-filter.tsx
@@ -195,7 +195,7 @@ const MembersFilter = (props: IMembersFilter) => {
             </div>
             {/* Recently Added filter */}
             <div className="team-filter__body__toggle-section__toggle-option">
-              <h3 className="team-filter__body__toggle-section__toogle-option__title">Recently Added</h3>
+              <h3 className="team-filter__body__toggle-section__toogle-option__title">New Members</h3>
               <div className="team-filter__body__toggle-section__toggle-option__body__topic__select__toggle">
                 <Toggle
                   height="16px"

diff --git a/components/page/projects/project-filter.tsx b/components/page/projects/project-filter.tsx
@@ -176,7 +176,7 @@ const ProjectFilter = (props: any) => {
         <div className="project-filter__body">
         <div className="project-filter__body__raisingfund">
             <div className="project-filter__body__raisingfund__wrpr">
-              <h3 className="project-filter__body__raisingfund__title">Recently Added</h3>
+              <h3 className="project-filter__body__raisingfund__title">New Projects</h3>
             </div>
             <div className="project-filter__body__raisingfund__toggle">
               <Toggle height="16px" width="28px" callback={onRecentToggleClicked} isChecked={!!isRecent} />

diff --git a/components/page/teams/filter.tsx b/components/page/teams/filter.tsx
@@ -166,7 +166,7 @@ const Filter = (props: ITeamFilterWeb) => {
           </div>
           {/* New member filter */}
           <div className="team-filter__body__recent">
-            <h3 className="team-filter__body__recent__title">Recently Added</h3>
+            <h3 className="team-filter__body__recent__title">New Teams</h3>
             <div className="pe__body__topic__select__toggle">
               <Toggle height="16px" width="28px" callback={onIsRecentToggle} isChecked={isRecent} />
             </div>

diff --git a/components/ui/text-editor.tsx b/components/ui/text-editor.tsx
@@ -6,32 +6,40 @@ interface ITextEditorProps {
   text: string;
   setContent: (item: string) => void;
   id?: string;
+  maxLength?: number;
 }
 
 const TextEditor = (props: ITextEditorProps) => {
-  // const [text, setText] = useState<string>(props.text);
-
+  const [text, setText] = useState<string>(props.text);
 
+  const maxLen = props.maxLength || 500;
   return (
     <>
-
-        <Editor
-          apiKey="4r3lcidhwfoiq9msn7qrmrpa92d1321nikuor8492wdh98p5"
-          value={props.text}
-          id={props.id || 'editor'}
-          init={{
-            branding: false,
-            // height:372,
-            menubar: false,
-            toolbar_sticky: true,
-            mobile: {
-              toolbar_mode: 'wrap',
-            },
-            plugins: 'lists fullscreen link',
-            toolbar: 'undo redo fullscreen  | bold italic underline strikethrough aligncenter alignleft alignright blockquote link bullist numlist removeformat',
-          }}
-            onEditorChange={(newValue, editor) => props?.setContent(newValue)}
-        />
+      <Editor
+        apiKey={process.env.TEXT_EDITOR_API_KEY}
+        value={props.text}
+        id={props.id || 'editor'}
+        init={{
+          branding: false,
+          // height:372,
+          menubar: false,
+          toolbar_sticky: true,
+          mobile: {
+            toolbar_mode: 'wrap',
+          },
+          plugins: 'lists fullscreen link',
+          toolbar: 'undo redo fullscreen  | bold italic underline strikethrough aligncenter alignleft alignright blockquote link bullist numlist removeformat',
+        }}
+        onEditorChange={(newValue, editor) => {
+          if(maxLen - text.length){
+            props?.setContent(newValue);
+            setText(newValue);
+          }
+        }}
+      />
+      <div className='editor__count'>
+        <div className='editor__count__txt'>{maxLen - text.length}/{maxLen}</div>
+      </div>
       <style jsx>{`
         .editor__save-changes {
           padding: 10px 24px;
@@ -43,6 +51,15 @@ const TextEditor = (props: ITextEditorProps) => {
           float: right;
           margin-top: 8px;
         }
+          .editor__count{
+            position: relative;
+            display: flex;
+            flex-direction: row-reverse;
+          }
+            .editor__count__txt{
+              font-size: 12px;
+              color: #6b7c93;
+            }
       `}</style>
     </>
   );

diff --git a/next.config.mjs b/next.config.mjs
@@ -24,6 +24,7 @@ const nextConfig = {
     IRL_DEFAULT_TOPICS: process.env.IRL_DEFAULT_TOPICS,
     IRL_PGF_FORM_URL: process.env.IRL_PGF_FORM_URL,
     HUSKY_API_URL: process.env.HUSKY_API_URL,
+    TEXT_EDITOR_API_KEY: process.env.TEXT_EDITOR_API_KEY
   },
   images: {
     remotePatterns: [