⭐ Ask users for permission to send newsletter

config.ts

@@ -6,7 +6,7 @@ import { AspectRatioRange } from './src/utils/aspect-ratio/AspectRatioRange';
 import { expectAspectRatioInRange } from './src/utils/aspect-ratio/expectAspectRatioInRange';
 import { DigitalOceanSpaces } from './src/utils/cdn/classes/DigitalOceanSpaces';
 import { createColorfulComputeImageColorStats15 } from './src/utils/image/palette/15/createColorfulComputeImageColorStats15';
-import { IComputeImageColorStats } from './src/utils/image/utils/IImageColorStats';
+import type { IComputeImageColorStats } from './src/utils/image/utils/IImageColorStats';
 import { isRunningInBrowser } from './src/utils/isRunningInWhatever';
 import { isUrlOnPrivateNetwork } from './src/utils/validators/isUrlOnPrivateNetwork';
 import { validateUuid } from './src/utils/validators/validateUuid';

scripts/generate-wallpapers-color-stats/generate-wallpapers-color-stats.ts

@@ -12,7 +12,7 @@ import YAML from 'yaml';
 import { COLORSTATS_DEFAULT_COMPUTE_IN_SCRIPT, MIDJOURNEY_WHOLE_GALLERY_PATH } from '../../config';
 import { createImageInNode } from '../../src/utils/image/createImageInNode';
 import { serializeColorStats } from '../../src/utils/image/utils/serializeColorStats';
-import { IWallpaperMetadata } from '../../src/utils/IWallpaper';
+import type { IWallpaperMetadata } from '../../src/utils/IWallpaper';
 import { commit } from '../utils/autocommit/commit';
 import { isWorkingTreeClean } from '../utils/autocommit/isWorkingTreeClean';
 import { forEachHardcodedWallpaper } from '../utils/hardcoded-wallpaper/forEachHardcodedWallpaper';

scripts/generate-wallpapers-content/generate-wallpapers-content.ts

@@ -7,11 +7,11 @@ import chalk from 'chalk';
 import commander from 'commander';
 import { readFile, writeFile } from 'fs/promises';
 import { join, relative } from 'path';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { forTime } from 'waitasecond';
 import { FONTS, OPENAI_API_KEY } from '../../config';
 import { extractTitleFromContent } from '../../src/utils/content/extractTitleFromContent';
-import { IWallpaperMetadata } from '../../src/utils/IWallpaper';
+import type { IWallpaperMetadata } from '../../src/utils/IWallpaper';
 import { randomItem } from '../../src/utils/randomItem';
 import { commit } from '../utils/autocommit/commit';
 import { isWorkingTreeClean } from '../utils/autocommit/isWorkingTreeClean';

scripts/generate-wallpapers-content/repair-wallpapers-content.ts

@@ -7,7 +7,7 @@ import chalk from 'chalk';
 import commander from 'commander';
 import { readFile, writeFile } from 'fs/promises';
 import { join } from 'path';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { forTime } from 'waitasecond';
 import { FONTS, MAX_CHARS_IN_TITLE, OPENAI_API_KEY } from '../../config';
 import { extractTitleFromContent } from '../../src/utils/content/extractTitleFromContent';

scripts/integration-test-with-server/forCondition.ts

@@ -1,4 +1,4 @@
-import { Promisable } from 'type-fest';
+import type { Promisable } from 'type-fest';
 import { forTime, forValueDefined } from 'waitasecond';
 
 export async function forCondition(

scripts/playground/playground.ts

@@ -6,7 +6,7 @@ dotenv.config({ path: '.env' });
 import chalk from 'chalk';
 import { join } from 'path';
 // import { ChatThread } from '../../src/ai/text-to-text/ChatThread';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { getOpenaiForServer } from '../../src/ai/text-to-text/getOpenaiForServer';
 
 if (process.cwd() !== join(__dirname, '../..')) {

scripts/utils/autocommit/commit.ts

@@ -1,7 +1,7 @@
 import chalk from 'chalk';
 import { mkdir, unlink, writeFile } from 'fs/promises';
 import { dirname, join } from 'path';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { execCommand } from '../execCommand/execCommand';
 import { isWorkingTreeClean } from './isWorkingTreeClean';
 

scripts/utils/execCommand/execCommand.ts

@@ -1,9 +1,9 @@
 import chalk from 'chalk';
 import { spawn } from 'child_process';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { forTime } from 'waitasecond';
 import { execCommandNormalizeOptions } from './execCommandNormalizeOptions';
-import { IExecCommandOptions } from './IExecCommandOptions';
+import type { IExecCommandOptions } from './IExecCommandOptions';
 
 export function execCommand(options: IExecCommandOptions): Promise<string> {
     return new Promise((resolve, reject) => {

scripts/utils/execCommand/execCommandNormalizeOptions.ts

@@ -1,4 +1,4 @@
-import { IExecCommandOptions, IExecCommandOptionsAdvanced } from './IExecCommandOptions';
+import type { IExecCommandOptions, IExecCommandOptionsAdvanced } from './IExecCommandOptions';
 
 export function execCommandNormalizeOptions(options: IExecCommandOptions): Pick<
     IExecCommandOptionsAdvanced,

scripts/utils/hardcoded-wallpaper/forEachHardcodedWallpaper.ts

@@ -3,7 +3,7 @@ import moment from 'moment';
 import { COLORSTATS_DEFAULT_COMPUTE_IN_SCRIPT } from '../../../config';
 import { forPlay } from '../forPlay';
 import { getHardcodedWallpapersMetadataFilePaths } from './getHardcodedWallpapersMetadataFilePaths';
-import { IHardcodedWallpaperFiles } from './IHardcodedWallpaperFiles';
+import type { IHardcodedWallpaperFiles } from './IHardcodedWallpaperFiles';
 
 /**
  * Executes a series of async tasks on hardcoded wallpapers

scripts/utils/hardcoded-wallpaper/getHardcodedWallpapers.ts

@@ -1,6 +1,6 @@
 import chalk from 'chalk';
 import { readFile } from 'fs/promises';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import YAML from 'yaml';
 import {
     COLORSTATS_DEFAULT_COMPUTE_IN_SCRIPT,
@@ -11,8 +11,8 @@ import {
 import { parseKeywordsFromWallpaper } from '../../../src/components/Gallery/GalleryFilter/utils/parseKeywordsFromWallpaper';
 import { FULLHD } from '../../../src/constants';
 import { extractTitleFromContent } from '../../../src/utils/content/extractTitleFromContent';
-import { IWallpaperMetadata, IWallpaperSerialized } from '../../../src/utils/IWallpaper';
-import { string_file_path } from '../../../src/utils/typeAliases';
+import type { IWallpaperMetadata, IWallpaperSerialized } from '../../../src/utils/IWallpaper';
+import type { string_file_path } from '../../../src/utils/typeAliases';
 import { isFileExisting } from '../isFileExisting';
 import { getHardcodedWallpapersMetadataFilePaths } from './getHardcodedWallpapersMetadataFilePaths';
 

scripts/utils/prettify.ts

@@ -1,7 +1,7 @@
 import { readFile } from 'fs';
 import { join } from 'path';
 import prettier from 'prettier';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { promisify } from 'util';
 
 export async function prettify(fileContents: string, parser = 'typescript'): Promise<string> {

src/ai/image-to-text/imageToText.ts

@@ -1,7 +1,7 @@
 import { ComputerVisionClient } from '@azure/cognitiveservices-computervision';
 import { CognitiveServicesCredentials } from '@azure/ms-rest-azure-js';
 import { AZURE_COMPUTER_VISION_ENDPOINT, AZURE_COMPUTER_VISION_KEY } from '../../../config';
-import { image_description } from '../../utils/typeAliases';
+import type { image_description } from '../../utils/typeAliases';
 
 /**
  * Analyzes an image through the Azure Computer vision API

src/ai/recommendation/likedStatusToLikeness.ts

@@ -1,5 +1,5 @@
 import type { LikedStatus } from '../../utils/hooks/useLikedStatusOfCurrentWallpaper';
-import { number_likeness } from '../../utils/typeAliases';
+import type { number_likeness } from '../../utils/typeAliases';
 
 const LIKED_STATUS_LIKENESS: Record<keyof typeof LikedStatus, number_likeness> = {
     NONE: 0 /* <- TODO: [🧠] Maybe -0.1 or some small negative number, wallpaper user go through and did not react person maybe dislike */,

src/ai/recommendation/pickMostRecommended.ts

@@ -1,6 +1,6 @@
-import { IWallpaper } from '../../utils/IWallpaper';
-import { number_likeness } from '../../utils/typeAliases';
-import { IWallpaperVector } from './IWallpaperVector';
+import type { IWallpaper } from '../../utils/IWallpaper';
+import type { number_likeness } from '../../utils/typeAliases';
+import type { IWallpaperVector } from './IWallpaperVector';
 import { wallpaperToVector } from './wallpaperToVector';
 import { wallpaperVectorsDistanceSquared } from './wallpaperVectorsDistanceSquared';
 

src/ai/recommendation/wallpaperToVector.ts

@@ -1,5 +1,5 @@
-import { IWallpaper } from '../../utils/IWallpaper';
-import { IWallpaperVector } from './IWallpaperVector';
+import type { IWallpaper } from '../../utils/IWallpaper';
+import type { IWallpaperVector } from './IWallpaperVector';
 
 export function wallpaperToVector(wallpaper: IWallpaper): IWallpaperVector {
     const { red, green, blue } = wallpaper.colorStats.palette[0]!.value;

src/ai/recommendation/wallpaperVectorsDistanceSquared.ts

@@ -1,4 +1,4 @@
-import { IWallpaperVector } from './IWallpaperVector';
+import type { IWallpaperVector } from './IWallpaperVector';
 
 export function wallpaperVectorsDistanceSquared(
     wallpaperVector1: IWallpaperVector,

src/ai/text-to-text/ChatThread.ts

@@ -1,5 +1,5 @@
 import { getSupabaseForServer } from '../../utils/supabase/getSupabaseForServer';
-import { string_chat_prompt, string_model_name, uuid } from '../../utils/typeAliases';
+import type { string_chat_prompt, string_model_name, uuid } from '../../utils/typeAliases';
 import { getOpenaiForServer } from './getOpenaiForServer';
 
 /**

src/ai/text-to-text/completeWithGpt.ts

@@ -1,5 +1,5 @@
 import { getSupabaseForServer } from '../../utils/supabase/getSupabaseForServer';
-import { string_completion_prompt, string_model_name, uuid } from '../../utils/typeAliases';
+import type { string_completion_prompt, string_model_name, uuid } from '../../utils/typeAliases';
 import { getOpenaiForServer } from './getOpenaiForServer';
 
 export interface ICompleteWithGptResult {

src/ai/text-to-text/prompt-templates/createContentPromptTemplate.ts

@@ -1,5 +1,5 @@
-import spaceTrim from 'spacetrim';
-import { image_description, string_chat_prompt, string_midjourney_prompt } from '../../../utils/typeAliases';
+import { spaceTrim } from 'spacetrim';
+import type { image_description, string_chat_prompt, string_midjourney_prompt } from '../../../utils/typeAliases';
 
 /**
  * Generates a template for creating web content based on a given wallpaper description

src/ai/text-to-text/prompt-templates/createFontPromptTemplate.ts

@@ -1,6 +1,6 @@
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { FONTS } from '../../../../config';
-import { string_chat_prompt } from '../../../utils/typeAliases';
+import type { string_chat_prompt } from '../../../utils/typeAliases';
 
 /**
  * Generates a template for figuring out best fitting font for the website.

src/ai/text-to-text/prompt-templates/createTitlePromptTemplate.ts

@@ -1,5 +1,5 @@
-import spaceTrim from 'spacetrim';
-import { image_description, string_chat_prompt, string_midjourney_prompt } from '../../../utils/typeAliases';
+import { spaceTrim } from 'spacetrim';
+import type { image_description, string_chat_prompt, string_midjourney_prompt } from '../../../utils/typeAliases';
 
 /**
  * Generates a template for creating web title  based on a given wallpaper description

src/ai/text-to-text/writeWallpaperContent.ts

@@ -1,4 +1,4 @@
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { FONTS } from '../../../config';
 import { parseTitleAndTopic } from '../../utils/content/parseTitleAndTopic';
 import { removeQuotes } from '../../utils/content/removeQuotes';

src/components/AiComponents/AiComponentsRoot.tsx

@@ -1,7 +1,8 @@
-import { ReactNode, useContext } from 'react';
-import { Promisable } from 'type-fest';
+import type { ReactNode } from 'react';
+import { useContext } from 'react';
+import type { Promisable } from 'type-fest';
 import { ExportContext } from '../../utils/hooks/ExportContext';
-import { string_css_class } from '../../utils/typeAliases';
+import type { string_css_class } from '../../utils/typeAliases';
 import { InlineScript } from '../InlineScript/InlineScript';
 
 interface AiComponentsRootProps {

src/components/AiComponents/activateGalleryComponent.ts

@@ -1,5 +1,5 @@
 import type { LikedStatus } from '../../utils/hooks/useLikedStatusOfCurrentWallpaper';
-import { string_color, string_wallpaper_id } from '../../utils/typeAliases';
+import type { string_color, string_wallpaper_id } from '../../utils/typeAliases';
 
 export async function activateGalleryComponent(galleryElement: HTMLElement): Promise<void> {
     const moreButtonHtml = `

src/components/AnalyticsAndIntegrations/AnalyticsAndIntegrations.tsx

@@ -1,5 +1,5 @@
 import Script from 'next/script';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 
 /**
  * Renders all the analytics and integrations like Google Analytics, SmartLook, Sentry, ...

src/components/AppHead/WallpaperAppHead.tsx

@@ -1,6 +1,7 @@
 import Head from 'next/head';
 import { useRouter } from 'next/router';
-import { ReactNode, useContext } from 'react';
+import type { ReactNode } from 'react';
+import { useContext } from 'react';
 import { NEXT_PUBLIC_URL } from '../../../config';
 import { AnalyticsAndIntegrations } from '../../components/AnalyticsAndIntegrations/AnalyticsAndIntegrations';
 import { extractDescriptionFromHtml } from '../../utils/content/extractDescriptionFromHtml';

src/components/AsyncContentComponent/AsyncContentComponent.tsx

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { Promisable } from 'type-fest';
+import type { ReactNode } from 'react';
+import type { Promisable } from 'type-fest';
 import { usePromise } from '../../utils/hooks/usePromise';
 
 interface AsyncContentComponentProps {

src/components/ColorPreview/ColorInput/ColorInput.tsx

@@ -2,9 +2,9 @@ import { useState } from 'react';
 import SketchPicker, { PresetColor } from 'react-color/lib/components/sketch/Sketch';
 import { Color } from '../../../utils/color/Color';
 import { useClickOutside } from '../../../utils/hooks/useClickOutside';
-import { WithTake } from '../../../utils/take/interfaces/ITakeChain';
+import type { WithTake } from '../../../utils/take/interfaces/ITakeChain';
 import { take } from '../../../utils/take/take';
-import { string_css_class } from '../../../utils/typeAliases';
+import type { string_css_class } from '../../../utils/typeAliases';
 import { ColorPreview } from '../ColorPreview';
 import styles from './ColorInput.module.css';
 

src/components/ColorPreview/ColorPreview.tsx

@@ -3,7 +3,7 @@ import { classNames } from '../../utils/classNames';
 import { Color } from '../../utils/color/Color';
 import { textColor } from '../../utils/color/operators/furthest';
 import { take } from '../../utils/take/take';
-import { string_css_class } from '../../utils/typeAliases';
+import type { string_css_class } from '../../utils/typeAliases';
 import styles from './ColorPreview.module.css';
 
 interface ColorPreviewProps {

src/components/ColorsModal/ColorsModal.tsx

@@ -4,6 +4,7 @@ import { Color } from '../../utils/color/Color';
 import { textColor } from '../../utils/color/operators/furthest';
 import { useCurrentWallpaper } from '../../utils/hooks/useCurrentWallpaper';
 import { Modal } from '../Modal/00-Modal';
+import { useCloseWallpaperModalHandler } from '../WallpaperLink/useCloseWallpaperModalHandler';
 import styles from './ColorsModal.module.css';
 import { ColorsModalColorAlgoritm } from './ColorsModalColorAlgoritm';
 
@@ -14,7 +15,7 @@ export function ColorsModal() {
     const [wallpaper, modifyWallpaper] = useCurrentWallpaper();
 
     return (
-        <Modal title="Colors" isCloseable>
+        <Modal title="Colors" isCloseable onClose={useCloseWallpaperModalHandler()}>
             <div className={styles.section}>{wallpaper.src}</div>
             <div className={styles.section}>
                 <ColorsModalColorAlgoritm />
@@ -61,7 +62,6 @@ export function ColorsModal() {
     );
 }
 
-
 /**
  * TODO: [🦼] Use <MonacoEditor/> instead of <SketchPicker/>
- */
+ */

src/components/ControlPanel/RandomWallpaper/RandomWallpaperManager.ts

@@ -1,11 +1,11 @@
-import { Promisable } from 'type-fest';
+import type { Promisable } from 'type-fest';
 import { forAnimationFrame, forImmediate } from 'waitasecond';
 import { IS_DEVELOPMENT, NEXT_PUBLIC_URL } from '../../../../config';
 import type { RecommendWallpaperResponse } from '../../../pages/api/recommend-wallpaper';
-import { IWallpaperSerialized } from '../../../utils/IWallpaper';
+import type { IWallpaperSerialized } from '../../../utils/IWallpaper';
 import { randomItem } from '../../../utils/randomItem';
 import { provideClientIdWithoutVerification } from '../../../utils/supabase/provideClientIdWithoutVerification';
-import { string_wallpaper_id } from '../../../utils/typeAliases';
+import type { string_wallpaper_id } from '../../../utils/typeAliases';
 
 export type IWallpaperInStorage = Pick<IWallpaperSerialized, 'id' | 'src'>;
 

src/components/ControlPanel/RandomWallpaper/useRandomWallpaper.ts

@@ -1,7 +1,8 @@
 import { useMemo } from 'react';
 import { useCurrentWallpaperId } from '../../../utils/hooks/useCurrentWallpaperId';
 import { usePromise } from '../../../utils/hooks/usePromise';
-import { IWallpaperInStorage, RandomWallpaperManager } from './RandomWallpaperManager';
+import type { IWallpaperInStorage } from './RandomWallpaperManager';
+import { RandomWallpaperManager } from './RandomWallpaperManager';
 
 export function useRandomWallpaper(): [
     randomWallpaper: IWallpaperInStorage | null,
@@ -17,7 +18,7 @@ export function useRandomWallpaper(): [
     );
     const { value: recommendedWallpaper } = usePromise(randomWallpaperPromise);
 
-    console.info(`🎲 Use recommended wallpaper`, {recommendedWallpaper});
+    console.info(`🎲 Use recommended wallpaper`, { recommendedWallpaper });
 
     return [
         recommendedWallpaper || null,

src/components/CopilotPanel/CopilotPanel.tsx

@@ -1,7 +1,7 @@
 import Image from 'next/image';
 import { useRouter } from 'next/router';
 import { useCallback, useMemo, useRef, useState } from 'react';
-import spaceTrim from 'spacetrim';
+import { spaceTrim } from 'spacetrim';
 import { COPILOT_PLACEHOLDERS, IS_VERIFIED_EMAIL_REQUIRED } from '../../../config';
 import type {
     UpdateWallpaperContentRequest,
@@ -17,7 +17,7 @@ import { serializeWallpaper } from '../../utils/hydrateWallpaper';
 import { shuffleItems } from '../../utils/shuffleItems';
 import { getSupabaseForBrowser } from '../../utils/supabase/getSupabaseForBrowser';
 import { provideClientId } from '../../utils/supabase/provideClientId';
-import { string_prompt } from '../../utils/typeAliases';
+import type { string_prompt } from '../../utils/typeAliases';
 import { parseKeywordsFromWallpaper } from '../Gallery/GalleryFilter/utils/parseKeywordsFromWallpaper';
 import { Hint } from '../Hint/Hint';
 import { TorusInteractiveImage } from '../TaskInProgress/TorusInteractiveImage';

src/components/CreateZone/CreateZone.tsx

@@ -1,6 +1,6 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 import { classNames } from '../../utils/classNames';
-import { string_css_class } from '../../utils/typeAliases';
+import type { string_css_class } from '../../utils/typeAliases';
 import { Center } from '../SimpleLayout/Center';
 import { TakeNoSpace } from '../SimpleLayout/TakeNoSpace';
 import styles from './CreateZone.module.css';

src/components/DeviceIframe/DeviceIframe.tsx

@@ -1,6 +1,6 @@
 import Link from 'next/link';
 import { classNames } from '../../utils/classNames';
-import { string_css_class, string_url } from '../../utils/typeAliases';
+import type { string_css_class, string_url } from '../../utils/typeAliases';
 import styles from './DeviceIframe.module.css';
 
 interface DeviceIframeProps {

src/components/Dialogues/Dialogues.module.css → src/components/Dialogs/Dialogs.module.css

@@ -1,9 +1,18 @@
+.message {
+    /**/
+    outline: 1px dotted rgb(81, 255, 38);
+    /**/
+
+    /*
+    TODO: !!!
+    */
+}
 .answer {
     /*/
     outline: 1px dotted rgb(81, 255, 38);
     /**/
 
-    z-index: 1 /* <- Note: Local order in dialogue */;
+    z-index: 1 /* <- Note: Local order in dialog */;
 
     width: 100%;
     height: calc(100% - 50px);
@@ -22,7 +31,7 @@
     outline: 1px dotted rgb(81, 255, 38);
     /**/
 
-    z-index: 2 /* <- Note: Local order in dialogue */;
+    z-index: 2 /* <- Note: Local order in dialog */;
 
     float: right;