Merge branch 'main' into fix/-media-minor-css-changes-and-split-media-component

Author: jamesread

.github/ISSUE_TEMPLATE/01_installation.prolem.yml

@@ -1,7 +1,7 @@
 name: "🙏🏻 Installation Problem"
 description: "Report an issue with installation"
 title: "Installation Problem"
-labels: ["installation"]
+labels: ["type: installation"]
 body:
   - type: markdown
     attributes:
@@ -13,4 +13,7 @@ body:
     attributes:
       label: For installation issues, please visit our https://discord.postiz.com for assistance.
       description: For installation issues, please visit our [Discord Support](https://discord.postiz.com) for assistance.
-      placeholder: For installation issues, please visit our https://discord.postiz.com for assistance.
+      placeholder: |
+        For installation issues, please visit our https://discord.postiz.com for assistance.
+        Please do not save this issue - do not submit installation issues on GitHub.
+

README.md

@@ -1,7 +1,7 @@
 <p align="center">
-  Please help us out on Product Hunt,<br />to give you the best open-source<br />social media scheduling tool in the world 🌎👇 <br /><br />
-<a href="https://www.producthunt.com/posts/postiz?embed=true&utm_source=badge-featured&utm_medium=badge&utm_souce=badge-postiz" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=606350&theme=light" alt="Postiz - Your&#0032;ultimate&#0032;AI&#0032;social&#0032;media&#0032;scheduling&#0032;tool&#0032; | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
-  <br /><br />
+  <a href="https://affiliate.postiz.com">
+    <img src="https://github.com/user-attachments/assets/af9f47b3-e20c-402b-bd11-02f39248d738" />
+  </a>
 </p>
 
 <p align="center">

apps/backend/src/api/routes/integrations.controller.ts

@@ -5,6 +5,7 @@ import {
   Get,
   Param,
   Post,
+  Put,
   Query,
   UseFilters,
 } from '@nestjs/common';
@@ -48,6 +49,37 @@ export class IntegrationsController {
     return this._integrationManager.getAllIntegrations();
   }
 
+  @Get('/customers')
+  getCustomers(@GetOrgFromRequest() org: Organization) {
+    return this._integrationService.customers(org.id);
+  }
+
+  @Put('/:id/group')
+  async updateIntegrationGroup(
+    @GetOrgFromRequest() org: Organization,
+    @Param('id') id: string,
+    @Body() body: { group: string }
+  ) {
+    return this._integrationService.updateIntegrationGroup(
+      org.id,
+      id,
+      body.group
+    );
+  }
+
+  @Put('/:id/customer-name')
+  async updateOnCustomerName(
+    @GetOrgFromRequest() org: Organization,
+    @Param('id') id: string,
+    @Body() body: { name: string }
+  ) {
+    return this._integrationService.updateOnCustomerName(
+      org.id,
+      id,
+      body.name
+    );
+  }
+
   @Get('/list')
   async getIntegrationList(@GetOrgFromRequest() org: Organization) {
     return {
@@ -71,6 +103,7 @@ export class IntegrationsController {
           time: JSON.parse(p.postingTimes),
           changeProfilePicture: !!findIntegration?.changeProfilePicture,
           changeNickName: !!findIntegration?.changeNickname,
+          customer: p.customer,
         };
       }),
     };
@@ -408,9 +441,17 @@ export class IntegrationsController {
       );
     }
 
+    let validName = name;
+    if (!validName) {
+      if (username) {
+        validName = username.split('.')[0] ?? username;
+      } else {
+        validName = `Channel_${String(id).slice(0, 8)}`;
+      }
+    }
     return this._integrationService.createOrUpdateIntegration(
       org.id,
-      name,
+      validName.trim(),
       picture,
       'social',
       String(id),

apps/frontend/public/favicon.ico

@@ -384,3 +384,14 @@ div div .set-font-family {
   font-style: normal !important;
   font-weight: 400 !important;
 }
+
+.col-calendar:hover:before {
+  content: "Date passed";
+  color: white;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  white-space: nowrap;
+  opacity: 30%;
+}

apps/frontend/src/app/global.scss

@@ -13,6 +13,7 @@ import { VariableContextComponent } from '@gitroom/react/helpers/variable.contex
 import { Fragment } from 'react';
 import { PHProvider } from '@gitroom/react/helpers/posthog';
 import UtmSaver from '@gitroom/helpers/utils/utm.saver';
+import { ToltScript } from '@gitroom/frontend/components/layout/tolt.script';
 
 const chakra = Chakra_Petch({ weight: '400', subsets: ['latin'] });
 
@@ -26,7 +27,7 @@ export default async function AppLayout({ children }: { children: ReactNode }) {
       <head>
         <link
           rel="icon"
-          href={!!process.env.IS_GENERAL ? '/favicon.png' : '/postiz-fav.png'}
+          href="/favicon.ico"
           sizes="any"
         />
       </head>
@@ -42,7 +43,9 @@ export default async function AppLayout({ children }: { children: ReactNode }) {
           frontEndUrl={process.env.FRONTEND_URL!}
           isGeneral={!!process.env.IS_GENERAL}
           uploadDirectory={process.env.NEXT_PUBLIC_UPLOAD_STATIC_DIRECTORY!}
+          tolt={process.env.NEXT_PUBLIC_TOLT!}
         >
+          <ToltScript />
           <Plausible
             domain={!!process.env.IS_GENERAL ? 'postiz.com' : 'gitroom.com'}
           >

apps/frontend/src/app/layout.tsx

@@ -23,6 +23,7 @@ import { TopTitle } from '@gitroom/frontend/components/launches/helpers/top.titl
 import { Textarea } from '@gitroom/react/form/textarea';
 import { useFireEvents } from '@gitroom/helpers/utils/use.fire.events';
 import { useUtmUrl } from '@gitroom/helpers/utils/utm.saver';
+import { useTolt } from '@gitroom/frontend/components/layout/tolt.script';
 
 export interface Tiers {
   month: Array<{
@@ -221,6 +222,7 @@ export const MainBillingComponent: FC<{
   const modal = useModals();
   const router = useRouter();
   const utm = useUtmUrl();
+  const tolt = useTolt();
 
   const [subscription, setSubscription] = useState<Subscription | undefined>(
     sub
@@ -348,6 +350,7 @@ export const MainBillingComponent: FC<{
             period: monthlyOrYearly === 'on' ? 'YEARLY' : 'MONTHLY',
             utm,
             billing,
+            tolt: tolt()
           }),
         })
       ).json();

apps/frontend/src/components/billing/main.billing.component.tsx

@@ -50,6 +50,8 @@ import { makeId } from '@gitroom/nestjs-libraries/services/make.is';
 import Image from 'next/image';
 import { weightedLength } from '@gitroom/helpers/utils/count.length';
 import { MultiMediaComponent } from '../media/multimedia.component';
+import { uniqBy } from 'lodash';
+import { Select } from '@gitroom/react/form/select';
 
 function countCharacters(text: string, type: string): number {
   if (type !== 'x') {
@@ -65,17 +67,36 @@ export const AddEditModal: FC<{
   reopenModal: () => void;
   mutate: () => void;
 }> = (props) => {
-  const { date, integrations, reopenModal, mutate } = props;
-  const [dateState, setDateState] = useState(date);
-
-  // hook to open a new modal
-  const modal = useModals();
+  const { date, integrations: ints, reopenModal, mutate } = props;
+  const [customer, setCustomer] = useState('');
 
   // selected integrations to allow edit
   const [selectedIntegrations, setSelectedIntegrations] = useStateCallback<
     Integrations[]
   >([]);
 
+  const integrations = useMemo(() => {
+    if (!customer) {
+      return ints;
+    }
+
+    const list = ints.filter((f) => f?.customer?.id === customer);
+    if (list.length === 1) {
+      setSelectedIntegrations([list[0]]);
+    }
+
+    return list;
+  }, [customer, ints]);
+
+  const totalCustomers = useMemo(() => {
+    return uniqBy(ints, (i) => i?.customer?.id).length;
+  }, [ints]);
+
+  const [dateState, setDateState] = useState(date);
+
+  // hook to open a new modal
+  const modal = useModals();
+
   // value of each editor
   const [value, setValue] = useState<
     Array<{
@@ -276,7 +297,8 @@ export const AddEditModal: FC<{
       for (const key of allKeys) {
         if (key.checkValidity) {
           const check = await key.checkValidity(
-            key?.value.map((p: any) => p.image || [])
+            key?.value.map((p: any) => p.image || []),
+            key.settings
           );
           if (typeof check === 'string') {
             toaster.show(check, 'warning');
@@ -285,11 +307,12 @@ export const AddEditModal: FC<{
         }
 
         if (
-          key.value.some(
-            (p) => {
-              return countCharacters(p.content, key?.integration?.identifier || '') > (key.maximumCharacters || 1000000);
-            }
-          )
+          key.value.some((p) => {
+            return (
+              countCharacters(p.content, key?.integration?.identifier || '') >
+              (key.maximumCharacters || 1000000)
+            );
+          })
         ) {
           if (
             !(await deleteDialog(
@@ -416,6 +439,26 @@ export const AddEditModal: FC<{
                   information={data}
                   onChange={setPostFor}
                 />
+                {totalCustomers > 1 && (
+                  <Select
+                    hideErrors={true}
+                    label=""
+                    name="customer"
+                    value={customer}
+                    onChange={(e) => {
+                      setCustomer(e.target.value);
+                      setSelectedIntegrations([]);
+                    }}
+                    disableForm={true}
+                  >
+                    <option value="">Selected Customer</option>
+                    {uniqBy(ints, (u) => u?.customer?.name).map((p) => (
+                      <option key={p.customer?.id} value={p.customer?.id}>
+                        Customer: {p.customer?.name}
+                      </option>
+                    ))}
+                  </Select>
+                )}
                 <DatePicker onChange={setDateState} date={dateState} />
               </div>
             </TopTitle>

apps/frontend/src/components/launches/add.edit.model.tsx

@@ -62,6 +62,10 @@ export interface Integrations {
   changeProfilePicture: boolean;
   changeNickName: boolean;
   time: { time: number }[];
+  customer?: {
+    name?: string;
+    id?: string;
+  }
 }
 
 function getWeekNumber(date: Date) {

apps/frontend/src/components/launches/calendar.context.tsx

@@ -13,7 +13,6 @@ import clsx from 'clsx';
 import { useFetch } from '@gitroom/helpers/utils/custom.fetch';
 import { ExistingDataContextProvider } from '@gitroom/frontend/components/launches/helpers/use.existing.data';
 import { useDrag, useDrop } from 'react-dnd';
-import { DNDProvider } from '@gitroom/frontend/components/launches/helpers/dnd.provider';
 import { Integration, Post, State } from '@prisma/client';
 import { useAddProvider } from '@gitroom/frontend/components/launches/add.provider.component';
 import { CommentComponent } from '@gitroom/frontend/components/launches/comments/comment.component';
@@ -27,9 +26,19 @@ import isSameOrBefore from 'dayjs/plugin/isSameOrBefore';
 import { groupBy, sortBy } from 'lodash';
 import Image from 'next/image';
 import { extend } from 'dayjs';
+import { isUSCitizen } from './helpers/isuscitizen.utils';
+import removeMd from 'remove-markdown';
 extend(isSameOrAfter);
 extend(isSameOrBefore);
 
+const convertTimeFormatBasedOnLocality = (time: number) => {
+  if (isUSCitizen()) {
+    return `${time === 12 ? 12 : time % 12}:00 ${time >= 12 ? 'PM' : 'AM'}`;
+  } else {
+    return `${time}:00`;
+  }
+};
+
 export const days = [
   'Monday',
   'Tuesday',
@@ -91,7 +100,7 @@ export const DayView = () => {
               .startOf('day')
               .add(option[0].time, 'minute')
               .local()
-              .format('HH:mm')}
+              .format(isUSCitizen() ? 'hh:mm A' : 'HH:mm')}
           </div>
           <div
             key={option[0].time}
@@ -140,7 +149,8 @@ export const WeekView = () => {
           {hours.map((hour) => (
             <Fragment key={hour}>
               <div className="p-2 pr-4 bg-secondary text-center items-center justify-center flex">
-                {hour.toString().padStart(2, '0')}:00
+                {/* {hour.toString().padStart(2, '0')}:00 */}
+                {convertTimeFormatBasedOnLocality(hour)}
               </div>
               {days.map((day, indexDay) => (
                 <Fragment key={`${day}-${hour}`}>
@@ -231,15 +241,15 @@ export const Calendar = () => {
   const { display } = useCalendar();
 
   return (
-    <DNDProvider>
+    <>
       {display === 'day' ? (
         <DayView />
       ) : display === 'week' ? (
         <WeekView />
       ) : (
         <MonthView />
       )}
-    </DNDProvider>
+    </>
   );
 };
 
@@ -433,8 +443,9 @@ export const CalendarColumn: FC<{
       )}
       <div
         className={clsx(
-          'relative flex flex-col flex-1',
-          canDrop && 'bg-white/80'
+          'relative flex flex-col flex-1 text-white',
+          canDrop && 'bg-white/80',
+          isBeforeNow && postList.length === 0 && 'cursor-not-allowed'
         )}
       >
         <div
@@ -445,8 +456,9 @@ export const CalendarColumn: FC<{
               }
             : {})}
           className={clsx(
-            'flex-col text-[12px] pointer w-full cursor-pointer overflow-hidden overflow-x-auto flex scrollbar scrollbar-thumb-tableBorder scrollbar-track-secondary',
-            isBeforeNow && 'bg-customColor23 flex-1',
+            'flex-col text-[12px] pointer w-full overflow-hidden overflow-x-auto flex scrollbar scrollbar-thumb-tableBorder scrollbar-track-secondary',
+            isBeforeNow ? 'bg-customColor23 flex-1' : 'cursor-pointer',
+            isBeforeNow && postList.length === 0 && 'col-calendar',
             canBeTrending && 'bg-customColor24'
           )}
         >
@@ -593,7 +605,7 @@ const CalendarItem: FC<{
       </div>
       <div className="whitespace-pre-wrap line-clamp-3">
         {state === 'DRAFT' ? 'Draft: ' : ''}
-        {post.content}
+        {removeMd(post.content).replace(/\n/g, ' ')}
       </div>
     </div>
   );