diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..0bfacb3 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,5 @@ +/build +Makefile +README.md +compose.yml +/.git diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3a1bea6 --- /dev/null +++ b/.gitignore @@ -0,0 +1,25 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# production +/build + +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local + +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +.idea diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml new file mode 100644 index 0000000..72a3692 --- /dev/null +++ b/.gitlab-ci.yml @@ -0,0 +1,38 @@ +include: + - project: "devops/pena-continuous-integration" + file: "/templates/docker/build-template.gitlab-ci.yml" + - project: "devops/pena-continuous-integration" + file: "/templates/docker/clean-template.gitlab-ci.yml" + - project: "devops/pena-continuous-integration" + file: "/templates/docker/deploy-template.gitlab-ci.yml" +stages: + - clean + - build + - deploy + +clear-old-images: + extends: .clean_template + variables: + STAGING_BRANCH: "main" + PRODUCTION_BRANCH: "main" + image: + name: docker/compose:1.28.0 + entrypoint: [""] + before_script: + - docker login -u $CI_REGISTRY_USER -p $CI_REGISTRY_PASSWORD $CI_REGISTRY + - docker images + script: + - docker system prune -af +build-app: + extends: .build_template + variables: + DOCKER_BUILD_PATH: "./Dockerfile" + STAGING_BRANCH: "main" + PRODUCTION_BRANCH: "main" + +deploy-to-staging: + extends: .deploy_template + variables: + DEPLOY_TO: "staging" + BRANCH: "main" + diff --git a/.yarnrc b/.yarnrc new file mode 100644 index 0000000..e1a507d --- /dev/null +++ b/.yarnrc @@ -0,0 +1 @@ +"@frontend:registry" "https://penahub.gitlab.yandexcloud.net/api/v4/packages/npm/" diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..9a55e55 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,14 @@ +FROM node:20.10-alpine3.18 as build + +RUN apk update && rm -rf /var/cache/apk/* +WORKDIR /usr/app +COPY . . + +RUN yarn install --ignore-scripts --non-interactive --frozen-lockfile && yarn cache clean +RUN yarn build + + +FROM nginx:latest as result +WORKDIR /usr/share/nginx/html +COPY --from=build /usr/app/build/ /usr/share/nginx/html +COPY hub.conf /etc/nginx/conf.d/default.conf diff --git a/README.md b/README.md deleted file mode 100644 index c55262d..0000000 --- a/README.md +++ /dev/null @@ -1,93 +0,0 @@ -# SquzAnswerer - - - -## Getting started - -To make it easy for you to get started with GitLab, here's a list of recommended next steps. - -Already a pro? Just edit this README.md and make it your own. Want to make it easy? [Use the template at the bottom](#editing-this-readme)! - -## Add your files - -- [ ] [Create](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#create-a-file) or [upload](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#upload-a-file) files -- [ ] [Add files using the command line](https://docs.gitlab.com/ee/gitlab-basics/add-file.html#add-a-file-using-the-command-line) or push an existing Git repository with the following command: - -``` -cd existing_repo -git remote add origin https://penahub.gitlab.yandexcloud.net/frontend/squzanswerer.git -git branch -M main -git push -uf origin main -``` - -## Integrate with your tools - -- [ ] [Set up project integrations](https://penahub.gitlab.yandexcloud.net/frontend/squzanswerer/-/settings/integrations) - -## Collaborate with your team - -- [ ] [Invite team members and collaborators](https://docs.gitlab.com/ee/user/project/members/) -- [ ] [Create a new merge request](https://docs.gitlab.com/ee/user/project/merge_requests/creating_merge_requests.html) -- [ ] [Automatically close issues from merge requests](https://docs.gitlab.com/ee/user/project/issues/managing_issues.html#closing-issues-automatically) -- [ ] [Enable merge request approvals](https://docs.gitlab.com/ee/user/project/merge_requests/approvals/) -- [ ] [Set auto-merge](https://docs.gitlab.com/ee/user/project/merge_requests/merge_when_pipeline_succeeds.html) - -## Test and Deploy - -Use the built-in continuous integration in GitLab. - -- [ ] [Get started with GitLab CI/CD](https://docs.gitlab.com/ee/ci/quick_start/index.html) -- [ ] [Analyze your code for known vulnerabilities with Static Application Security Testing (SAST)](https://docs.gitlab.com/ee/user/application_security/sast/) -- [ ] [Deploy to Kubernetes, Amazon EC2, or Amazon ECS using Auto Deploy](https://docs.gitlab.com/ee/topics/autodevops/requirements.html) -- [ ] [Use pull-based deployments for improved Kubernetes management](https://docs.gitlab.com/ee/user/clusters/agent/) -- [ ] [Set up protected environments](https://docs.gitlab.com/ee/ci/environments/protected_environments.html) - -*** - -# Editing this README - -When you're ready to make this README your own, just edit this file and use the handy template below (or feel free to structure it however you want - this is just a starting point!). Thanks to [makeareadme.com](https://www.makeareadme.com/) for this template. - -## Suggestions for a good README - -Every project is different, so consider which of these sections apply to yours. The sections used in the template are suggestions for most open source projects. Also keep in mind that while a README can be too long and detailed, too long is better than too short. If you think your README is too long, consider utilizing another form of documentation rather than cutting out information. - -## Name -Choose a self-explaining name for your project. - -## Description -Let people know what your project can do specifically. Provide context and add a link to any reference visitors might be unfamiliar with. A list of Features or a Background subsection can also be added here. If there are alternatives to your project, this is a good place to list differentiating factors. - -## Badges -On some READMEs, you may see small images that convey metadata, such as whether or not all the tests are passing for the project. You can use Shields to add some to your README. Many services also have instructions for adding a badge. - -## Visuals -Depending on what you are making, it can be a good idea to include screenshots or even a video (you'll frequently see GIFs rather than actual videos). Tools like ttygif can help, but check out Asciinema for a more sophisticated method. - -## Installation -Within a particular ecosystem, there may be a common way of installing things, such as using Yarn, NuGet, or Homebrew. However, consider the possibility that whoever is reading your README is a novice and would like more guidance. Listing specific steps helps remove ambiguity and gets people to using your project as quickly as possible. If it only runs in a specific context like a particular programming language version or operating system or has dependencies that have to be installed manually, also add a Requirements subsection. - -## Usage -Use examples liberally, and show the expected output if you can. It's helpful to have inline the smallest example of usage that you can demonstrate, while providing links to more sophisticated examples if they are too long to reasonably include in the README. - -## Support -Tell people where they can go to for help. It can be any combination of an issue tracker, a chat room, an email address, etc. - -## Roadmap -If you have ideas for releases in the future, it is a good idea to list them in the README. - -## Contributing -State if you are open to contributions and what your requirements are for accepting them. - -For people who want to make changes to your project, it's helpful to have some documentation on how to get started. Perhaps there is a script that they should run or some environment variables that they need to set. Make these steps explicit. These instructions could also be useful to your future self. - -You can also document commands to lint the code or run tests. These steps help to ensure high code quality and reduce the likelihood that the changes inadvertently break something. Having instructions for running tests is especially helpful if it requires external setup, such as starting a Selenium server for testing in a browser. - -## Authors and acknowledgment -Show your appreciation to those who have contributed to the project. - -## License -For open source projects, say how it is licensed. - -## Project status -If you have run out of energy or time for your project, put a note at the top of the README saying that development has slowed down or stopped completely. Someone may choose to fork your project or volunteer to step in as a maintainer or owner, allowing your project to keep going. You can also make an explicit request for maintainers. diff --git a/craco.config.js b/craco.config.js new file mode 100755 index 0000000..fa1bc01 --- /dev/null +++ b/craco.config.js @@ -0,0 +1,17 @@ +const CracoAlias = require("craco-alias"); + +module.exports = { + plugins: [ + { + plugin: CracoAlias, + options: { + source: "tsconfig", + // baseUrl SHOULD be specified + // plugin does not take it from tsconfig + baseUrl: "./src", + // tsConfigPath should point to the file where "baseUrl" and "paths" are specified + tsConfigPath: "./tsconfig.extend.json" + } + } + ] +}; \ No newline at end of file diff --git a/cypress.config.ts b/cypress.config.ts new file mode 100644 index 0000000..87067ad --- /dev/null +++ b/cypress.config.ts @@ -0,0 +1,10 @@ +import { defineConfig } from "cypress"; + +export default defineConfig({ + e2e: { + baseUrl: 'http://localhost:3000', + viewportWidth: 1440, + viewportHeight: 900, + supportFile: false, + }, +}); diff --git a/deployments/staging/docker-compose.yaml b/deployments/staging/docker-compose.yaml new file mode 100644 index 0000000..4a851e2 --- /dev/null +++ b/deployments/staging/docker-compose.yaml @@ -0,0 +1,13 @@ +services: + squiz: + container_name: squiz + restart: unless-stopped + image: $CI_REGISTRY_IMAGE:$CI_COMMIT_REF_SLUG.$CI_PIPELINE_ID + networks: + - marketplace_penahub_frontend + hostname: squiz + tty: true +networks: + marketplace_penahub_frontend: + external: true + diff --git a/hub.conf b/hub.conf new file mode 100644 index 0000000..a3a8e51 --- /dev/null +++ b/hub.conf @@ -0,0 +1,12 @@ +server { + listen 80; + server_name _; + + location / { + root /usr/share/nginx/html; + index index.html index.htm; + try_files $uri $uri/ /index.html; + } + + root /usr/share/nginx/html; +} diff --git a/package.json b/package.json new file mode 100755 index 0000000..a650129 --- /dev/null +++ b/package.json @@ -0,0 +1,63 @@ +{ + "name": "squidward", + "version": "0.1.0", + "private": true, + "dependencies": { + "@craco/craco": "^7.0.0", + "@emotion/react": "^11.10.5", + "@emotion/styled": "^11.10.5", + "@frontend/kitui": "^1.0.54", + "@mui/icons-material": "^5.10.14", + "@mui/material": "^5.10.14", + "@mui/x-date-pickers": "^6.16.1", + "@types/node": "^16.7.13", + "@types/react": "^18.0.0", + "@types/react-dom": "^18.0.0", + "axios": "^1.5.1", + "dayjs": "^1.11.10", + "emoji-mart": "^5.5.2", + "formik": "^2.4.5", + "immer": "^10.0.3", + "nanoid": "^5.0.3", + "notistack": "^3.0.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-error-boundary": "^4.0.11", + "react-router-dom": "^6.6.2", + "react-scripts": "5.0.1", + "swr": "^2.2.4", + "typescript": "^5.2.2", + "use-debounce": "^9.0.4", + "web-vitals": "^2.1.0", + "yup": "^1.3.2", + "zustand": "^4.3.8" + }, + "scripts": { + "start": "craco start", + "build": "craco build", + "test": "craco test", + "eject": "craco eject", + "cypress:open": "cypress open" + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + }, + "devDependencies": { + "@emoji-mart/data": "^1.1.2", + "@emoji-mart/react": "^1.1.1", + "@types/cytoscape-popper": "^2.0.4", + "@types/react-beautiful-dnd": "^13.1.4", + "@types/react-cytoscapejs": "^1.2.4", + "craco-alias": "^3.0.1", + "cypress": "^13.6.1" + } +} diff --git a/public/android-chrome-192x192.png b/public/android-chrome-192x192.png new file mode 100644 index 0000000..acfcce7 Binary files /dev/null and b/public/android-chrome-192x192.png differ diff --git a/public/android-chrome-512x512.png b/public/android-chrome-512x512.png new file mode 100644 index 0000000..4c931fd Binary files /dev/null and b/public/android-chrome-512x512.png differ diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png new file mode 100644 index 0000000..90e31de Binary files /dev/null and b/public/apple-touch-icon.png differ diff --git a/public/browserconfig.xml b/public/browserconfig.xml new file mode 100644 index 0000000..b3930d0 --- /dev/null +++ b/public/browserconfig.xml @@ -0,0 +1,9 @@ + + + + + + #da532c + + + diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png new file mode 100644 index 0000000..5aae9e7 Binary files /dev/null and b/public/favicon-16x16.png differ diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png new file mode 100644 index 0000000..8e6907d Binary files /dev/null and b/public/favicon-32x32.png differ diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..1f72bd6 Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html new file mode 100755 index 0000000..a96c59f --- /dev/null +++ b/public/index.html @@ -0,0 +1,19 @@ + + + + + + + + + + + + + Pena Quiz + + + +
+ + diff --git a/public/manifest.json b/public/manifest.json new file mode 100755 index 0000000..9969837 --- /dev/null +++ b/public/manifest.json @@ -0,0 +1,25 @@ +{ + "short_name": "React App", + "name": "Create React App Sample", + "icons": [ + { + "src": "favicon.ico", + "sizes": "64x64 32x32 24x24 16x16", + "type": "image/x-icon" + }, + { + "src": "android-chrome-192x192.png", + "type": "image/png", + "sizes": "192x192" + }, + { + "src": "android-chrome-512x512.png", + "type": "image/png", + "sizes": "512x512" + } + ], + "start_url": ".", + "display": "standalone", + "theme_color": "#000000", + "background_color": "#ffffff" +} diff --git a/public/mstile-150x150.png b/public/mstile-150x150.png new file mode 100644 index 0000000..2db962c Binary files /dev/null and b/public/mstile-150x150.png differ diff --git a/public/robots.txt b/public/robots.txt new file mode 100755 index 0000000..e9e57dc --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,3 @@ +# https://www.robotstxt.org/robotstxt.html +User-agent: * +Disallow: diff --git a/public/safari-pinned-tab.svg b/public/safari-pinned-tab.svg new file mode 100644 index 0000000..d2af8af --- /dev/null +++ b/public/safari-pinned-tab.svg @@ -0,0 +1,48 @@ + + + + +Created by potrace 1.14, written by Peter Selinger 2001-2017 + + + + + + + diff --git a/public/site.webmanifest b/public/site.webmanifest new file mode 100644 index 0000000..b20abb7 --- /dev/null +++ b/public/site.webmanifest @@ -0,0 +1,19 @@ +{ + "name": "", + "short_name": "", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..f3b5172 --- /dev/null +++ b/src/App.tsx @@ -0,0 +1,10 @@ +import { ViewPage } from "./pages/ViewPublicationPage"; + +import dayjs from "dayjs"; +dayjs.locale("ru"); + + +export default function App() { + + return ; +} diff --git a/src/api/quizRelase.ts b/src/api/quizRelase.ts new file mode 100644 index 0000000..1a703d2 --- /dev/null +++ b/src/api/quizRelase.ts @@ -0,0 +1,99 @@ +import { makeRequest } from "@frontend/kitui"; + +export function getData(quizId: string) { + return makeRequest({ + url: `https://squiz.pena.digital/answer/settings`, + body: { + quiz_id: quizId, + limit: 100, + page: 0, + need_config: true, + + }, + method: "POST", + }); +} + +export function sendAnswer({ questionId, body, qid }: any) { + const formData = new FormData(); + + const answers = [{ + question_id: questionId, + content: body, //тут массив с ответом + }] + formData.append("answers", JSON.stringify(answers)); + formData.append("qid", qid); + + return makeRequest({ + url: `https://squiz.pena.digital/answer/answer`, + body: formData, + method: "POST", + }); +} + +//body ={file, filename} +export function sendFile({ questionId, body, qid }: any) { + const formData = new FormData(); + + const fd: any = { + question_id: questionId, + content: body.name, + } + + fd[body.name] = body.filen //target.files[0] + + const answers = [fd] + formData.append("answers", JSON.stringify(answers)); + formData.append("qid", qid); + + return makeRequest({ + url: `https://squiz.pena.digital/answer/answer`, + body: formData, + method: "POST", + }); +} + + +const fields = [ + "name", + "email", + "phone", + "adress", + "telegram", + "wechat", + "viber", + "vk", + "skype", + "whatsup", + "messenger", + "text" +] + +//форма контактов +export function sendFC({ questionId, body, qid }: any) { + console.log("start fetch") + const formData = new FormData(); + + // const keysBody = Object.keys(body) + // const content:any = {} + // fields.forEach((key) => { + // if (keysBody.includes(key)) content[key] = body.key + // }) + + + const answers = [{ + question_id: questionId, + content: body, + result: true, + qid + }] + + formData.append("answers", JSON.stringify(answers)); + formData.append("qid", qid); + + return makeRequest({ + url: `https://squiz.pena.digital/answer/answer`, + body: formData, + method: "POST", + }); +} diff --git a/src/assets/AutoOpen.png b/src/assets/AutoOpen.png new file mode 100644 index 0000000..3ec8840 Binary files /dev/null and b/src/assets/AutoOpen.png differ diff --git a/src/assets/BannerImg.png b/src/assets/BannerImg.png new file mode 100644 index 0000000..0e38087 Binary files /dev/null and b/src/assets/BannerImg.png differ diff --git a/src/assets/Bunner.png b/src/assets/Bunner.png new file mode 100644 index 0000000..bd06b31 Binary files /dev/null and b/src/assets/Bunner.png differ diff --git a/src/assets/InBodySite.png b/src/assets/InBodySite.png new file mode 100644 index 0000000..83e66d5 Binary files /dev/null and b/src/assets/InBodySite.png differ diff --git a/src/assets/LDownButton.svg b/src/assets/LDownButton.svg new file mode 100644 index 0000000..a6fc36a --- /dev/null +++ b/src/assets/LDownButton.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/assets/LandingPict/Desktop.png b/src/assets/LandingPict/Desktop.png new file mode 100644 index 0000000..167d67b Binary files /dev/null and b/src/assets/LandingPict/Desktop.png differ diff --git a/src/assets/LandingPict/calendarIcon.tsx b/src/assets/LandingPict/calendarIcon.tsx new file mode 100644 index 0000000..8e94dc9 --- /dev/null +++ b/src/assets/LandingPict/calendarIcon.tsx @@ -0,0 +1,81 @@ +import { Box } from "@mui/material"; + +interface Props { + color?: string; +} + +export default function CalendarIcon({ color }: Props) { + return ( + + + + + + + + + + + + + + + + ); +} diff --git a/src/assets/LandingPict/notebook.tsx b/src/assets/LandingPict/notebook.tsx new file mode 100644 index 0000000..bc6caea --- /dev/null +++ b/src/assets/LandingPict/notebook.tsx @@ -0,0 +1,535 @@ +import { Box } from "@mui/material"; + +interface Props { + color?: string; +} + +export default function Notebook({ color }: Props) { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +} diff --git a/src/assets/LandingPict/titleIcon.tsx b/src/assets/LandingPict/titleIcon.tsx new file mode 100644 index 0000000..29039e9 --- /dev/null +++ b/src/assets/LandingPict/titleIcon.tsx @@ -0,0 +1,25 @@ +import { Box } from "@mui/material"; + + +interface Props { + color?: string; +} + +export default function TitleIcon({color}:Props) { + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/LandingPict/youtobeIcon.tsx b/src/assets/LandingPict/youtobeIcon.tsx new file mode 100644 index 0000000..cdc36ad --- /dev/null +++ b/src/assets/LandingPict/youtobeIcon.tsx @@ -0,0 +1,109 @@ +import { Box } from "@mui/material"; + +interface Props { + color?: string; + width?: string; +} + +export default function YoutobeIcon({ color, width }: Props) { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +} diff --git a/src/assets/OnButton.png b/src/assets/OnButton.png new file mode 100644 index 0000000..e44a91a Binary files /dev/null and b/src/assets/OnButton.png differ diff --git a/src/assets/Qr.png b/src/assets/Qr.png new file mode 100644 index 0000000..1ed96a3 Binary files /dev/null and b/src/assets/Qr.png differ diff --git a/src/assets/Quiz-main.png b/src/assets/Quiz-main.png new file mode 100644 index 0000000..815a696 Binary files /dev/null and b/src/assets/Quiz-main.png differ diff --git a/src/assets/RDownButton.svg b/src/assets/RDownButton.svg new file mode 100644 index 0000000..01933c1 --- /dev/null +++ b/src/assets/RDownButton.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/assets/Rectangle 110.png b/src/assets/Rectangle 110.png new file mode 100644 index 0000000..1bf27f8 Binary files /dev/null and b/src/assets/Rectangle 110.png differ diff --git a/src/assets/VidjetImg.png b/src/assets/VidjetImg.png new file mode 100644 index 0000000..b659fd5 Binary files /dev/null and b/src/assets/VidjetImg.png differ diff --git a/src/assets/Widget.png b/src/assets/Widget.png new file mode 100644 index 0000000..c3f3e26 Binary files /dev/null and b/src/assets/Widget.png differ diff --git a/src/assets/card-1.png b/src/assets/card-1.png new file mode 100755 index 0000000..462ddd8 Binary files /dev/null and b/src/assets/card-1.png differ diff --git a/src/assets/card-2.png b/src/assets/card-2.png new file mode 100755 index 0000000..f0652f6 Binary files /dev/null and b/src/assets/card-2.png differ diff --git a/src/assets/card-3.png b/src/assets/card-3.png new file mode 100755 index 0000000..cbba218 Binary files /dev/null and b/src/assets/card-3.png differ diff --git a/src/assets/dots.png b/src/assets/dots.png new file mode 100644 index 0000000..6d460d7 Binary files /dev/null and b/src/assets/dots.png differ diff --git a/src/assets/icons/AlignCenterIcon.tsx b/src/assets/icons/AlignCenterIcon.tsx new file mode 100644 index 0000000..bddd42c --- /dev/null +++ b/src/assets/icons/AlignCenterIcon.tsx @@ -0,0 +1,29 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function AlignCenterIcon({ color }: Props) { + + return ( + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/AlignLeftIcon.tsx b/src/assets/icons/AlignLeftIcon.tsx new file mode 100755 index 0000000..ee2a80c --- /dev/null +++ b/src/assets/icons/AlignLeftIcon.tsx @@ -0,0 +1,27 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function AlignLeftIcon({ color }: Props) { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/AlignRightIcon.tsx b/src/assets/icons/AlignRightIcon.tsx new file mode 100755 index 0000000..5a035db --- /dev/null +++ b/src/assets/icons/AlignRightIcon.tsx @@ -0,0 +1,27 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function AlignRightIcon({ color }: Props) { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ArrowCounterClockWise.svg b/src/assets/icons/ArrowCounterClockWise.svg new file mode 100644 index 0000000..ba2b9e6 --- /dev/null +++ b/src/assets/icons/ArrowCounterClockWise.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/assets/icons/ArrowDownIcon.tsx b/src/assets/icons/ArrowDownIcon.tsx new file mode 100755 index 0000000..0b92d66 --- /dev/null +++ b/src/assets/icons/ArrowDownIcon.tsx @@ -0,0 +1,24 @@ +import { Box, useTheme } from "@mui/material"; + + +export default function ArrowDownIcon(props: any) { + const theme = useTheme(); + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ArrowGear.svg b/src/assets/icons/ArrowGear.svg new file mode 100644 index 0000000..735328a --- /dev/null +++ b/src/assets/icons/ArrowGear.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/src/assets/icons/ArrowLeftSP.tsx b/src/assets/icons/ArrowLeftSP.tsx new file mode 100644 index 0000000..1ba692e --- /dev/null +++ b/src/assets/icons/ArrowLeftSP.tsx @@ -0,0 +1,27 @@ +import {Box, SxProps, Theme, useTheme} from "@mui/material"; + + +interface Props { + right: boolean +} + +export default function ArrowLeftSP({right} : Props) { + const theme = useTheme(); + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/BackArrowIcon.tsx b/src/assets/icons/BackArrowIcon.tsx new file mode 100755 index 0000000..cbfef39 --- /dev/null +++ b/src/assets/icons/BackArrowIcon.tsx @@ -0,0 +1,26 @@ +import { Box } from "@mui/material"; + +export default function BackArrowIcon({ color = "black" }: { color?: string }) { + return ( + + + + + + + ); +} diff --git a/src/assets/icons/BrowserIcon.tsx b/src/assets/icons/BrowserIcon.tsx new file mode 100644 index 0000000..418eec9 --- /dev/null +++ b/src/assets/icons/BrowserIcon.tsx @@ -0,0 +1,40 @@ +import { Box, useTheme } from "@mui/material"; + +export default function BrowserIcon() { + const theme = useTheme(); + + return ( + + + + + + + ); +} diff --git a/src/assets/icons/Burger.tsx b/src/assets/icons/Burger.tsx new file mode 100644 index 0000000..eb24798 --- /dev/null +++ b/src/assets/icons/Burger.tsx @@ -0,0 +1,9 @@ +import { FC, SVGProps } from "react"; + +export const Burger: FC> = (props) => ( + + + + + +); diff --git a/src/assets/icons/CalendarIcon.tsx b/src/assets/icons/CalendarIcon.tsx new file mode 100644 index 0000000..a3c9129 --- /dev/null +++ b/src/assets/icons/CalendarIcon.tsx @@ -0,0 +1,39 @@ +import { Box } from "@mui/material"; + +export default function CalendarIcon() { + return ( + + + + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/ChartIcon.tsx b/src/assets/icons/ChartIcon.tsx new file mode 100755 index 0000000..f8c2947 --- /dev/null +++ b/src/assets/icons/ChartIcon.tsx @@ -0,0 +1,22 @@ +import { Box, useTheme } from "@mui/material"; + + +export default function ChartIcon() { + const theme = useTheme(); + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ChartPieIcon.tsx b/src/assets/icons/ChartPieIcon.tsx new file mode 100755 index 0000000..6671f74 --- /dev/null +++ b/src/assets/icons/ChartPieIcon.tsx @@ -0,0 +1,40 @@ +import { Box } from "@mui/material"; + +interface Props { + height: string; + width: string; + color: string; +} + +export default function ChartPieIcon({ height, width, color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/Checkbox.tsx b/src/assets/icons/Checkbox.tsx new file mode 100644 index 0000000..265b62e --- /dev/null +++ b/src/assets/icons/Checkbox.tsx @@ -0,0 +1,43 @@ +import { Box, useTheme } from "@mui/material"; + +type CheckboxIconProps = { + checked?: boolean; +}; + +export const CheckboxIcon = ({ checked = false }: CheckboxIconProps) => { + const theme = useTheme(); + + return ( + + {checked && ( + + + + )} + + ); +}; diff --git a/src/assets/icons/CloseBold.tsx b/src/assets/icons/CloseBold.tsx new file mode 100644 index 0000000..84942f7 --- /dev/null +++ b/src/assets/icons/CloseBold.tsx @@ -0,0 +1,86 @@ +import { useTheme } from "@mui/material"; + +interface Props { + width?: number; +} + +export default function CloseBold({ width }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + + + + + + + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/CollapseMenuIcon.tsx b/src/assets/icons/CollapseMenuIcon.tsx new file mode 100755 index 0000000..d1dcad3 --- /dev/null +++ b/src/assets/icons/CollapseMenuIcon.tsx @@ -0,0 +1,31 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; + transform: string; +} + +export default function CollapseMenuIcon({ height, width, color, transform }: Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ContactBookIcon.tsx b/src/assets/icons/ContactBookIcon.tsx new file mode 100755 index 0000000..174d54e --- /dev/null +++ b/src/assets/icons/ContactBookIcon.tsx @@ -0,0 +1,34 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function ContactBookIcon({ height, width,color }: Props) { + + return ( + + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ContactFormIcon/AddressIcon.tsx b/src/assets/icons/ContactFormIcon/AddressIcon.tsx new file mode 100644 index 0000000..9918ee4 --- /dev/null +++ b/src/assets/icons/ContactFormIcon/AddressIcon.tsx @@ -0,0 +1,40 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function AddressIcon({ color }: Props) { + return ( + + + + + + + ); +} diff --git a/src/assets/icons/ContactFormIcon/EmailIcon.tsx b/src/assets/icons/ContactFormIcon/EmailIcon.tsx new file mode 100644 index 0000000..ad09e98 --- /dev/null +++ b/src/assets/icons/ContactFormIcon/EmailIcon.tsx @@ -0,0 +1,40 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function EmailIcon({ color }: Props) { + return ( + + + + + + + ); +} diff --git a/src/assets/icons/ContactFormIcon/NameIcon.tsx b/src/assets/icons/ContactFormIcon/NameIcon.tsx new file mode 100644 index 0000000..8fafed2 --- /dev/null +++ b/src/assets/icons/ContactFormIcon/NameIcon.tsx @@ -0,0 +1,45 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function NameIcon({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/ContactFormIcon/PhoneIcon.tsx b/src/assets/icons/ContactFormIcon/PhoneIcon.tsx new file mode 100644 index 0000000..33266a5 --- /dev/null +++ b/src/assets/icons/ContactFormIcon/PhoneIcon.tsx @@ -0,0 +1,34 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function PhoneIcon({ color }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/ContactFormIcon/TextIcon.tsx b/src/assets/icons/ContactFormIcon/TextIcon.tsx new file mode 100644 index 0000000..b272b37 --- /dev/null +++ b/src/assets/icons/ContactFormIcon/TextIcon.tsx @@ -0,0 +1,70 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function TextIcon({ color }: Props) { + return ( + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/ContactFormIcon/supplementIcon.tsx b/src/assets/icons/ContactFormIcon/supplementIcon.tsx new file mode 100644 index 0000000..8ffb437 --- /dev/null +++ b/src/assets/icons/ContactFormIcon/supplementIcon.tsx @@ -0,0 +1,34 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function SupplementIcon({ color }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/CopyIcon.tsx b/src/assets/icons/CopyIcon.tsx new file mode 100644 index 0000000..cf63279 --- /dev/null +++ b/src/assets/icons/CopyIcon.tsx @@ -0,0 +1,49 @@ +import { Box, useTheme } from "@mui/material"; + +interface Props { + color?: string; + bgcolor?: string; + marL?: string; +} + +export default function CopyIcon({ color, bgcolor, marL }: Props) { + const theme = useTheme(); + + return ( + + + + + + + ); +} diff --git a/src/assets/icons/CountIcon.tsx b/src/assets/icons/CountIcon.tsx new file mode 100644 index 0000000..ebbcbc8 --- /dev/null +++ b/src/assets/icons/CountIcon.tsx @@ -0,0 +1,11 @@ +export default function CountIcon() { + return ( + + + + + ); +} diff --git a/src/assets/icons/CropIcon.tsx b/src/assets/icons/CropIcon.tsx new file mode 100644 index 0000000..16b098a --- /dev/null +++ b/src/assets/icons/CropIcon.tsx @@ -0,0 +1,10 @@ +import { FC, SVGProps } from "react"; + +export const CropIcon: FC> = (props) => ( + + + + + + +); diff --git a/src/assets/icons/CrossedEyeIcon.tsx b/src/assets/icons/CrossedEyeIcon.tsx new file mode 100644 index 0000000..c9021ca --- /dev/null +++ b/src/assets/icons/CrossedEyeIcon.tsx @@ -0,0 +1,51 @@ +import { FC, SVGProps } from "react"; + +export const CrossedEyeIcon: FC> = (props) => { + return ( + + + + + + + + + ); +}; diff --git a/src/assets/icons/DomenIcon.tsx b/src/assets/icons/DomenIcon.tsx new file mode 100644 index 0000000..cf8512f --- /dev/null +++ b/src/assets/icons/DomenIcon.tsx @@ -0,0 +1,52 @@ +import { Box, useTheme } from "@mui/material"; + +interface Props { + color: string; + bgcolor: string; +} + +export default function DomenIcon({ color, bgcolor }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/EmojiIocns.tsx b/src/assets/icons/EmojiIocns.tsx new file mode 100644 index 0000000..ba654c6 --- /dev/null +++ b/src/assets/icons/EmojiIocns.tsx @@ -0,0 +1,28 @@ +import { FC, SVGProps } from "react"; + +export const EmojiIcons: FC> = (props) => ( + + + + + + +); diff --git a/src/assets/icons/ExpandIcon.tsx b/src/assets/icons/ExpandIcon.tsx new file mode 100755 index 0000000..30960d2 --- /dev/null +++ b/src/assets/icons/ExpandIcon.tsx @@ -0,0 +1,17 @@ +import { useTheme } from "@mui/material"; + + +interface Props { + isExpanded?: boolean; +} + +export default function ExpandIcon({ isExpanded }: Props) { + const theme = useTheme(); + + return ( + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ExpandLessIconBG.tsx b/src/assets/icons/ExpandLessIconBG.tsx new file mode 100644 index 0000000..c07f77a --- /dev/null +++ b/src/assets/icons/ExpandLessIconBG.tsx @@ -0,0 +1,37 @@ +import { useTheme, SxProps, Box } from "@mui/material"; + +interface Props { + sx?: SxProps; +} + +export default function ExpandIcon({ sx }: Props) { + const theme = useTheme(); + + return ( + + + + + + + ); +} diff --git a/src/assets/icons/EyeIcon.tsx b/src/assets/icons/EyeIcon.tsx new file mode 100755 index 0000000..e2d31ec --- /dev/null +++ b/src/assets/icons/EyeIcon.tsx @@ -0,0 +1,23 @@ +import { Box, useTheme } from "@mui/material"; + + +export default function EyeIcon() { + const theme = useTheme(); + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/FlowArrowIcon.tsx b/src/assets/icons/FlowArrowIcon.tsx new file mode 100755 index 0000000..20ddafc --- /dev/null +++ b/src/assets/icons/FlowArrowIcon.tsx @@ -0,0 +1,30 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function FlowArrowIcon({ height, width, color }: Props) { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/Frame 1171274368.svg b/src/assets/icons/Frame 1171274368.svg new file mode 100644 index 0000000..d0db607 --- /dev/null +++ b/src/assets/icons/Frame 1171274368.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/assets/icons/GearIcon.tsx b/src/assets/icons/GearIcon.tsx new file mode 100755 index 0000000..aa45141 --- /dev/null +++ b/src/assets/icons/GearIcon.tsx @@ -0,0 +1,29 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function GearIcon({ height, width, color }: Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/IconPlus.tsx b/src/assets/icons/IconPlus.tsx new file mode 100644 index 0000000..d4c3149 --- /dev/null +++ b/src/assets/icons/IconPlus.tsx @@ -0,0 +1,34 @@ +import { IconButton } from "@mui/material"; + +export default function IconPlus() { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/ImageAddIcons.tsx b/src/assets/icons/ImageAddIcons.tsx new file mode 100644 index 0000000..b166442 --- /dev/null +++ b/src/assets/icons/ImageAddIcons.tsx @@ -0,0 +1,24 @@ +import { FC, SVGProps } from "react"; + +export const ImageAddIcons: FC> = (props) => ( + + + + + +); diff --git a/src/assets/icons/Info.tsx b/src/assets/icons/Info.tsx new file mode 100644 index 0000000..d2ef527 --- /dev/null +++ b/src/assets/icons/Info.tsx @@ -0,0 +1,46 @@ +import { IconButton, SxProps } from "@mui/material"; + +type InfoProps = { + width?: number; + height?: number; + sx?: SxProps; + onClick?: any; + className?: string +}; + +export default function Info({ width = 20, height = 20, sx, onClick, className }: InfoProps) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/InfoIcon.tsx b/src/assets/icons/InfoIcon.tsx new file mode 100755 index 0000000..3324846 --- /dev/null +++ b/src/assets/icons/InfoIcon.tsx @@ -0,0 +1,45 @@ +import { Box, useTheme } from "@mui/material"; + +import type { SxProps } from "@mui/material"; + +type InfoIconProps = { + sx?: SxProps; +}; + +export default function InfoIcon({ sx }: InfoIconProps) { + const theme = useTheme(); + + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/InstallQuizIcon/LDownButton.tsx b/src/assets/icons/InstallQuizIcon/LDownButton.tsx new file mode 100644 index 0000000..a306f1d --- /dev/null +++ b/src/assets/icons/InstallQuizIcon/LDownButton.tsx @@ -0,0 +1,30 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function LDownButton({ color }: Props) { + + return ( + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/InstallQuizIcon/RDownButton.tsx b/src/assets/icons/InstallQuizIcon/RDownButton.tsx new file mode 100644 index 0000000..559b63b --- /dev/null +++ b/src/assets/icons/InstallQuizIcon/RDownButton.tsx @@ -0,0 +1,30 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function RDownButton({ color }: Props) { + + return ( + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LayoutCenteredIcon.tsx b/src/assets/icons/LayoutCenteredIcon.tsx new file mode 100755 index 0000000..2c587a3 --- /dev/null +++ b/src/assets/icons/LayoutCenteredIcon.tsx @@ -0,0 +1,26 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function LayoutCenteredIcon({ color }: Props) { + + return ( + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LayoutExpandedIcon.tsx b/src/assets/icons/LayoutExpandedIcon.tsx new file mode 100755 index 0000000..4178924 --- /dev/null +++ b/src/assets/icons/LayoutExpandedIcon.tsx @@ -0,0 +1,26 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function LayoutExpandedIcon({ color }: Props) { + + return ( + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LayoutIcon.tsx b/src/assets/icons/LayoutIcon.tsx new file mode 100755 index 0000000..fde94cc --- /dev/null +++ b/src/assets/icons/LayoutIcon.tsx @@ -0,0 +1,33 @@ +import { Box, useTheme } from "@mui/material"; + + +interface Props { + bgcolor?: string; + height: string; + width: string; + color: string; +} + +export default function LayoutIconOld({ bgcolor, height, width, color }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LayoutIconBig.tsx b/src/assets/icons/LayoutIconBig.tsx new file mode 100755 index 0000000..5326f29 --- /dev/null +++ b/src/assets/icons/LayoutIconBig.tsx @@ -0,0 +1,33 @@ +import { Box, useTheme } from "@mui/material"; + + +interface Props { + bgcolor?: string; + height: string; + width: string; + color: string; +} + +export default function LayoutIconBig({ bgcolor, height, width, color }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LayoutStandartIcon.tsx b/src/assets/icons/LayoutStandartIcon.tsx new file mode 100755 index 0000000..feaaf90 --- /dev/null +++ b/src/assets/icons/LayoutStandartIcon.tsx @@ -0,0 +1,27 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function LayoutStandartIcon({ color }: Props) { + + return ( + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LinkIcon.tsx b/src/assets/icons/LinkIcon.tsx new file mode 100755 index 0000000..303779f --- /dev/null +++ b/src/assets/icons/LinkIcon.tsx @@ -0,0 +1,31 @@ +import { Box, useTheme } from "@mui/material"; + + +interface Props { + color: string; + bgcolor: string; +} + +export default function LinkIcon({ color, bgcolor }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/LogoutIcon.tsx b/src/assets/icons/LogoutIcon.tsx new file mode 100755 index 0000000..38ea313 --- /dev/null +++ b/src/assets/icons/LogoutIcon.tsx @@ -0,0 +1,14 @@ +import { useTheme } from "@mui/material"; + + +export default function LogoutIcon() { + const theme = useTheme(); + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/MegaphoneIcon.tsx b/src/assets/icons/MegaphoneIcon.tsx new file mode 100755 index 0000000..5e28a03 --- /dev/null +++ b/src/assets/icons/MegaphoneIcon.tsx @@ -0,0 +1,29 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function MegaphoneIcon({ height, width, color }: Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/MenuIcon.tsx b/src/assets/icons/MenuIcon.tsx new file mode 100644 index 0000000..64567cd --- /dev/null +++ b/src/assets/icons/MenuIcon.tsx @@ -0,0 +1,31 @@ +export default function MenuIcon() { + return ( + + + + + + + + + + ); +} diff --git a/src/assets/icons/MobilePhoneIcon.tsx b/src/assets/icons/MobilePhoneIcon.tsx new file mode 100755 index 0000000..ea56829 --- /dev/null +++ b/src/assets/icons/MobilePhoneIcon.tsx @@ -0,0 +1,30 @@ +import { Box, useTheme } from "@mui/material"; + + +interface Props { + bgcolor: string; +} + +export default function MobilePhoneIcon({ bgcolor }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/NumberThree.tsx b/src/assets/icons/NumberThree.tsx new file mode 100644 index 0000000..d363e8b --- /dev/null +++ b/src/assets/icons/NumberThree.tsx @@ -0,0 +1,26 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function NumberThree({color}:Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/NumberTwo.tsx b/src/assets/icons/NumberTwo.tsx new file mode 100644 index 0000000..cfd7d8d --- /dev/null +++ b/src/assets/icons/NumberTwo.tsx @@ -0,0 +1,26 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function NumberTwo({color}:Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/OneIconBorder.tsx b/src/assets/icons/OneIconBorder.tsx new file mode 100644 index 0000000..5f51bd2 --- /dev/null +++ b/src/assets/icons/OneIconBorder.tsx @@ -0,0 +1,26 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; +} + +export default function OneIconBorder({color}:Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/PenaLogoIcon.tsx b/src/assets/icons/PenaLogoIcon.tsx new file mode 100644 index 0000000..a52a052 --- /dev/null +++ b/src/assets/icons/PenaLogoIcon.tsx @@ -0,0 +1,67 @@ +import { FC, SVGProps } from "react"; + +export const PenaLogoIcon: FC> = (props) => ( + + + + + + + + + + + + + + + + + + + +); diff --git a/src/assets/icons/PencilCircleIcon.tsx b/src/assets/icons/PencilCircleIcon.tsx new file mode 100755 index 0000000..915211e --- /dev/null +++ b/src/assets/icons/PencilCircleIcon.tsx @@ -0,0 +1,32 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function PencilCircleIcon({ height, width, color }: Props) { + + return ( + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/PencilIcon.tsx b/src/assets/icons/PencilIcon.tsx new file mode 100755 index 0000000..4ec391a --- /dev/null +++ b/src/assets/icons/PencilIcon.tsx @@ -0,0 +1,23 @@ +import { Box, useTheme } from "@mui/material"; + + +export default function PencilIcon() { + const theme = useTheme(); + + return ( + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/Plus.tsx b/src/assets/icons/Plus.tsx new file mode 100644 index 0000000..f0238f1 --- /dev/null +++ b/src/assets/icons/Plus.tsx @@ -0,0 +1,19 @@ +import { IconButton } from "@mui/material"; + +export default function Plus() { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/PuzzlePieceIcon.tsx b/src/assets/icons/PuzzlePieceIcon.tsx new file mode 100755 index 0000000..137d6e8 --- /dev/null +++ b/src/assets/icons/PuzzlePieceIcon.tsx @@ -0,0 +1,28 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function PuzzlePieceIcon({ height, width, color }: Props) { + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/QuestionIcon.tsx b/src/assets/icons/QuestionIcon.tsx new file mode 100755 index 0000000..44aa33a --- /dev/null +++ b/src/assets/icons/QuestionIcon.tsx @@ -0,0 +1,30 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function QuestionIcon({ height, width ,color}: Props) { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/QuestionsMapIcon.tsx b/src/assets/icons/QuestionsMapIcon.tsx new file mode 100644 index 0000000..2bbe9b8 --- /dev/null +++ b/src/assets/icons/QuestionsMapIcon.tsx @@ -0,0 +1,63 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function QuestionsMapIcon({ color = "#7E2AEA" }: Props) { + return ( + + + + + + + + + + ); +} diff --git a/src/assets/icons/ResetIcon.tsx b/src/assets/icons/ResetIcon.tsx new file mode 100644 index 0000000..49d2ce1 --- /dev/null +++ b/src/assets/icons/ResetIcon.tsx @@ -0,0 +1,33 @@ +import { CSSProperties, FC } from "react"; + +interface Iporps { + style?: CSSProperties; + onClick?: () => void; +} + +export const ResetIcon: FC = ({ style, onClick }) => ( + + + + +); diff --git a/src/assets/icons/ResizeIcon.tsx b/src/assets/icons/ResizeIcon.tsx new file mode 100644 index 0000000..daeb81c --- /dev/null +++ b/src/assets/icons/ResizeIcon.tsx @@ -0,0 +1,35 @@ +import { Box, SxProps, Theme } from "@mui/material"; + +interface Props { + sx?: SxProps; +} + +export default function ResizeIcon({ sx }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/SearchIcon.tsx b/src/assets/icons/SearchIcon.tsx new file mode 100755 index 0000000..7d0a933 --- /dev/null +++ b/src/assets/icons/SearchIcon.tsx @@ -0,0 +1,22 @@ +import { Box } from "@mui/material"; + + +export default function SearchIcon() { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/SendIcon.tsx b/src/assets/icons/SendIcon.tsx new file mode 100755 index 0000000..6dc4705 --- /dev/null +++ b/src/assets/icons/SendIcon.tsx @@ -0,0 +1,12 @@ + + +export default function SendIcon() { + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/ShareNetwork.svg b/src/assets/icons/ShareNetwork.svg new file mode 100644 index 0000000..d19f6ba --- /dev/null +++ b/src/assets/icons/ShareNetwork.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/assets/icons/TagIcon.tsx b/src/assets/icons/TagIcon.tsx new file mode 100755 index 0000000..5810ce0 --- /dev/null +++ b/src/assets/icons/TagIcon.tsx @@ -0,0 +1,29 @@ +import { Box } from "@mui/material"; + + +interface Props { + height: string; + width: string; + color: string; +} + +export default function TagIcon({ height, width, color }: Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/TrashIcon.tsx b/src/assets/icons/TrashIcon.tsx new file mode 100644 index 0000000..1e1ec02 --- /dev/null +++ b/src/assets/icons/TrashIcon.tsx @@ -0,0 +1,48 @@ +export default function TrashIcon() { + return ( + + + + + + + + + ); +} diff --git a/src/assets/icons/Unsplash.svg b/src/assets/icons/Unsplash.svg new file mode 100644 index 0000000..d7f14de --- /dev/null +++ b/src/assets/icons/Unsplash.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/icons/UploadIcon.tsx b/src/assets/icons/UploadIcon.tsx new file mode 100755 index 0000000..46c386c --- /dev/null +++ b/src/assets/icons/UploadIcon.tsx @@ -0,0 +1,24 @@ +import { Box, useTheme } from "@mui/material"; + + +export default function UploadIcon() { + const theme = useTheme(); + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/VkIcon.tsx b/src/assets/icons/VkIcon.tsx new file mode 100644 index 0000000..c6fdebc --- /dev/null +++ b/src/assets/icons/VkIcon.tsx @@ -0,0 +1,39 @@ +import { Box, useTheme } from "@mui/material"; + +interface Props { + color: string; + bgcolor: string; +} + +export default function VkIcon({ color, bgcolor }: Props) { + const theme = useTheme(); + + return ( + + + + + + ); +} diff --git a/src/assets/icons/VkIconButton.tsx b/src/assets/icons/VkIconButton.tsx new file mode 100644 index 0000000..7384ce2 --- /dev/null +++ b/src/assets/icons/VkIconButton.tsx @@ -0,0 +1,25 @@ +import { Box, useTheme } from "@mui/material"; + + +interface Props { + color?: string; +} + +export default function VkIconButton({ color }: Props) { + const theme = useTheme(); + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/WalletIcon.tsx b/src/assets/icons/WalletIcon.tsx new file mode 100755 index 0000000..3265109 --- /dev/null +++ b/src/assets/icons/WalletIcon.tsx @@ -0,0 +1,32 @@ +import { Box } from "@mui/material"; + + +interface Props { + color: string; + bgcolor: string; +} + +export default function WalletIcon({ color, bgcolor }: Props) { + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/checked.svg b/src/assets/icons/checked.svg new file mode 100644 index 0000000..17e59b0 --- /dev/null +++ b/src/assets/icons/checked.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/assets/icons/listChecks.svg b/src/assets/icons/listChecks.svg new file mode 100644 index 0000000..506f040 --- /dev/null +++ b/src/assets/icons/listChecks.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/icons/messagIcon.tsx b/src/assets/icons/messagIcon.tsx new file mode 100644 index 0000000..b0af074 --- /dev/null +++ b/src/assets/icons/messagIcon.tsx @@ -0,0 +1,15 @@ +import { FC, SVGProps } from "react"; + +export const MessageIcon: FC> = (props) => ( + + + + + +); diff --git a/src/assets/icons/plus.svg b/src/assets/icons/plus.svg new file mode 100644 index 0000000..cd416b7 --- /dev/null +++ b/src/assets/icons/plus.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/assets/icons/qrIcon.tsx b/src/assets/icons/qrIcon.tsx new file mode 100644 index 0000000..a187f2d --- /dev/null +++ b/src/assets/icons/qrIcon.tsx @@ -0,0 +1,75 @@ +import { Box, useTheme } from "@mui/material"; + +export default function QRIcon() { + const theme = useTheme(); + + return ( + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/ArrowDownIcon.tsx b/src/assets/icons/questionsPage/ArrowDownIcon.tsx new file mode 100644 index 0000000..861571e --- /dev/null +++ b/src/assets/icons/questionsPage/ArrowDownIcon.tsx @@ -0,0 +1,13 @@ +import { FC, SVGProps } from "react"; + +export const ArrowDownIcon: FC> = (props) => ( + + + +); diff --git a/src/assets/icons/questionsPage/CopyIcon.tsx b/src/assets/icons/questionsPage/CopyIcon.tsx new file mode 100755 index 0000000..4f4a691 --- /dev/null +++ b/src/assets/icons/questionsPage/CopyIcon.tsx @@ -0,0 +1,20 @@ +import { FC, SVGProps } from "react"; + +export const CopyIcon: FC> = (props) => ( + + + + +); diff --git a/src/assets/icons/questionsPage/DoubleArrowRight.tsx b/src/assets/icons/questionsPage/DoubleArrowRight.tsx new file mode 100644 index 0000000..a7b7306 --- /dev/null +++ b/src/assets/icons/questionsPage/DoubleArrowRight.tsx @@ -0,0 +1,20 @@ +import { FC, SVGProps } from "react"; + +export const DoubleArrowRight: FC> = (props) => ( + + + + +); diff --git a/src/assets/icons/questionsPage/DoubleTick.tsx b/src/assets/icons/questionsPage/DoubleTick.tsx new file mode 100644 index 0000000..cac66c3 --- /dev/null +++ b/src/assets/icons/questionsPage/DoubleTick.tsx @@ -0,0 +1,13 @@ +import { FC, SVGProps } from "react"; + +export const DoubleTick: FC> = (props) => ( + + + +); diff --git a/src/assets/icons/questionsPage/FlagIcon.tsx b/src/assets/icons/questionsPage/FlagIcon.tsx new file mode 100644 index 0000000..b758566 --- /dev/null +++ b/src/assets/icons/questionsPage/FlagIcon.tsx @@ -0,0 +1,46 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function FlagIcon({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/FormatIcon1.tsx b/src/assets/icons/questionsPage/FormatIcon1.tsx new file mode 100644 index 0000000..9eaf396 --- /dev/null +++ b/src/assets/icons/questionsPage/FormatIcon1.tsx @@ -0,0 +1,78 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function FormatIcon1({ color }: Props) { + return ( + + + + + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/FormatIcon2.tsx b/src/assets/icons/questionsPage/FormatIcon2.tsx new file mode 100644 index 0000000..5ea18a1 --- /dev/null +++ b/src/assets/icons/questionsPage/FormatIcon2.tsx @@ -0,0 +1,70 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function FormatIcon2({ color }: Props) { + return ( + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/OneIcon.tsx b/src/assets/icons/questionsPage/OneIcon.tsx new file mode 100755 index 0000000..64853a8 --- /dev/null +++ b/src/assets/icons/questionsPage/OneIcon.tsx @@ -0,0 +1,18 @@ +import { Box } from "@mui/material"; +import { FC, SVGProps } from "react"; + +export const OneIcon: FC> = (props) => ( + + + + +); diff --git a/src/assets/icons/questionsPage/PointsIcon.tsx b/src/assets/icons/questionsPage/PointsIcon.tsx new file mode 100755 index 0000000..a4dcb4d --- /dev/null +++ b/src/assets/icons/questionsPage/PointsIcon.tsx @@ -0,0 +1,31 @@ +import { Box } from "@mui/material"; +import { FC, SVGProps } from "react"; + +export const PointsIcon: FC> = (props) => ( + + + + + + + + +); diff --git a/src/assets/icons/questionsPage/ProportionsIcon11.tsx b/src/assets/icons/questionsPage/ProportionsIcon11.tsx new file mode 100644 index 0000000..f4dbb5a --- /dev/null +++ b/src/assets/icons/questionsPage/ProportionsIcon11.tsx @@ -0,0 +1,44 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function ProportionsIcon11({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/ProportionsIcon12.tsx b/src/assets/icons/questionsPage/ProportionsIcon12.tsx new file mode 100644 index 0000000..694210f --- /dev/null +++ b/src/assets/icons/questionsPage/ProportionsIcon12.tsx @@ -0,0 +1,45 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function ProportionsIcon12({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/ProportionsIcon21.tsx b/src/assets/icons/questionsPage/ProportionsIcon21.tsx new file mode 100644 index 0000000..7e15d3c --- /dev/null +++ b/src/assets/icons/questionsPage/ProportionsIcon21.tsx @@ -0,0 +1,44 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function ProportionsIcon21({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/StarIconMini.tsx b/src/assets/icons/questionsPage/StarIconMini.tsx new file mode 100644 index 0000000..19cde6c --- /dev/null +++ b/src/assets/icons/questionsPage/StarIconMini.tsx @@ -0,0 +1,35 @@ +import { Box } from "@mui/material"; + +import type { SxProps } from "@mui/material"; + +interface Props { + color: string; + width?: number; + sx?: SxProps; +} + +export default function StarIconMini({ color, width = 30, sx }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/VectorQuestions.tsx b/src/assets/icons/questionsPage/VectorQuestions.tsx new file mode 100644 index 0000000..98a2849 --- /dev/null +++ b/src/assets/icons/questionsPage/VectorQuestions.tsx @@ -0,0 +1,20 @@ +import { FC, SVGProps } from "react"; + +export const VectorQuestions: FC> = (props) => ( + + + + +); diff --git a/src/assets/icons/questionsPage/VideofileIcon.tsx b/src/assets/icons/questionsPage/VideofileIcon.tsx new file mode 100644 index 0000000..fb4a329 --- /dev/null +++ b/src/assets/icons/questionsPage/VideofileIcon.tsx @@ -0,0 +1,14 @@ +import { FC, SVGProps } from "react"; + +export const VideofileIcon: FC> = (props) => ( + + + + +); diff --git a/src/assets/icons/questionsPage/addAnswer.tsx b/src/assets/icons/questionsPage/addAnswer.tsx new file mode 100644 index 0000000..3bb950d --- /dev/null +++ b/src/assets/icons/questionsPage/addAnswer.tsx @@ -0,0 +1,34 @@ +import { Box, SxProps, Theme } from "@mui/material"; + +interface Props { + color: string; + sx?: SxProps; +} +export default function AddAnswer({ color, sx }: Props) { + return ( + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/addEmoji.tsx b/src/assets/icons/questionsPage/addEmoji.tsx new file mode 100644 index 0000000..4d88f66 --- /dev/null +++ b/src/assets/icons/questionsPage/addEmoji.tsx @@ -0,0 +1,62 @@ +import { Box } from "@mui/material"; + +// interface Props { +// color: string; +// } + +export default function AddEmoji() { + return ( + + + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/addImage.tsx b/src/assets/icons/questionsPage/addImage.tsx new file mode 100644 index 0000000..3842072 --- /dev/null +++ b/src/assets/icons/questionsPage/addImage.tsx @@ -0,0 +1,56 @@ +import { Box, SxProps } from "@mui/material"; +import { FC } from "react"; + +interface Iprops { + onClick?: () => void; + sx?: SxProps; +} + +const AddImage: FC = ({ onClick, sx }) => { + return ( + + + + + + + + + + + ); +}; + +export default AddImage; diff --git a/src/assets/icons/questionsPage/addPlus.tsx b/src/assets/icons/questionsPage/addPlus.tsx new file mode 100755 index 0000000..3477eda --- /dev/null +++ b/src/assets/icons/questionsPage/addPlus.tsx @@ -0,0 +1,27 @@ +import { Box } from "@mui/material"; + + +// interface Props { +// color: string; +// } + +export default function AddPlus() { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/addPlusImage.tsx b/src/assets/icons/questionsPage/addPlusImage.tsx new file mode 100644 index 0000000..3d77bf4 --- /dev/null +++ b/src/assets/icons/questionsPage/addPlusImage.tsx @@ -0,0 +1,30 @@ +import { FC } from "react"; + +export const AddPlusImage: FC = () => ( + + + + + + + + +); diff --git a/src/assets/icons/questionsPage/addPlusVideo.tsx b/src/assets/icons/questionsPage/addPlusVideo.tsx new file mode 100644 index 0000000..24428cb --- /dev/null +++ b/src/assets/icons/questionsPage/addPlusVideo.tsx @@ -0,0 +1,20 @@ +import { FC } from "react"; + +export const AddPlusVideo: FC = () => ( + + + + + + + +); diff --git a/src/assets/icons/questionsPage/addVideofile.tsx b/src/assets/icons/questionsPage/addVideofile.tsx new file mode 100644 index 0000000..2f9a1e6 --- /dev/null +++ b/src/assets/icons/questionsPage/addVideofile.tsx @@ -0,0 +1,54 @@ +import { Box } from "@mui/material"; + +// interface Props { +// color: string; +// } + +export default function AddVideofile() { + return ( + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/answer.tsx b/src/assets/icons/questionsPage/answer.tsx new file mode 100755 index 0000000..df857f6 --- /dev/null +++ b/src/assets/icons/questionsPage/answer.tsx @@ -0,0 +1,54 @@ +import { Box, SxProps, Theme } from "@mui/material"; + +interface Props { + color: string; + sx?: SxProps; +} + +export default function Answer({ color, sx }: Props) { + return ( + + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/answerGroup.tsx b/src/assets/icons/questionsPage/answerGroup.tsx new file mode 100644 index 0000000..d23247b --- /dev/null +++ b/src/assets/icons/questionsPage/answerGroup.tsx @@ -0,0 +1,43 @@ +import { Box, SxProps, Theme } from "@mui/material"; + +interface Props { + color: string; + sx?: SxProps; +} +export default function AnswerGroup({ color, sx }: Props) { + return ( + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/arrowLeft.tsx b/src/assets/icons/questionsPage/arrowLeft.tsx new file mode 100755 index 0000000..7e4a448 --- /dev/null +++ b/src/assets/icons/questionsPage/arrowLeft.tsx @@ -0,0 +1,25 @@ +import { Box } from "@mui/material"; + + +// interface Props { +// color: string; +// } + +export default function ArrowLeft() { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/branching.tsx b/src/assets/icons/questionsPage/branching.tsx new file mode 100755 index 0000000..962bb99 --- /dev/null +++ b/src/assets/icons/questionsPage/branching.tsx @@ -0,0 +1,58 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function Branching({ color }: Props) { + return ( + + + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/clue.tsx b/src/assets/icons/questionsPage/clue.tsx new file mode 100755 index 0000000..67e288e --- /dev/null +++ b/src/assets/icons/questionsPage/clue.tsx @@ -0,0 +1,46 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function Clue({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/date.tsx b/src/assets/icons/questionsPage/date.tsx new file mode 100755 index 0000000..33f51b6 --- /dev/null +++ b/src/assets/icons/questionsPage/date.tsx @@ -0,0 +1,40 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function Date({color, sx}: Props) { + + return ( + + + + + + + + + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/deleteIcon.tsx b/src/assets/icons/questionsPage/deleteIcon.tsx new file mode 100755 index 0000000..8ebd1d6 --- /dev/null +++ b/src/assets/icons/questionsPage/deleteIcon.tsx @@ -0,0 +1,24 @@ +import { Box } from "@mui/material"; +import { FC, SVGProps } from "react"; + +export const DeleteIcon: FC> = (props) => ( + + + + + + + +); diff --git a/src/assets/icons/questionsPage/download.tsx b/src/assets/icons/questionsPage/download.tsx new file mode 100755 index 0000000..3af8f80 --- /dev/null +++ b/src/assets/icons/questionsPage/download.tsx @@ -0,0 +1,31 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function Download({color, sx}: Props) { + + return ( + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/drop_down.tsx b/src/assets/icons/questionsPage/drop_down.tsx new file mode 100755 index 0000000..ff4b0ee --- /dev/null +++ b/src/assets/icons/questionsPage/drop_down.tsx @@ -0,0 +1,34 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function DropDown({color, sx}: Props) { + + return ( + + + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/emoji.tsx b/src/assets/icons/questionsPage/emoji.tsx new file mode 100755 index 0000000..497d464 --- /dev/null +++ b/src/assets/icons/questionsPage/emoji.tsx @@ -0,0 +1,30 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function Emoji({color, sx}: Props) { + + return ( + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/enterIcon.tsx b/src/assets/icons/questionsPage/enterIcon.tsx new file mode 100755 index 0000000..b76eb3f --- /dev/null +++ b/src/assets/icons/questionsPage/enterIcon.tsx @@ -0,0 +1,27 @@ +import { FC, SVGProps } from "react"; + +export const EnterIcon: FC> = (props) => ( + + + + + +); diff --git a/src/assets/icons/questionsPage/hashtagIcon.tsx b/src/assets/icons/questionsPage/hashtagIcon.tsx new file mode 100644 index 0000000..bdae05a --- /dev/null +++ b/src/assets/icons/questionsPage/hashtagIcon.tsx @@ -0,0 +1,35 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function HashtagIcon({ color }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/heartIcon.tsx b/src/assets/icons/questionsPage/heartIcon.tsx new file mode 100644 index 0000000..4674358 --- /dev/null +++ b/src/assets/icons/questionsPage/heartIcon.tsx @@ -0,0 +1,36 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function HeartIcon({ color }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/hideIcon.tsx b/src/assets/icons/questionsPage/hideIcon.tsx new file mode 100755 index 0000000..692066e --- /dev/null +++ b/src/assets/icons/questionsPage/hideIcon.tsx @@ -0,0 +1,27 @@ +import { FC, SVGProps } from "react"; + +export const HideIcon: FC> = (props) => ( + + + + + +); diff --git a/src/assets/icons/questionsPage/image.tsx b/src/assets/icons/questionsPage/image.tsx new file mode 100644 index 0000000..536b943 --- /dev/null +++ b/src/assets/icons/questionsPage/image.tsx @@ -0,0 +1,53 @@ +import { Box, SxProps } from "@mui/material"; +import { FC } from "react"; + +interface Iprops { + onClick?: () => void; + sx?: SxProps; +} + +const Image: FC = ({ onClick, sx }) => { + return ( + + + + + + + + ); +}; + +export default Image; diff --git a/src/assets/icons/questionsPage/imgIcon.tsx b/src/assets/icons/questionsPage/imgIcon.tsx new file mode 100755 index 0000000..4f30a74 --- /dev/null +++ b/src/assets/icons/questionsPage/imgIcon.tsx @@ -0,0 +1,44 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function ImgIcon({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/input.tsx b/src/assets/icons/questionsPage/input.tsx new file mode 100755 index 0000000..1188c5c --- /dev/null +++ b/src/assets/icons/questionsPage/input.tsx @@ -0,0 +1,28 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} +export default function Input({color, sx}: Props) { + + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/lightbulbIcon.tsx b/src/assets/icons/questionsPage/lightbulbIcon.tsx new file mode 100644 index 0000000..04d389b --- /dev/null +++ b/src/assets/icons/questionsPage/lightbulbIcon.tsx @@ -0,0 +1,48 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function LightbulbIcon({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/likeIcon.tsx b/src/assets/icons/questionsPage/likeIcon.tsx new file mode 100644 index 0000000..78f7b30 --- /dev/null +++ b/src/assets/icons/questionsPage/likeIcon.tsx @@ -0,0 +1,46 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function LikeIcon({ color }: Props) { + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/options_and_pict.tsx b/src/assets/icons/questionsPage/options_and_pict.tsx new file mode 100755 index 0000000..acdde9d --- /dev/null +++ b/src/assets/icons/questionsPage/options_and_pict.tsx @@ -0,0 +1,34 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function optionsAndPict({color, sx}: Props) { + + return ( + + + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/options_pict.tsx b/src/assets/icons/questionsPage/options_pict.tsx new file mode 100755 index 0000000..6e11813 --- /dev/null +++ b/src/assets/icons/questionsPage/options_pict.tsx @@ -0,0 +1,30 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function optionsPict({color, sx}: Props) { + + return ( + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/page.tsx b/src/assets/icons/questionsPage/page.tsx new file mode 100755 index 0000000..09a9b03 --- /dev/null +++ b/src/assets/icons/questionsPage/page.tsx @@ -0,0 +1,33 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function Page({color, sx}: Props) { + + return ( + + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/plus.tsx b/src/assets/icons/questionsPage/plus.tsx new file mode 100644 index 0000000..98b7fa8 --- /dev/null +++ b/src/assets/icons/questionsPage/plus.tsx @@ -0,0 +1,32 @@ +import { Box } from "@mui/material"; + +export default function Plus() { + return ( + + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/rating.tsx b/src/assets/icons/questionsPage/rating.tsx new file mode 100755 index 0000000..43c6d5f --- /dev/null +++ b/src/assets/icons/questionsPage/rating.tsx @@ -0,0 +1,26 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} +export default function Rating({color, sx}: Props) { + + return ( + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/settingIcon.tsx b/src/assets/icons/questionsPage/settingIcon.tsx new file mode 100755 index 0000000..19bbeb5 --- /dev/null +++ b/src/assets/icons/questionsPage/settingIcon.tsx @@ -0,0 +1,34 @@ +import { Box } from "@mui/material"; + +interface Props { + color?: string; +} + +export default function SettingIcon({ color }: Props) { + return ( + + + + + + ); +} diff --git a/src/assets/icons/questionsPage/slider.tsx b/src/assets/icons/questionsPage/slider.tsx new file mode 100755 index 0000000..4dbaa9b --- /dev/null +++ b/src/assets/icons/questionsPage/slider.tsx @@ -0,0 +1,28 @@ +import {Box, SxProps, Theme} from "@mui/material"; + + +interface Props { + color: string; + sx?: SxProps +} + +export default function Slider({color, sx}: Props) { + + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/questionsPage/tropfyIcon.tsx b/src/assets/icons/questionsPage/tropfyIcon.tsx new file mode 100644 index 0000000..8f0ae03 --- /dev/null +++ b/src/assets/icons/questionsPage/tropfyIcon.tsx @@ -0,0 +1,64 @@ +import { Box } from "@mui/material"; + +interface Props { + color: string; +} + +export default function TropfyIcon({ color }: Props) { + return ( + + + + + + + + + + ); +} diff --git a/src/assets/icons/telegramIcon.tsx b/src/assets/icons/telegramIcon.tsx new file mode 100644 index 0000000..8e95f7a --- /dev/null +++ b/src/assets/icons/telegramIcon.tsx @@ -0,0 +1,47 @@ +import { Box, useTheme } from "@mui/material"; + +export default function TelegramIcon() { + const theme = useTheme(); + + return ( + + + + + + + + ); +} diff --git a/src/assets/icons/tiktokIcon.tsx b/src/assets/icons/tiktokIcon.tsx new file mode 100644 index 0000000..12692e6 --- /dev/null +++ b/src/assets/icons/tiktokIcon.tsx @@ -0,0 +1,33 @@ +import { Box, useTheme } from "@mui/material"; + +export default function TiktokIcon() { + const theme = useTheme(); + + return ( + + + + + + ); +} diff --git a/src/assets/icons/trash.tsx b/src/assets/icons/trash.tsx new file mode 100644 index 0000000..90f5a0b --- /dev/null +++ b/src/assets/icons/trash.tsx @@ -0,0 +1,64 @@ +import { useTheme, SxProps, Box } from "@mui/material"; + +interface Props { + sx?: SxProps; +} + +export default function Trash({ sx }: Props) { + const theme = useTheme(); + + return ( + + + + + + + + + + ); +} diff --git a/src/assets/icons/x.tsx b/src/assets/icons/x.tsx new file mode 100644 index 0000000..535f7c1 --- /dev/null +++ b/src/assets/icons/x.tsx @@ -0,0 +1,15 @@ +import { useTheme } from "@mui/material"; + + +interface Props { + width?: number; +} + +export default function PenaLogo({ width }: Props) { + const theme = useTheme(); + + return ( + + + + )} diff --git a/src/assets/quiz-creation-1.png b/src/assets/quiz-creation-1.png new file mode 100755 index 0000000..2ce7c88 Binary files /dev/null and b/src/assets/quiz-creation-1.png differ diff --git a/src/assets/quiz-creation-2.png b/src/assets/quiz-creation-2.png new file mode 100755 index 0000000..c7ecd32 Binary files /dev/null and b/src/assets/quiz-creation-2.png differ diff --git a/src/assets/quiz-template-1.png b/src/assets/quiz-template-1.png new file mode 100755 index 0000000..0703b74 Binary files /dev/null and b/src/assets/quiz-template-1.png differ diff --git a/src/assets/quiz-template-2.png b/src/assets/quiz-template-2.png new file mode 100755 index 0000000..f92c8c6 Binary files /dev/null and b/src/assets/quiz-template-2.png differ diff --git a/src/assets/quiz-template-3.png b/src/assets/quiz-template-3.png new file mode 100755 index 0000000..8bb8e8c Binary files /dev/null and b/src/assets/quiz-template-3.png differ diff --git a/src/assets/quiz-template-4.png b/src/assets/quiz-template-4.png new file mode 100755 index 0000000..11ecf89 Binary files /dev/null and b/src/assets/quiz-template-4.png differ diff --git a/src/assets/quiz-template-5.png b/src/assets/quiz-template-5.png new file mode 100755 index 0000000..4cbde4e Binary files /dev/null and b/src/assets/quiz-template-5.png differ diff --git a/src/assets/quiz-template-6.png b/src/assets/quiz-template-6.png new file mode 100755 index 0000000..0308e86 Binary files /dev/null and b/src/assets/quiz-template-6.png differ diff --git a/src/declare.d.ts b/src/declare.d.ts new file mode 100644 index 0000000..4997750 --- /dev/null +++ b/src/declare.d.ts @@ -0,0 +1 @@ +declare module "*.png"; diff --git a/src/index.css b/src/index.css new file mode 100755 index 0000000..6f14e2b --- /dev/null +++ b/src/index.css @@ -0,0 +1,29 @@ +body { + margin: 0; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', + 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', + sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +code { + font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', + monospace; +} + +@keyframes blinking { + 0% { + opacity: 100; + } + 50% { + opacity: 0; + } + 100% { + opacity: 100; + } +} + +.blink { + animation: blinking 2s infinite ; +} \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx new file mode 100755 index 0000000..20b0030 --- /dev/null +++ b/src/index.tsx @@ -0,0 +1,43 @@ +import { CssBaseline, ThemeProvider } from "@mui/material"; +import { LocalizationProvider } from "@mui/x-date-pickers"; +import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; +import { ruRU } from '@mui/x-date-pickers/locales'; +import App from "./App"; +import dayjs from "dayjs"; +import "dayjs/locale/ru"; +import { SnackbarProvider } from 'notistack'; +import { createRoot } from "react-dom/client"; +import "./index.css"; +import lightTheme from "./utils/themes/light"; +import { SWRConfig } from "swr"; +import {BrowserRouter} from "react-router-dom"; + + + +dayjs.locale("ru"); + +const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText; + +const root = createRoot(document.getElementById("root")!); + +root.render( + + + + + + + + + + + + + +); diff --git a/src/model/questionTypes/date.ts b/src/model/questionTypes/date.ts new file mode 100644 index 0000000..2b905e8 --- /dev/null +++ b/src/model/questionTypes/date.ts @@ -0,0 +1,24 @@ +import type { + QuizQuestionBase, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionDate extends QuizQuestionBase { + type: "date"; + content: { + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + dateRange: boolean; + time: boolean; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + }; +} diff --git a/src/model/questionTypes/emoji.ts b/src/model/questionTypes/emoji.ts new file mode 100644 index 0000000..4a9f7ef --- /dev/null +++ b/src/model/questionTypes/emoji.ts @@ -0,0 +1,28 @@ +import type { + QuizQuestionBase, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionEmoji extends QuizQuestionBase { + type: "emoji"; + content: { + /** Чекбокс "Можно несколько" */ + multi: boolean; + /** Чекбокс "Вариант "свой ответ"" */ + own: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + }; +} diff --git a/src/model/questionTypes/file.ts b/src/model/questionTypes/file.ts new file mode 100644 index 0000000..d1a6981 --- /dev/null +++ b/src/model/questionTypes/file.ts @@ -0,0 +1,34 @@ +import type { + QuizQuestionBase, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export const UPLOAD_FILE_TYPES_MAP = { + all: "Все типы файлов", + picture: "Изображения", + video: "Видео", + audio: "Аудио", + document: "Документ", +} as const; + +export type UploadFileType = keyof typeof UPLOAD_FILE_TYPES_MAP; + +export interface QuizQuestionFile extends QuizQuestionBase { + type: "file"; + content: { + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Чекбокс "Автозаполнение адреса" */ + autofill: boolean; + type: UploadFileType; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + }; +} diff --git a/src/model/questionTypes/images.ts b/src/model/questionTypes/images.ts new file mode 100644 index 0000000..a65f6ba --- /dev/null +++ b/src/model/questionTypes/images.ts @@ -0,0 +1,36 @@ +import type { + QuestionHint, + QuestionVariant, + QuizQuestionBase, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionImages extends QuizQuestionBase { + type: "images"; + content: { + /** Чекбокс "Вариант "свой ответ"" */ + own: boolean; + /** Чекбокс "Можно несколько" */ + multi: boolean; + /** Пропорции */ + xy: "1:1" | "1:2" | "2:1"; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Чекбокс "Большие картинки" */ + large: boolean; + /** Форма */ + format: "carousel" | "masonry"; + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Варианты (картинки) */ + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + largeCheck: boolean; + }; +} diff --git a/src/model/questionTypes/number.ts b/src/model/questionTypes/number.ts new file mode 100644 index 0000000..68f1370 --- /dev/null +++ b/src/model/questionTypes/number.ts @@ -0,0 +1,34 @@ +import type { + QuizQuestionBase, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionNumber extends QuizQuestionBase { + type: "number"; + content: { + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Диапазон */ + range: string; + /** Начальное значение */ + start: number; + /** Начальное значение */ + defaultValue: number; + /** Шаг */ + step: number; + steps: number; + /** Чекбокс "Выбор диапазона (два ползунка)" */ + chooseRange: boolean; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + form: "star" | "trophie" | "flag" | "heart" | "like" | "bubble" | "hashtag"; + }; +} diff --git a/src/model/questionTypes/page.ts b/src/model/questionTypes/page.ts new file mode 100644 index 0000000..9f829c8 --- /dev/null +++ b/src/model/questionTypes/page.ts @@ -0,0 +1,24 @@ +import type { + QuizQuestionBase, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionPage extends QuizQuestionBase { + type: "page"; + content: { + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + text: string; + picture: string; + originalPicture: string; + video: string; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + }; +} diff --git a/src/model/questionTypes/rating.ts b/src/model/questionTypes/rating.ts new file mode 100644 index 0000000..2f73ef1 --- /dev/null +++ b/src/model/questionTypes/rating.ts @@ -0,0 +1,30 @@ +import type { + QuizQuestionBase, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionRating extends QuizQuestionBase { + type: "rating"; + content: { + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + steps: number; + ratingExpanded: boolean; + /** Форма иконки */ + form: string; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + /** Позитивное описание рейтинга */ + ratingPositiveDescription: string; + /** Негативное описание рейтинга */ + ratingNegativeDescription: string; + }; +} diff --git a/src/model/questionTypes/result.ts b/src/model/questionTypes/result.ts new file mode 100644 index 0000000..782ed0d --- /dev/null +++ b/src/model/questionTypes/result.ts @@ -0,0 +1,21 @@ +import type { + QuizQuestionBase, + QuestionBranchingRule, + QuestionHint, +} from "./shared"; + +export interface QuizQuestionResult extends QuizQuestionBase { + type: "result"; + content: { + back: string; + originalBack: string; + video: string; + innerName: string; + text: string; + price: [number] | [number, number]; + useImage: boolean; + rule: QuestionBranchingRule, + hint: QuestionHint; + autofill: boolean; + }; +} diff --git a/src/model/questionTypes/select.ts b/src/model/questionTypes/select.ts new file mode 100644 index 0000000..f74cfdb --- /dev/null +++ b/src/model/questionTypes/select.ts @@ -0,0 +1,28 @@ +import type { + QuizQuestionBase, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionSelect extends QuizQuestionBase { + type: "select"; + content: { + /** Чекбокс "Можно несколько" */ + multi: boolean; + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Поле "Текст в выпадающем списке" */ + default: string; + variants: QuestionVariant[]; + rule: QuestionBranchingRule; + hint: QuestionHint; + back: string; + originalBack: string; + autofill: boolean; + }; +} diff --git a/src/model/questionTypes/shared.ts b/src/model/questionTypes/shared.ts new file mode 100644 index 0000000..85b563e --- /dev/null +++ b/src/model/questionTypes/shared.ts @@ -0,0 +1,125 @@ +import type { QuizQuestionDate } from "./date"; +import type { QuizQuestionEmoji } from "./emoji"; +import type { QuizQuestionFile } from "./file"; +import type { QuizQuestionImages } from "./images"; +import type { QuizQuestionNumber } from "./number"; +import type { QuizQuestionPage } from "./page"; +import type { QuizQuestionRating } from "./rating"; +import type { QuizQuestionSelect } from "./select"; +import type { QuizQuestionText } from "./text"; +import type { QuizQuestionVariant } from "./variant"; +import type { QuizQuestionVarImg } from "./varimg"; +import type { QuizQuestionResult } from "./result"; +import { nanoid } from "nanoid"; + +export interface QuestionBranchingRuleMain { + next: string; + or: boolean; + rules: { + question: string; //id родителя (пока что) + answers: string[] + }[] +} +export interface QuestionBranchingRule { + + children: string[], + //список условий + main: QuestionBranchingRuleMain[]; + parentId: string | null | "root"; + default: string; +} + +export interface QuestionHint { + /** Текст подсказки */ + text: string; + /** URL видео подсказки */ + video: string; +} + +export type QuestionVariant = { + id: string; + /** Текст */ + answer: string; + /** Текст подсказки */ + hints: string; + /** Дополнительное поле для текста, emoji, ссылки на картинку */ + extendedText: string; + /** Оригинал изображения (до кропа) */ + originalImageUrl: string; +}; + +export type QuestionType = + | "variant" + | "images" + | "varimg" + | "emoji" + | "text" + | "select" + | "date" + | "number" + | "file" + | "page" + | "rating" + | "result"; + +export interface QuizQuestionBase { + /** Stable id, generated on client */ + id: string; + quizId: number; + title: string; + description: string; + page: number; + type?: QuestionType | null; + expanded: boolean; + openedModalSettings: boolean; + deleted: boolean; + required: boolean; + deleteTimeoutId: number; + content: { + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + }; +} + + +export type AnyTypedQuizQuestion = + | QuizQuestionVariant + | QuizQuestionImages + | QuizQuestionVarImg + | QuizQuestionEmoji + | QuizQuestionText + | QuizQuestionSelect + | QuizQuestionDate + | QuizQuestionNumber + | QuizQuestionFile + | QuizQuestionPage + | QuizQuestionRating + | QuizQuestionResult; + + + +type FilterQuestionsWithVariants = T extends { + content: { variants: QuestionVariant[]; }; +} ? T : never; + +export type QuizQuestionsWithVariants = FilterQuestionsWithVariants; + + +export const createBranchingRuleMain: (targetId:string, parentId:string) => QuestionBranchingRuleMain = (targetId, parentId) => ({ + next: targetId, + or: false, + rules: [{ + question: parentId, + answers: [] as string[], + }] +}) +export const createQuestionVariant: () => QuestionVariant = () => ({ + id: nanoid(), + answer: "", + extendedText: "", + hints: "", + originalImageUrl: "", +}); diff --git a/src/model/questionTypes/text.ts b/src/model/questionTypes/text.ts new file mode 100644 index 0000000..351f732 --- /dev/null +++ b/src/model/questionTypes/text.ts @@ -0,0 +1,27 @@ +import type { + QuizQuestionBase, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionText extends QuizQuestionBase { + type: "text"; + content: { + id: number; + placeholder: string; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Чекбокс "Автозаполнение адреса" */ + autofill: boolean; + answerType: "single" | "multi"; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + onlyNumbers: boolean; + }; +} diff --git a/src/model/questionTypes/variant.ts b/src/model/questionTypes/variant.ts new file mode 100644 index 0000000..32c0c4b --- /dev/null +++ b/src/model/questionTypes/variant.ts @@ -0,0 +1,31 @@ +import type { + QuizQuestionBase, + QuestionVariant, + QuestionHint, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionVariant extends QuizQuestionBase { + type: "variant"; + content: { + /** Чекбокс "Длинный текстовый ответ" */ + largeCheck: boolean; + /** Чекбокс "Можно несколько" */ + multi: boolean; + /** Чекбокс "Вариант "свой ответ"" */ + own: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Варианты ответов */ + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + }; +} diff --git a/src/model/questionTypes/varimg.ts b/src/model/questionTypes/varimg.ts new file mode 100644 index 0000000..dd51c8d --- /dev/null +++ b/src/model/questionTypes/varimg.ts @@ -0,0 +1,28 @@ +import type { + QuestionHint, + QuestionVariant, + QuizQuestionBase, + QuestionBranchingRule, +} from "./shared"; + +export interface QuizQuestionVarImg extends QuizQuestionBase { + type: "varimg"; + content: { + /** Чекбокс "Вариант "свой ответ"" */ + own: boolean; + /** Чекбокс "Внутреннее название вопроса" */ + innerNameCheck: boolean; + /** Поле "Внутреннее название вопроса" */ + innerName: string; + /** Чекбокс "Необязательный вопрос" */ + required: boolean; + variants: QuestionVariant[]; + hint: QuestionHint; + rule: QuestionBranchingRule; + back: string; + originalBack: string; + autofill: boolean; + largeCheck: boolean; + replText: string; + }; +} diff --git a/src/model/quizSettings.ts b/src/model/quizSettings.ts new file mode 100644 index 0000000..db37e5c --- /dev/null +++ b/src/model/quizSettings.ts @@ -0,0 +1,168 @@ +import ChartPieIcon from "@icons/ChartPieIcon"; +import ContactBookIcon from "@icons/ContactBookIcon"; +import FlowArrowIcon from "@icons/FlowArrowIcon"; +import LayoutIcon from "@icons/LayoutIcon"; +import MegaphoneIcon from "@icons/MegaphoneIcon"; +import QuestionIcon from "@icons/QuestionIcon"; +import QuestionsMapIcon from "@icons/QuestionsMapIcon"; + + +export const quizSetupSteps = [ + { stepperText: "Настройка стартовой страницы", sidebarText: "Стартовая страница", sidebarIcon: LayoutIcon }, + { stepperText: "Задайте вопросы", sidebarText: "Вопросы", sidebarIcon: QuestionIcon }, + { stepperText: "Настройте авторезультаты", sidebarText: "Результаты", sidebarIcon: ChartPieIcon }, + // { stepperText: "Оценка графа карты вопросов", sidebarText: "Карта вопросов", sidebarIcon: QuestionsMapIcon }, + { stepperText: "Настройте форму контактов", sidebarText: "Форма контактов", sidebarIcon: ContactBookIcon }, + { stepperText: "Установите квиз", sidebarText: "Установка квиза", sidebarIcon: FlowArrowIcon }, + // { stepperText: "Запустите рекламу", sidebarText: "Запуск рекламы", sidebarIcon: MegaphoneIcon }, +] as const; + +export const maxQuizSetupSteps = quizSetupSteps.length; + +export type QuizStartpageType = "standard" | "expanded" | "centered" | null; + +export type QuizStartpageAlignType = "left" | "right" | "center"; + +export type QuizType = "quiz" | "form" | null; + +export type QuizResultsType = true | null; + +export interface QuizConfig { + type: QuizType; + noStartPage: boolean; + startpageType: QuizStartpageType; + results: QuizResultsType; + haveRoot: string | null; + resultInfo: { + when: 'before' | 'after' | 'email', + share: true | false, + replay: true | false, + theme: string, + reply: string, + replname: string, + } + startpage: { + description: string; + button: string; + position: QuizStartpageAlignType; + favIcon: string | null; + logo: string | null; + originalLogo: string | null; + background: { + type: null | "image" | "video"; + desktop: string | null; + originalDesktop: string | null; + mobile: string | null; + originalMobile: string | null; + video: string | null; + cycle: boolean; + }; + }; + formContact: { + title: string; + desc: string; + name: FCField; + email: FCField; + phone: FCField; + text: FCField; + address: FCField; + button: string + }; + info: { + phonenumber: string; + clickable: boolean; + orgname: string; + site: string; + law?: string; + }; + meta: string; +} + +type FCField = { + text: string + innerText: string + key: string + required: boolean + used: boolean +} + +export const defaultQuizConfig: QuizConfig = { + type: null, + noStartPage: false, + startpageType: null, + results: null, + haveRoot: null, + resultInfo: { + when: 'after', + share: false, + replay: false, + theme: "", + reply: "", + replname: "", + }, + startpage: { + description: "", + button: "", + position: "left", + favIcon: null, + logo: null, + originalLogo: null, + background: { + type: null, + desktop: null, + originalDesktop: null, + mobile: null, + originalMobile: null, + video: null, + cycle: false, + }, + }, + info: { + phonenumber: "", + clickable: false, + orgname: "", + site: "", + law: "", + }, + formContact: { + title: "", + desc: "", + name: { + text: "", + innerText: "", + key: "", + required: false, + used: true + }, + email: { + text: "", + innerText: "", + key: "", + required: false, + used: true + }, + phone: { + text: "", + innerText: "", + key: "", + required: false, + used: true + }, + text: { + text: "", + innerText: "", + key: "", + required: false, + used: false + }, + address: { + text: "", + innerText: "", + key: "", + required: false, + used: false + }, + button: "" + }, + meta: "", +}; diff --git a/src/model/settingsData.ts b/src/model/settingsData.ts new file mode 100644 index 0000000..da97f32 --- /dev/null +++ b/src/model/settingsData.ts @@ -0,0 +1,20 @@ +import { AnyTypedQuizQuestion } from "@model/questionTypes/shared"; +import { QuizConfig } from "@model/quizSettings"; + +export type QuestionsStore = { + items: (AnyTypedQuizQuestion)[]; + settings: Settings; + cnt: number; +}; + +export interface Settings { + + fp: boolean, + rep: boolean, + name: string, + lim: number, + due: number, + delay: number, + pausable: boolean, + cfg: QuizConfig +} \ No newline at end of file diff --git a/src/mui.d.ts b/src/mui.d.ts new file mode 100755 index 0000000..446edc4 --- /dev/null +++ b/src/mui.d.ts @@ -0,0 +1,50 @@ +import "@material-ui/styles"; + +declare module "@mui/material/styles" { + interface Palette { + lightPurple: Palette["primary"], + darkPurple: Palette["primary"], + brightPurple: Palette["primary"], + fadePurple: Palette["primary"], + grey1: Palette["primary"], + grey2: Palette["primary"], + grey3: Palette["primary"], + grey4: Palette["primary"], + orange: Palette["primary"], + navbarbg: Palette["primary"], + } + interface PaletteOptions { + lightPurple?: PaletteOptions["primary"], + darkPurple?: PaletteOptions["primary"], + brightPurple?: PaletteOptions["primary"], + fadePurple?: PaletteOptions["primary"], + grey1?: PaletteOptions["primary"], + grey2?: PaletteOptions["primary"], + grey3?: PaletteOptions["primary"], + grey4?: PaletteOptions["primary"], + orange?: PaletteOptions["primary"], + navbarbg?: PaletteOptions["primary"], + } + interface TypographyVariants { + infographic: React.CSSProperties; + p1: React.CSSProperties; + } + interface TypographyVariantsOptions { + infographic?: React.CSSProperties; + p1?: React.CSSProperties; + } +} + +declare module "@mui/material/Typography" { + interface TypographyPropsVariantOverrides { + infographic: true; + p1: true; + } +} + +type DataAttributeKey = `data-${string}`; +declare module 'react' { + interface HTMLAttributes extends AriaAttributes, DOMAttributes { + [dataAttribute: DataAttributeKey]: unknown; + } +} diff --git a/src/pages/ViewPublicationPage/ApologyPage.tsx b/src/pages/ViewPublicationPage/ApologyPage.tsx new file mode 100644 index 0000000..ac27537 --- /dev/null +++ b/src/pages/ViewPublicationPage/ApologyPage.tsx @@ -0,0 +1,22 @@ +import { Box, Typography } from "@mui/material"; + +export const ApologyPage = ({message}:{message: string}) => { + return ( + + {message || "что-то пошло не так"} + + + + ) +} \ No newline at end of file diff --git a/src/pages/ViewPublicationPage/ContactForm.tsx b/src/pages/ViewPublicationPage/ContactForm.tsx new file mode 100644 index 0000000..45583a8 --- /dev/null +++ b/src/pages/ViewPublicationPage/ContactForm.tsx @@ -0,0 +1,237 @@ +import { Box, Typography, Button, Paper, TextField, Link, InputAdornment } from "@mui/material"; +import NameIcon from "@icons/ContactFormIcon/NameIcon"; +import EmailIcon from "@icons/ContactFormIcon/EmailIcon"; +import PhoneIcon from "@icons/ContactFormIcon/PhoneIcon"; +import TextIcon from "@icons/ContactFormIcon/TextIcon"; +import AddressIcon from "@icons/ContactFormIcon/AddressIcon"; +import { useDebouncedCallback } from "use-debounce"; + +import CustomCheckbox from "@ui_kit/CustomCheckbox"; +import { useEffect, useRef, useState } from "react"; +import { useQuestionsStore } from "@root/quizData/store"; + +import type { AnyTypedQuizQuestion } from "../../model/questionTypes/shared"; +import { enqueueSnackbar } from "notistack"; +import { sendFC } from "@api/quizRelase"; + +type ContactFormProps = { + currentQuestion: AnyTypedQuizQuestion; + showResultForm: boolean; + setShowContactForm: (show: boolean) => void; + setShowResultForm: (show: boolean) => void; +}; + +const icons = [ + { type: "name", icon: NameIcon, defaultText: "Введите имя", defaultTitle: "имя", backendName: "name" }, + { type: "email", icon: EmailIcon, defaultText: "Введите Email", defaultTitle: "Email", backendName: "email" }, + { type: "phone", icon: PhoneIcon, defaultText: "Введите номер телефона", defaultTitle: "номер телефона", backendName: "phone" }, + { type: "text", icon: TextIcon, defaultText: "Введите фамилию", defaultTitle: "фамилию", backendName: "adress" }, + { type: "address", icon: AddressIcon, defaultText: "Введите адрес", defaultTitle: "адрес", backendName: "adress" }, +] + +export const ContactForm = ({ + currentQuestion, + showResultForm, + setShowContactForm, + setShowResultForm, +}: ContactFormProps) => { + const { settings } = useQuestionsStore() + + const [ready, setReady] = useState(false) + + const followNextForm = () => { + setShowContactForm(false); + setShowResultForm(true); + }; + + return ( + + + + + + {settings?.cfg.formContact.title || "Заполните форму, чтобы получить результаты теста"} + + + { + settings?.cfg.formContact.desc && + + {settings?.cfg.formContact.desc} + + } + + + + + + + + + + + { + ( + + )} + + + { setReady(target.checked) }} checked={ready} /> + + С + Положением об обработке персональных данных + и + Политикой конфиденциальности + ознакомлен + + + + + + + ); +}; + +const Inputs = (currentQuestion: any) => { + const { settings, items } = useQuestionsStore() + + + const [name, setName] = useState("") + const [email, setEmail] = useState("") + const [phone, setPhone] = useState("") + const [text, setText] = useState("") + const [adress, setAdress] = useState("") + + + const inputHC = useDebouncedCallback(async () => { + console.log("start input") + + const body = {} + //@ts-ignore + if (name.length > 0) body.name = name + //@ts-ignore + if (email.length > 0) body.email = email + //@ts-ignore + if (phone.length > 0) body.phone = phone + //@ts-ignore + if (text.length > 0) body.text = text + //@ts-ignore + if (adress.length > 0) body.adress = adress + + console.log(body) + if (Object.keys(body).length > 0) { + try { + await sendFC({ + questionId: currentQuestion.id, + body: body, + //@ts-ignore + qid: settings.qid + }) + + } catch (e) { + console.log(e) + enqueueSnackbar("ответ не был засчитан") + } + + } + }, 1000); + + useEffect(() => { + inputHC() + }, [name, email, phone, text, adress]) + //@ts-ignore + const FC: any = settings?.cfg.formContact + + //@ts-ignore + const Name = setName(target.value)} id={name} title={FC["name"].innerText || "Введите имя"} desc={FC["name"].text || "имя"} Icon={NameIcon} /> + //@ts-ignore + const Email = setEmail(target.value)} id={email} title={FC["email"].innerText || "Введите Email"} desc={FC["email"].text || "Email"} Icon={EmailIcon} /> + //@ts-ignore + const Phone = setPhone(target.value)} id={phone} title={FC["phone"].innerText || "Введите номер телефона"} desc={FC["phone"].text || "номер телефона"} Icon={PhoneIcon} /> + //@ts-ignore + const Text = setText(target.value)} id={text} title={FC["text"].innerText || "Введите фамилию"} desc={FC["text"].text || "фамилию"} Icon={TextIcon} /> + //@ts-ignore + const Adress = setAdress(target.value)} id={adress} title={FC["address"].innerText || "Введите адрес"} desc={FC["address"].text || "адрес"} Icon={AddressIcon} /> + + + + //@ts-ignore + if (items.some((data) => data.used)) { + return <> + {FC["name"].used ? Name : <>} + {FC["email"].used ? Email : <>} + {FC["phone"].used ? Phone : <>} + {FC["text"].used ? Text : <>} + {FC["address"].used ? Adress : <>} + + } else { + return <> + {Name} + {Email} + {Phone} + + } +} + +const CustomInput = ({ title, desc, Icon, onChange }: any) => { + return + {title} + , + }} + /> + +} diff --git a/src/pages/ViewPublicationPage/Footer.tsx b/src/pages/ViewPublicationPage/Footer.tsx new file mode 100644 index 0000000..90998df --- /dev/null +++ b/src/pages/ViewPublicationPage/Footer.tsx @@ -0,0 +1,283 @@ +import { useState, useEffect } from "react"; +import { Box, Button, useTheme } from "@mui/material"; + +import type { + AnyTypedQuizQuestion, + QuizQuestionBase, +} from "../../model/questionTypes/shared"; +import { useQuestionsStore } from "@root/quizData/store"; +import { getQuestionById } from "@root/quizData/actions"; +import { useQuizViewStore } from "@root/quizView/store"; +import { enqueueSnackbar } from "notistack"; + +type FooterProps = { + setCurrentQuestion: (step: AnyTypedQuizQuestion) => void; + question: AnyTypedQuizQuestion; + setShowContactForm: (show: boolean) => void; + setShowResultForm: (show: boolean) => void; +}; + +export const Footer = ({ + setCurrentQuestion, + question, + setShowContactForm, + setShowResultForm, +}: FooterProps) => { + const theme = useTheme(); + + const { settings, items } = useQuestionsStore(); + const { answers } = useQuizViewStore(); + + const [disablePreviousButton, setDisablePreviousButton] = useState(false); + const [disableNextButton, setDisableNextButton] = useState(false); + + const linear = !items.find( + ({ content }) => content.rule.parentId === "root" + ); + + useEffect(() => { + // Логика для аргумента disabled у кнопки "Назад" + if (linear) { + const questionIndex = items.findIndex(({ id }) => id === question.id); + + const previousQuestion = items[questionIndex - 1]; + + if (previousQuestion) { + setDisablePreviousButton(false); + } else { + setDisablePreviousButton(true); + } + } else { + if (question?.content.rule.parentId === "root") { + setDisablePreviousButton(true); + } else { + setDisablePreviousButton(false); + } + } + + // Логика для аргумента disabled у кнопки "Далее" + const answer = answers.find( + ({ questionId }) => questionId === question.id + ); + + if ("required" in question.content && question.content.required && answer) { + setDisableNextButton(false); + + return; + } + + if ( + "required" in question.content && + question.content.required && + !answer + ) { + setDisableNextButton(true); + + return; + } + + if (linear) { + return; + } + + const nextQuestionId = getNextQuestionId(); + if (nextQuestionId) { + setDisableNextButton(false); + } else { + const nextQuestion = getQuestionById( + question.content.rule.default + ); + + if (nextQuestion?.type) { + setDisableNextButton(false); + } + } + }, [question, answers]); + + const showResult = (nextQuestion:any) => { + + console.log(nextQuestion) + + if (nextQuestion && settings?.cfg.resultInfo.when === "before") { + setShowResultForm(true); + } else { + setShowContactForm(true); + } + }; + + const getNextQuestionId = () => { + if (answers.length) { + const answer = answers.find( + ({ questionId }) => questionId === question.id + ); + + let readyBeNextQuestion = ""; + + (question as QuizQuestionBase).content.rule.main.forEach( + ({ next, rules }) => { + let longerArray = Math.max( + rules[0].answers.length, + answer?.answer && Array.isArray(answer?.answer) + ? answer?.answer.length + : [answer?.answer].length + ); + + for ( + var i = 0; + i < longerArray; + i++ // Цикл по всем эле­мен­там бОльшего массива + ) { + if (Array.isArray(answer?.answer)) { + if ( + answer?.answer.find((item) => + String(item === rules[0].answers[i]) + ) + ) { + readyBeNextQuestion = next; // Ес­ли хоть один эле­мент от­ли­ча­ет­ся, мас­си­вы не рав­ны + } + + return; + } + + if (String(rules[0].answers[i]) === answer?.answer) { + readyBeNextQuestion = next; // Ес­ли хоть один эле­мент от­ли­ча­ет­ся, мас­си­вы не рав­ны + } + } + } + ); + + return readyBeNextQuestion; + } + }; + + const followPreviousStep = () => { + if (linear) { + const questionIndex = items.findIndex(({ id }) => id === question.id); + + const previousQuestion = items[questionIndex - 1]; + + if (previousQuestion) { + setCurrentQuestion(previousQuestion); + } + + return; + } + + if (question?.content.rule.parentId !== "root") { + const parent = getQuestionById(question?.content.rule.parentId); + if (parent?.type) { + setCurrentQuestion(parent); + } else { + enqueueSnackbar("не могу получить предыдущий вопрос"); + } + } else { + enqueueSnackbar("вы находитесь на первом вопросе"); + } + }; + + const followNextStep = () => { + if (linear) { + const questionIndex = items.findIndex(({ id }) => id === question.id); + const nextQuestion = items[questionIndex + 1]; + + console.log(nextQuestion) + if (nextQuestion && nextQuestion.type !== "result") { + setCurrentQuestion(nextQuestion); + } else { + showResult(nextQuestion); + } + + return; + } + + const nextQuestionId = getNextQuestionId(); + + if (nextQuestionId) { + const nextQuestion = getQuestionById(nextQuestionId); + + if (nextQuestion?.type && nextQuestion.type !== "result") { + setCurrentQuestion(nextQuestion); + return; + } else { + enqueueSnackbar("не могу получить последующий вопрос"); + } + } else { + const nextQuestion = getQuestionById( + question.content.rule.default + ); + if (nextQuestion?.type && nextQuestion.type !== "result") { + setCurrentQuestion(nextQuestion); + } else { + showResult(undefined); + } + } + }; + + return ( + + + + {/* Шаг + + {stepNumber} */} + {/* */} + {/* Из + + {items.length} + */} + + + + + + ); +}; diff --git a/src/pages/ViewPublicationPage/Question.tsx b/src/pages/ViewPublicationPage/Question.tsx new file mode 100644 index 0000000..b4cde83 --- /dev/null +++ b/src/pages/ViewPublicationPage/Question.tsx @@ -0,0 +1,119 @@ +import { useState, useEffect } from "react"; +import { Box } from "@mui/material"; + +import { useQuestionsStore } from "@root/quizData/store" +import { getQuestionById } from "@root/quizData/actions"; + +import { Variant } from "./questions/Variant"; +import { Images } from "./questions/Images"; +import { Varimg } from "./questions/Varimg"; +import { Emoji } from "./questions/Emoji"; +import { Text } from "./questions/Text"; +import { Select } from "./questions/Select"; +import { Date } from "./questions/Date"; +import { Number } from "./questions/Number"; +import { File } from "./questions/File"; +import { Page } from "./questions/Page"; +import { Rating } from "./questions/Rating"; +import { Footer } from "./Footer"; +import { ContactForm } from "./ContactForm"; +import { ResultForm } from "./ResultForm"; + +import type { QuestionType } from "@model/questionTypes/shared"; +import type { AnyTypedQuizQuestion } from "../../model/questionTypes/shared"; + +type QuestionProps = { + questions: AnyTypedQuizQuestion[]; +}; + +const QUESTIONS_MAP: any = { + variant: Variant, + images: Images, + varimg: Varimg, + emoji: Emoji, + text: Text, + select: Select, + date: Date, + number: Number, + file: File, + page: Page, + rating: Rating, +}; + +export const Question = ({ questions }: QuestionProps) => { + const { settings, cnt, items } = useQuestionsStore() + const [currentQuestion, setCurrentQuestion] = + useState(); + const [showContactForm, setShowContactForm] = useState(false); + const [showResultForm, setShowResultForm] = useState(false); + + useEffect(() => { + const nextQuestion = getQuestionById(settings?.cfg.haveRoot || ""); + + if (nextQuestion?.type) { + setCurrentQuestion(nextQuestion); + + return; + } + + setCurrentQuestion(questions[0]); + console.log(currentQuestion) + console.log(questions[0]) + }, []); + + if (!currentQuestion) return <>не смог отобразить вопрос; + + const QuestionComponent = + QUESTIONS_MAP[currentQuestion.type as Exclude]; + + console.log("showResultForm " , showResultForm) + return ( + + {!showContactForm && !showResultForm && ( + + + + )} + {showResultForm && settings?.cfg.resultInfo.when === "before" && ( + + )} + {showContactForm && ( + + )} + {showResultForm && settings?.cfg.resultInfo.when === "after" && ( + + )} + {!showContactForm && !showResultForm && ( +